浏览器跨域问题，跨域是什么，怎么解决，会遇到什么坑

#一：跨域是什么
跨域：是指浏览器在发起请求时，会检查该请求所对应的协议，域名，端口和当前网页是否一致，如果不一致，则浏览器会进行限制，指的是浏览器不能执行其他网站的脚本
例如：a页面想获取b页面资源，如果a、b页面的协议、域名、端口、子域名不同，所进行的访问行动都是跨域的，而浏览器为了安全问题一般都限制了跨域访问，也就是不允许跨域请求资源。注意：跨域限制访问，其实是浏览器的限制。
假设有两个网站，A网站部署在：http://localhost:81 即本地ip端口81上；B网站部署在：http://localhost:82 即本地ip端口82上。现在A网站的页面想去访问B网站的信息，就会遇到跨域的报错

它是由浏览器的同源策略造成的，是浏览器对javascript施加的安全限制

（同源策略：是指协议，域名，端口都要相同，其中有一个不同都会产生跨域）
二：怎么解决：
利用nginx作为反向代理，把web项目和后端接口项目放到一个域中，这样就不存在跨域问题了
看一下利用nginx作为反向代理的具体配置：
server {

    listen      80; #监听80端口，可以改成其他端口

    server_name  localhost; # 当前服务的域名

    #charset koi8-r;

    #access_log  logs/host.access.log  main;

    location / {

        proxy_pass http://localhost:81;

        proxy_redirect default;

    }

location /apis { #添加访问目录为/apis的代理配置

rewrite ^/apis/(.*)$ /$1 break;

proxy_pass http://localhost:82;
}
用nginx作为代理服务器和用户交互，这样用户就只需要在80端口上进行交互就可以了，这样就避免了跨域问题，因为我们都是在80端口上进行交互的；

1.当用户发送localhost:80/时会被nginx转发到http://localhost:81服务；

2.当界面请求接口数据时，只要以/apis 为开头，就会被nginx转发到后端接口服务器上；（真正干活的服务器）

三：遇到的坑：
在高版本的Chrome下，浏览器默认是开启Block insecure private network requests.这个选项的。也就是默认禁止跨域请求，所以在访问一些没有符合最新标准的老网站时，可能会发现出现如图所示的CORS跨域请求错误，从而导致不能正确打开该网站
Chrome 94 默认开启“阻止不安全的专用网络请求”，将使得http的站点请求私有网络接口被拦截。专用网络访问规范（以前称为 CORS-RFC1918）会限制网站向专用网络上的服务器发送请求的能力。它只允许来自安全上下文（HTTPS）的此类请求。该规范还扩展了跨域资源共享 (CORS) 协议，因此网站现在必须要经过专用网络上的服务器授权才能发送请求。
解决方案：
第一步：
在浏览器输入：chrome://flags/
第二步：
在搜索框输入Block insecure private network requests.

第三步：
将Default改成Disabled，此时浏览器会提示你重启，点击重启按钮即可。若果重启浏览器不成功，重启电脑一下。