ICode9

精准搜索请尝试: 精确搜索
首页 > 系统相关> 文章详细

Access-Control-Allow-Origin 轻松解决 Nginx 跨域问题

2022-04-28 10:33:33  阅读:239  来源: 互联网

标签:Control Origin 浏览器 跨域 Allow Access 同源


概述

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

疑问

  • 提问 1:什么是跨域?
  • 提问 2:如何解决跨域问题?

解答

  • 回答 1:a 页面想获取 b 页面的资源,如果 a、b 页面的协议、域名、端口、子域名不同,所进行的访问行动都是跨域的,而浏览器为了安全问题一般都限制了跨域访问,也就是不允许跨域请求资源。比如我们在使用 CDN 时就经常会遇到跨域问题。
  • 回答 2:以 Nginx 环境来说,我们只要把下面的 Header 头指令添加到网站 b 「网站」==>「设置」==>「配置文件」==>「倒数第三行」当中保存并重载 Nginx 配置即可。
  1. add_header Access-Control-Allow-Origin *;
  2. add_header Access-Control-Allow-Headers "Origin, X-Requested-With, Content-Type, Accept";
  3. add_header Access-Control-Allow-Methods "GET, POST, OPTIONS";

加到网站 b 宝塔面板「网站」==>「设置」==>「配置文件」==>「倒数第三行」

验证

如果你已经按照上面的方法在 b 网站宝塔面板 Nginx 配置文件中添加了 Header 头指令 ,那么现在你可以访问 a 网站按F12 查看元素检查是否还存在跨域错误提示。

最后

注意:在实际中 Access-Control-Allow-Origin 尽量不要指定为 * ,最好设置为允许访问的域名,比如:https://www.a.com 。

标签:Control,Origin,浏览器,跨域,Allow,Access,同源
来源: https://www.cnblogs.com/oodcloud/p/16201806.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有