Express 应用程序的访问来源问题答案

【问题标题】：Access origin issue on Express applicationExpress 应用程序的访问来源问题
【发布时间】：2019-03-18 06:34:03
【问题描述】：

我创建了一个带有 angular ui 的 express 应用程序。我已经关注了 app.js 文件

var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');

var indexRouter = require('./routes/index');
var userRouter = require('./routes/user');

var app = express();

// view engine setup
app.use(express.static(__dirname + '/dist'));

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();
});


app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', indexRouter);
app.use('/student', userRouter);

// catch 404 and forward to error handler
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(createError(404));
});



// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

module.exports = app;

我遇到了这样的错误

request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin. is therefore not allowed access.

【问题讨论】：

关于发送请求的前端 JavaScript，它在哪里运行？当你说“我用 Angular ui 创建了一个快速应用程序”时，你的意思是你发出请求的前端 JavaScript 代码是那个应用程序的前端吗？如果是这样，您的前端 JavaScript 代码将请求发送到哪里？其他一些您无法控制的外部网站？

标签： node.js angular express web-applications cors

【解决方案1】：

尝试一次设置多个字段，传递一个对象作为参数。例如， res.set({ "Access-Control-Allow-Origin", "*", "Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept" });

【讨论】：

【解决方案2】：

你能不能这样实现并检查一下。

或

如果您现在想快速工作，可以使用 chrome 的 hack 代码。运行这个

在 Windows 中，将此命令粘贴到运行窗口中 chrome.exe --user-data-dir="C:/Chrome 开发会话" --disable-web-security

【讨论】：

【解决方案3】：

其实这个问题必须从服务器端（API）来解决。如果您在本地进行测试或者您在不同的域中，那么您必须允许 API 实现中的 CORS。

【讨论】：

【解决方案4】：

您可以使用 chrome 的 CORS 扩展进行开发

【讨论】：