Question

我很难让CORS正常工作。我正在尝试从设置的Heroku应用中获取数据。我正在从Redux获取，并使用ExpressJS作为后端。我一直在浏览CORS文档，但仍然无法弄清楚。 enter link description here

这就是Express的外观

var express = require('express');
var router = express.Router();
var cors = require('cors')

router.options('/', cors())

router.use((req, res, next) => {
   res.append('Access-Control-Allow-Origin', ['*']);
   res.append('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
   res.append('Access-Control-Allow-Headers', 'Content-Type');
   next();
});

router.get('/', cors(), function(req, res, next) {
   res.json({...})
}

我在我的应用中将代理设置为http://localhost:3001/，但是我的应用正在3000上运行。为了避免出现这种情况，我将其包括在内，但我不知道是什么原因。

我的Redux文件是这样设置的

return dispatch => {
  const url = "https://app-name.herokuapp.com/users";
  return fetch(url, {
    method: 'GET',
    mode: 'cors',
    headers: { 'Content-Type': 'text' }
})

完整错误为：“无法加载https://app-name.herokuapp.com/users：对预检请求的响应未通过访问控制检查：所请求的资源上没有'Access-Control-Allow-Origin'标头。Origin'因此http://localhost:3000'被禁止访问。”

Answer 1

var express = require('express');

var app = express();

app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Methods", "GET,POST");
    // res.header("Access-Control-Allow-Headers", "Content-Type");
    next();
});

CORS ---对预检请求的响应未通过访问控制检查

1 个答案: