如何临时解决Egg 的post跨域问题

Question

使用Egg调用POST请求的时候,浏览器会触发405报错.在网上找了很久的答案,这里是一篇https://cnodejs.org/topic/597...
但是按照题主的办法设置好像没办法解决.

'use strict';

module.exports = appInfo => {
  const config = {};

  // should change to your own
  config.keys = appInfo.name + '_1499075971408_463';

  //关闭csrf
  config.security = {
    csrf: {
      enable: false,
      ignoreJSON: true
    },
    // 白名单
    domainWhiteList: [ 'http://localhost:8080' ]
  };

  config.cors = {
    allowMethods: 'GET,HEAD,PUT,POST,DELETE,PATCH,OPTIONS',
  };

  // 加载 errorHandler 中间件
  config.middleware = ['errorHandler'];

  return config;
};

利用POSTMAN的时候,接口完全正常.我这里是前后端分离进行开发,所以利用两个node后台相互调用方便开发.GET请求的时候会有跨域问题,我利用Chrome的插件access-control...解决了.但是进行POST/DELETE等这些请求就会报405错误.

有没有好的解决办法.暂时只想到将vue这块build到服务器避免掉跨域问题.但是这样很影响效率啊....求助!!

Answer 1

用了 egg-cors 插件, 除了在 config 里配置，还要在 plugin.js 里面 enable 这个插件，参考 egg-cors

Answer 2

rbe 说的对，请确定是否开启了 egg-cors 插件

exports.cors = {
  enable: true,
  package: 'egg-cors',
};

Answer 3

const { ctx } = this
ctx.set('Access-Control-Allow-Origin', '*')

在你要跨域的那个接口里写上这行代码就行了，不用 egg-cors 插件

如果想要所有的接口都允许跨域，就在中间件里写这行代码

不过现在前端使用的网络请求包（JQ.ajax/axios），都会先用OPTION方法调一下你接口，成功后再用GET/POST等方法调用你接口

所以以上方法估计还是不行，如果你懒，可以让前端用es6原生的 fetch API 来调用你接口，否则还是乖乖用 egg-cors 吧

参考这篇文章设置egg-cors很快的： https://www.jianshu.com/p/c1c...
其中，domainWhiteList: '*'改为 domainWhiteList: ['*']

Answer 4

这里有个问题，如果是做微信验证，需要跳转重定向，那么即使这样设置也会出现跨域，求解