栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > Vue.js

has been blocked by CORS policy: Request header fiel...

Vue.js 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

has been blocked by CORS policy: Request header fiel...

一个需求中出现了这个问题,折腾了好几天。

背景:需求中接口要过网关,然后就出现了这个跨域的问题。
折腾好久没找到原因,研发,架构,it折腾一圈。

后来发现是接口要求传了自定义参数。浏览器在发送带有自定义的请求头时,浏览器会先向服务器发送OPTIONS预检请求,探测该请求服务端是否允许自定义跨域字段.如果允许,则继续执行请求,如果不允许,则返回错误信息提示错误。

cors的配置信息,其中有allowHeaders配置项,表示服务器支持的请求头信息字段,于是在默认的配置后面加上了在客户端自定义添加的yichehuoban-authkey字段,cors的配置就变成如下:

app.use(cors({
    origin: (ctx) => {
 return "*";
    },
    exposeHeaders: ['WWW-Authenticate', 'Server-Authorization'],
    maxAge: 5,
    credentials: true,
    allowMethods: ['GET', 'post', 'PUT', 'DELETE', 'PATCH', 'HEAD', 'OPTIONS'],
    allowHeaders: ['Content-Type', 'Authorization', 'Accept','yichehuoban-authkey'],
    AccessControlAllowHeaders: "*"

至此终于解决了。

感谢这篇文章的作者
https://blog.csdn.net/hbysj/article/details/103301845

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/239850.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号