如何解决 express js 中没有“Access-Control-Allow-Origin”？答案

【问题标题】：How to solve No 'Access-Control-Allow-Origin' in express js?如何解决 express js 中没有“Access-Control-Allow-Origin”？
【发布时间】：2019-12-18 20:09:24
【问题描述】：

我知道这个问题已经得到解答，其中一些有效，但对我来说不是。我正在努力寻找解决这个问题的方法：

 Access to XMLHttpRequest at 'http://lolcahost:9000/api/users' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我已经尝试下载 chrome 扩展，但没有帮助我，使用 app.use(cors()) 也没有帮助。

这是我在 expressjs 中的代码

    /* Importing all necessary packages. */
const express = require('express');
const cors = require('cors');
const bodyParser = require('body-parser');

/* Default port */
const port = process.env.PORT || 9000;
/* Creating express object */
const app = express();

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));
app.use('/api', require('./routes/route'));
app.use(cors());


app.get('/', (request, response) => {
    response.json({
        HOME: "HELLO JSON"
    })
});

app.listen(port, () => {
    console.log(`Listening at port ${port}`)
});

这是我在 vuejs 中尝试渲染数据的代码。

getUsers() {
            axios
                .get("http://localhost:9000/api/users/")
                .then(response => (this.results = response.data))
                .catch(error => console.log(error));
        }

【问题讨论】：

标签： node.js express vue.js cors

【解决方案1】：

试试这个。

    app.use(function(req, res, next) {
       res.header("Access-Control-Allow-Origin", "http://localhost:8080"); // update to match the domain you will make the request from
       res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
       next();
    });

或

    app.use(function(req, res, next) {
        res.header("Access-Control-Allow-Origin", "*");
        res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
        next();
    });

【讨论】：

【解决方案2】：

您正在使用cors 中间件之后 /api 路由。所以，实际上cors middlware 甚至没有被调用。将cors 放在其他中间件之上。

const app = express();

app.use(cors());
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));
app.use('/api', require('./routes/route'));

中间件按照它们的初始化顺序被调用。现在，/api 首先被初始化并且不是中间件（不调用next() 函数）所以在路由之后任何中间件基本上都是无法访问的代码。

【讨论】：

不知道！谢谢