前端开发:Mac环境的Chrome浏览器设置跨域请求的SameSite解决方法

前段时间在开发项目的时候,遇到一个比较稀奇古怪的跨域问题,无论怎么写就是解决不了,后来经过Chrome浏览器的设置,解决了跨域问题,这样就不须要在项目里经过设置代理来解决跨域问题,直接经过设置修改Chrome浏览器的设置就能够解决项目跨域问题。具体的跨域问题以下所示:前端

Access to XMLHttpRequest at 'https://weixin.xxx.com/ems/login' (redirected from 'http://localhost:8081/xxx/queryBalance') from origin 'http://localhost:8081' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

image
本篇博文就来分享一下上述状况的操做步骤,这里是基于Mac环境下来说解的,其余电脑操做系统(如Windows操做系统)的设置方法这里再也不过多介绍,若有其余电脑操做系统的设置方法请找度娘。web

在经过Chrome浏览器设置跨域配置以前,首先要在Mac电脑的终端里面输入如下命令行。
一、打开Mac电脑终端,输入如下命令行:chrome

open -n /Applications/Google\ Chrome.app/ --args --disable-web-security  --user-data-dir=/Users/你的Mac用户名/MyChromeDevUserData/    回车,便可。

image
image
image
首次打开Chrome浏览器会有黄色背景色的“您使用的是不受支持的命令行标记:--disable-web-security。稳定性和安全性会有所降低。”的提示,那就说明浏览器设置跨域成功,若再次重复执行上述命令行时,不会再有相关提示了,可是仍是能够跨域。经过命令行设置完Chrome以后,须要进行其余选项设置,直接打开Mac电脑的谷歌浏览器进行操做便可,具体操做步骤以下所示:
二、打开Chrome浏览器以后,在浏览器地址栏里面输入chrome://flags 而后回车键,打开;
image
三、直接在浏览器搜索栏里面输入如下内容:跨域

SameSite by default cookies   而后回车,搜索结果显示如下两项选项,而后直接禁用两项设置,即把状态改成Disabled,而后点击右下角的relaunch重启浏览器便可,以下图所示:

image
image
四、通常状况下上述操做便可经过浏览器解决跨域问题,可是特殊状况上述步骤依然不能设置跨域问题,那就继续在浏览器搜索框输入如下内容:浏览器

Schemeful Same-Site  回车,同理把该选项禁用,状态设置为Disabled,而后重启浏览器,便可。

image
image
通过上述步骤,就完美实现经过Chrome浏览器设置解决跨域问题,这种方法也为前端开发过程当中遇到的跨域问题提供一种很是有效的解决方式,方便又好用。安全

以上就是本章所有内容,欢迎关注三掌柜的微信公众号“程序猿by三掌柜”,三掌柜的新浪微博“三掌柜666”,欢迎关注!微信

相关文章
相关标签/搜索