Question

我有一个在Azure中托管的angular cli项目，并且正在对不同的域（在Zoho创建者中）进行API调用，所以我遇到了CROS问题，因此我尝试了一些没有运气的解决方案。

错误是

“从原点“ https://xxxxxxx对“ https://yyyyyy”处XMLHttpRequest的访问已被CORS策略阻止：所请求的资源上没有“ Access-Control-Allow-Origin”标头。

我使用expressJS作为后端，并尝试添加标头，但似乎不起作用，我不知道自己缺少的内容

APP.JS

const express = require('express');
const bodyParser = require('body-parser');
const path = require('path');
const http = require('http');
const app = express();  
// parse application/x-www-form-urlencoded
var cors = require('cors');
// Use this after the variable declaration
app.use(cors({origin: '*'}));
// parse application/json
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));

// Angular DIST output folder
app.use(express.static(path.join(__dirname, 'dist')));

// Send all other requests to the Angular app
app.get('*', (req, res) => {
    res.sendFile(path.join(__dirname, 'dist/index.html'));
});

// Add headers
app.use(function (req, res, next) {

    // Website you wish to allow to connect
    res.setHeader('Access-Control-Allow-Origin', 'http://localhost:5000');

    // Request methods you wish to allow
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');

    // Request headers you wish to allow
    res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type');

    // Set to true if you need the website to include cookies in the requests sent
    // to the API (e.g. in case you use sessions)
    res.setHeader('Access-Control-Allow-Credentials', true);

    // Pass to next layer of middleware
    next();
});

//Set Port
const port = process.env.PORT || '5000';
app.set('port', port);

const server = http.createServer(app);

server.listen(port, () => console.log(`Running on localhost:${port}`));

Answer 1

我无法确切地知道发生了什么，但是有一些东西使我感到喧嚣。

   res.setHeader('Access-Control-Allow-Origin', 'http://localhost:5000');

该代码表示您只能接收来自http://localhost:5000的请求。您是否要从http://localhost:5000中使用它？我不这么认为，因为node.js正在使用端口5000。如果要使用它，必须将 Access-Control-Allow-Origin 设置为尝试使用它的服务器或站点。

例如，我的机器上的Angular中有一个使用端口4200的应用程序，因此请求标头应为：

   res.setHeader('Access-Control-Allow-Origin', 'http://localhost:4200');

或者，您可以使用*允许所有操作，但这并不安全。

   res.setHeader('Access-Control-Allow-Origin', '*');

角度应用程序中的请求资源上不存在“ Access-Control-Allow-Origin”标头

1 个答案: