跨域问题以及携带token问题总结

项目前后端分离，未上线时。前端所用的服务器与后端给的接口不同源，导致访问出现下图的情况：
（同源就是协议，域名，端口一模一样；只要有一个不同就是不同源）

参考了很多文档视频，意思是解决起来两种办法：
第一，使用jsonp，就是通过script标签获取后端接口发送过来的数据通过js实现，原理建议参考2小时掌握前端9种跨域解决方案的第28分钟开始，有示例。
但是jsonp只能解决get请求，这也是它的一个缺点。而且也不安全。
第二，就是修改CORS跨域资源共享 相关设置。就是在服务器端配置好。

具体每一项的含义推荐去看HTTP-headers
这里边注意文档中给的语法，有的可以使用*，但是有的需要写出每一个header

我的项目登录时后台会给前端的response data中返回一个token和refresh_token。除了登陆操作，所有的ajax操作都需要带着token这个请求头去访问，如果token过期了，通过refresh_token重新请求一个新的token。token失效或者无效都强制重新登陆。
踩坑次数过多，发现只要在服务端设置（python语言）

res.headers["Access-Control-Allow-Headers"] = "Content-Type,token,refresh_token"
res.headers['Access-Control-Expose-Headers'] = 'Origin,Accept,Content-Type,token,refresh_token'

其他语言道理应该是相同的，
响应首部 Access-Control-Expose-Headers 列出了哪些首部可以作为响应的一部分暴露给外部。
设置后端给你返回的Response Headers，

默认情况下

所以基于自己的需求，就在服务端设置了res.headers[‘Access-Control-Expose-Headers’] = 'Origin,Accept,Content-Type,token,refresh_token’

请求头 Access-Control-Request-Headers ，用于通知服务器在真正的请求中会采用哪些请求头。
那肯定得通过token，refresh_token请求头。
res.headers[‘Access-Control-Expose-Headers’] = ‘Origin,Accept,Content-Type,token,refresh_token’

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！