midway 跨域

midway 跨域

最近准备上手midway.js来开发点东西。开发的API,在前端(vue+axios)调用时总是提示跨域,但ajax又能调用。浪费了很多时间,在此记录一下。

midway 配置:

之前搜索过跨域问题解决办法:

csrf 配置

//在”src/config/config.default.ts”,添加代码如下

export default (appInfo: EggAppInfo) => {
  const config = <DefaultConfig> {};
  ……
  // 跨域  @midwayjs/web 默认添加了此项配置的
  config.security = {
    csrf: {
      enable: false, 
    },
    
    domainWhiteList: ['http://127.0.0.1:9384'], // 允许跨域的域名
  };
  ……
}

<font color=red>提示:很多文档说的解决跨域,这样一设置就OK了,实践告诉我关这个配置还是不行的!!</font>

security 配置项是eggjs中对安全的一项配置,详见: 安全威胁 CSRF 的防范

CORS 配置

安装 egg-cors

$ npm i egg-cors --save 

配置插件启用

// src/config/plugin.ts
exports.cors = {
  enable: true,
  package: 'egg-cors',
}

配置 cors 插件

// src/config/config.default.ts
export const cors = {
  // {string|Function} origin: '*',
  // {string|Array} allowMethods: 'GET,HEAD,PUT,POST,DELETE,PATCH'
};

如果这个地方设置了origin: '*',那么在security下设置的domainWhiteList无用了

另一种设置方法

origin(ctx) {
     // return "*"; // 允许来自所有域名请求
     // return ctx.header.origin;// 当*无法使用时,使用这句,同样允许所有跨域
     // return 'http://localhost:8080'; //单个跨域请求
     // 允许多个跨域
     const allowCors = [
       'http://localhost:9384',
       'http://127.0.0.1:9384',
       'http://172.16.92.62:9384',
     ];
     return allowCors.indexOf(ctx.header.origin) > -1 ? ctx.header.origin : '';
},

<font color=red>经测试allowMethods 好像不管用</font>

如果只想特定域名,需要在 security 插件处配置。详见 上面csrf

domainWhiteList: ['http://127.0.0.1:9384'], // 允许跨域的域名
经测试:在security 下指定了此项,config.cors不用设置也行

vue axios

如果你在axios设置中添加了<font color=red> withCredentials=true</font> 这个选项,那么请求也会造成跨域

参考:https://blog.csdn.net/hermits...

后端设置方法:

config.cors{
     credentials: true, 
     origin: 'http://127.0.0.1:9384', // 注意,这个地方不能使用 * 可以使用上面介绍的函数方式,必须要包含你的前端地址
}

其他框架

参考: https://www.yuque.com/midwayj...

9 声望
1 粉丝
0 条评论
推荐阅读
TypeOrm 软删除
一般说来,createdTime和updatedTime在创建和修改时,时间都会自动更新的,但是deletedTime这个时间段如何更新呢,找遍文档和百度了一大圈都没有(想哭)!

wujh阅读 3.6k

从零搭建 Node.js 企业级 Web 服务器(零):静态服务
过去 5 年,我前后在菜鸟网络和蚂蚁金服做开发工作,一方面支撑业务团队开发各类业务系统,另一方面在自己的技术团队做基础技术建设。期间借着 Node.js 的锋芒做了不少 Web 系统,有的至今生气蓬勃、有的早已夭折...

乌柏木144阅读 12k评论 10

从零搭建 Node.js 企业级 Web 服务器(十五):总结与展望
总结截止到本章 “从零搭建 Node.js 企业级 Web 服务器” 主题共计 16 章内容就更新完毕了,回顾第零章曾写道:搭建一个 Node.js 企业级 Web 服务器并非难事,只是必须做好几个关键事项这几件必须做好的关键事项就...

乌柏木63阅读 6k评论 16

从零搭建 Node.js 企业级 Web 服务器(一):接口与分层
分层规范从本章起,正式进入企业级 Web 服务器核心内容。通常,一块完整的业务逻辑是由视图层、控制层、服务层、模型层共同定义与实现的,如下图:从上至下,抽象层次逐渐加深。从下至上,业务细节逐渐清晰。视图...

乌柏木41阅读 7.2k评论 6

从零搭建 Node.js 企业级 Web 服务器(二):校验
校验就是对输入条件的约束,避免无效的输入引起异常。Web 系统的用户输入主要为编辑与提交各类表单,一方面校验要做在编辑表单字段与提交的时候,另一方面接收表单的接口也要做足校验行为,通过前后端共同控制输...

乌柏木32阅读 6.1k评论 9

从零搭建 Node.js 企业级 Web 服务器(五):数据库访问
回顾 从零搭建 Node.js 企业级 Web 服务器(一):接口与分层,一块完整的业务逻辑是由视图层、控制层、服务层、模型层共同定义与实现的,控制层与服务层实现了业务处理过程,模型层定义了业务实体并以 对象-关系...

乌柏木32阅读 4.5k评论 9

从零搭建 Node.js 企业级 Web 服务器(十三):断点调试与性能分析
Node.js 官方提供了断点调试机制,出于安全性考虑默认为关闭状态,可以通过 node 参数 --inspect 或 --inspect-brk 开启,配合 IDE 能够非常方便地调试代码,本章就上一章已完成的项目 licg9999/nodejs-server-ex...

乌柏木29阅读 3.8k评论 9

9 声望
1 粉丝
宣传栏