POST 尽管使用了 CORS，但对 expressjs 的请求仍无法正常工作

Question

我的组件中有这个功能，它应该向快递发送 POST 请求 API:

onSubmit (evt) {

      evt.preventDefault();
      //alert(JSON.stringify(this.description));
      axios.post('http://localhost:3000/api/v1/addComment', {
        articleid: this.id,
        description: this.description
      });

    }

这是请求发送到的 API：

router.post('/api/v1/addComment/', function(req, res){ 
  var newComment = req.body;
  //newComment.id = parseInt(commentsData.length);
  commentsData.comments.push(newComment);
    
  
  fs.writeFile('app/data/comments.json', JSON.stringify(commentsData), 'utf8', function(err){
       console.log(err);
  });
  
  res.setHeader("Access-Control-Allow-Origin", "*");  
  res.json(newComment);
});

我还在我的 express app.js 文件

中要求了必要的 CORS 依赖项

var express = require('express');
var reload = require('reload');
var app = express();
var cors = require('cors');
var dataFile = require('./data/articles.json');

app.set('port', process.env.PORT || 3000 );
//app.set('appData', dataFile);
app.set('view engine', 'ejs');
app.set('views', 'app/views');

app.use(express.static('app/public'));
app.use(require('./routes/index'));
app.use(require('./routes/comments'));
app.use(cors());

var server = app.listen(app.get('port'), function(){
  console.log('Listening on port ' + app.get('port'));
});

reload(server, app);

API 路由工作正常，当我收到请求时，但是，当我执行 post 请求时，我总是收到此错误：

Failed to load http://localhost:3000/api/v1/addComment: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access. createError.js?16d0:16 Uncaught (in promise) Error: Network Error at createError (createError.js?16d0:16) at XMLHttpRequest.handleError (xhr.js?ec6c:87)

我也试过发送 headers 对象和 axios post 请求，但没有成功。根据我对 CORS 的研究，我知道使用 CORS 是允许来自不同域的对 API 的请求所必需的。我的 express 服务器在本地主机 3000 上运行，而我的 vue 服务器在本地主机 8080 上运行。

有人可以解释为什么我在 express 中要求并使用 CORS 时仍然收到此错误吗？

Answer 1

尝试移动 app.use(cors()) 在你分配路线之前起来

Answer 2

飞行前部分是指 xhr 在实际 POST 之前向 /api/v1/addComment 发出 OPTIONS 请求。您需要配置 cors 来处理：

// preflight for aspecific route
router.options('/api/v1/addComment/', cors())

// or preflight for all routes
router.options('*', cors())

注意：您需要在定义其余路由之前进行这些调用。请参阅 npmjs 上的 docs。

POST 尽管使用了 CORS，但对 expressjs 的请求仍无法正常工作

POST Request to expressjs not working despite using CORS

node.js

express

vue.js

axios

vuejs2