首页 > 解决方案 > 无法在我的快递应用中解决 CORS 政策

问题描述

我不断收到此错误

被 CORS 策略阻止:请求的资源上不存在“Access-Control-Allow-Origin”标头。如果不透明的响应满足您的需求,请将请求的模式设置为“no-cors”以获取禁用 CORS 的资源。

这是我的快递代码

const express = require('express')
const app = express()
const port = 3001

var redis = require("redis"),
    client = redis.createClient();

const {promisify} = require('util')
const getAsync = promisify(client.get).bind(client);

app.get('/jobs', async (req, res) => {
    const jobs = await getAsync('github');
    res.header("Access-Control-Allow-Origin", "http://localhost:3000");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    return res.send(jobs);
})

app.listen(port, () => console.log(`Example app listening on port ${port}!`))

标签: javascriptreactjsexpress

解决方案


尝试cors中间件包以在 express 应用程序中启用内核。

安装为生产依赖项。

npm install --save cors

例子:

const express = require('express');
const cors = require('cors');
const app = express();
const port = 3001
var redis = require("redis"),
    client = redis.createClient();
const { promisify } = require('util')
const getAsync = promisify(client.get).bind(client);
const allowedOrigins = ["http://localhost:3000"];

app.use(cors({
    origin: function (origin, callback) {
        if (!origin) return callback(null, true);
        if (allowedOrigins.indexOf(origin) === -1) {
            var msg = 'The CORS policy for this site does not ' +
                'allow access from the specified Origin.';
            return callback(new Error(msg), false);
        }
        return callback(null, true);
    }
}));

app.get('/jobs', async (req, res) => {
    const jobs = await getAsync('github');
    res.header("Access-Control-Allow-Origin", "http://localhost:3000");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    return res.send(jobs);
})
app.listen(port, () => console.log(`Example app listening on port ${port}!`))

推荐阅读