一、同源
1、同源
就是协议、域名和端口号。若地址里面的协议、域名和端口号均相同则属于同源。
例子:
以下是相对于 http://www.a.com:8080/test/index.html 的同源检测:2、同源策略
http://www.a.com/dir/page.html ----成功
http://www.child.a.com/test/index.html ----失败,域名不同
https://www.a.com/test/index.html ----失败,协议不同
http://www.a.com:8089/test/index.html ----失败,端口号不同
同源策略是浏览器的一个安全功能,不同源的客户端脚本在没有明确授权的情况下,不能读写对方资源。所以a.com下的js脚本采用ajax读取b.com里面的文件数据是会报错的。
不受同源策略限制的。
(1)页面中的链接,重定向以及表单提交是不会受到同源策略限制的。
(2)跨域资源的引入是可以的。但是js不能读写加载的内容。如嵌入到页面中的
,
文章图片
三、跨域问题解决方案
1、jsonp(了解即可)
【ajax|Ajax跨域和同源的问题】利用script标签可跨域的特点,在跨域脚本中可以直接回调当前脚本的函数。
2、cors(主要使用)
服务器设置HTTP响应头中Access-Control-Allow-Origin值,解除跨域限制。
注意:这两个跨域方案都存在一个致命的缺陷,严重依赖后端的协助。
3、反向代理(Reverse Proxy):前端独立就能解决的跨域方案:
指以代理服务器来接受internet上的连接请求,然后将请求转发给内部网络上的服务器,并将从服务器上得到的结果返回给internet上请求连接的客户端,此时代理服务器对外就表现为一个反向代理服务器。
推荐阅读
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- javascript|比较for、for...in、for...of、forEach的区别
- Node.js|Express框架概述
- javascript|jQuery插件
- java|ceph-msg-messager|simple 代码分析
- 消息管理平台|纯后端如何写前端(我用了低代码平台)
- npm|解决npm install报警告的问题
- npm|解决npm warn config global `--global`, `--local` are deprecated. use `--location=global` instead.
- npm|解决 npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead
- Node.js|Node.js16.15.1的一个报错及解决方案