当前位置: 首页>前端>正文

nginx修改进程 nginx changeorigin

一、什么是跨域?

        当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域

当前页面url

被请求页面url

是否跨域

原因

http://www.test.com/

http://www.test.com/index.html


同源(协议、域名、端口号相同)

http://www.test.com/

https://www.test.com/index.html

跨域

协议不同(http/https)

http://www.test.com/

http://www.baidu.com/

跨域

主域名不同(test/baidu)

http://www.test.com/

http://blog.test.com/

跨域

子域名不同(www/blog)

http://www.test.com:8080/

http://www.test.com:7001/

跨域

端口号不同(8080/7001)

二、为什么会出现跨域?

       出于浏览器的同源策略限制。同源策略(Sameoriginpolicy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。同源策略会阻止一个域的javascript脚本和另外一个域的内容进行交互。所谓同源(即指在同一个域)就是两个页面具有相同的协议(protocol),主机(host)和端口号(port)。

三、一般出现跨域时的报错信息

        我遇到的情况:访问页面,点击登录按钮后,浏览器发出了请求方式为OPTIONS

nginx修改进程 nginx changeorigin,nginx修改进程 nginx changeorigin_nginx修改进程,第1张

         点浏览器的Console控制台,发现报跨域的错。请求后端1504 端口被拒绝。

nginx修改进程 nginx changeorigin,nginx修改进程 nginx changeorigin_同源策略_02,第2张

         解决跨域问题方式有很多种,我是在nginx代理层处理。在后端接口配置文件中(即1504端口配置文件),加上以下配置,转发时添加头部信息,Access-Control-Allow-Origin 等。

location ~ \.php/?.*$ {
         add_header "Access-Control-Allow-Origin" $http_origin always;
         add_header 'Access-Control-Allow-Credentials' 'true' always;
         add_header 'Access-Control-Allow-Methods' 'OPTIONS, POST, GET' always;
         add_header 'Access-Control-Allow-Headers' 'Origin, X-Requested-With, Content-Type, Accept' always;
        try_files $uri /index.php =404;
         fastcgi_pass  unix:/tmp/php-cgi.sock;
         fastcgi_index  index.php;
         fastcgi_param   SCRIPT_FILENAME   $document_root$fastcgi_script_name;
         include fastcgi_params;
     }

has been blocked by CORS policy: Request header field Authorization is not allowed by Access-Control-Allow-Headers in preflight response. 已被cors策略阻止:Access-Control-Allow-Headers 在响应中不允许请求标头字段Authorization。

nginx修改进程 nginx changeorigin,nginx修改进程 nginx changeorigin_nginx修改进程_03,第3张

Authorization 加上。再次重载nginx配置文件即可。

add_header 'Access-Control-Allow-Headers' 'Authorization,Origin, X-Requested-With, Content-Type, Accept' always;

四、重复跨域

has been blocked by CORS policy: The ‘Access-Control-Allow-Origin’ header contains multiple values;

nginx修改进程 nginx changeorigin,nginx修改进程 nginx changeorigin_Access_04,第4张

        我这边就是把nginx上允许跨域的几行注释了,就好了。因为不知道在哪还配置了别的跨域。 


https://www.xamrdz.com/web/28g1962103.html

相关文章: