如何使前端应用程序访问节点服务器API

Question

我已经通过creat-react-app创建了一个前端应用程序。
命令“npm run start”可以创建一个webpack-dev-server，并为我的
前端应用程序提供开发服务。问题来了：

1. 我的前端应用程序必须从我之前创建的节点服务器请求一些api。
2. 默认情况下create-react-app在端口3000上启动webpack-dev-server
3. 我的节点服务器在端口3001上启动
4. 直接访问端口3001可能导致跨源问题

我怎样才能优雅地从这些问题开始我的发展故事！

Answer 1

解决节点服务器中的跨源问题有两种方法,

1. 使用cors节点模块

首先安装cors模块。NPM安装CORS

然后在应用程序中使用它

const Express       = require("express");
const BodyParser    = require("body-parser");
const Cors          = require("cors");

const app = Express();
app.use(Cors());

app.use(BodyParser.urlencoded({ extended: false }));
app.use(BodyParser.json());

app.listen(3001, 'localhost', (err) => {
    if(err) {
        console.log(err);
        process.exit(-1);
    }
    console.log("Server listen port 8083");
});

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");
    res.header("Access-Control-Allow-Methods", "GET, POST, OPTIONS, PUT, DELETE");
    next();
});