不受同源策略限制的html标签,浏览器同源策略,及跨域解决方案

一、Origin(源)

源由下面三个部分组成:

域名

端口

协议

两个 URL ,只有这三个都相同的情况下,才可以称为同源。

下来就以 "http://www.example.com/page.html" 这个链接来比较说明:

二、同源策略

浏览器的同源策略是一种安全功能,同源策略限制了从同一个源加载的文档或脚本如何与来自另一个源的资源进行交互。这是一个用于隔离潜在恶意文件的重要安全机制。所以a.com下的js脚本采用ajax读取b.com里面的文件数据是会报错的。

三、哪些会受到同源策略限制

对于浏览器来说,除了DOM、Cookie、XMLHttpRequest 会受到同源策略的限制外,浏览器加载的一些第三方插件也有各自的同源策略。最常见的一些插件如 Flash ,有自己的控制策略。

所以,想要体验下,同源策略限制,你就可以写一个ajax 请求,比如127.0.0.1:80 要请求127.0.0.1:8080 的 a.js ;

b11818b534830803e22eb688b5b97418.png

127.0.0.1:80 里的index.html

Document

另一个页面

var xhr = new XMLHttpRequest();

xhr.open('get','http://127.0.0.1:8080/index.js');

xhr.send(null);

xhr.onreadystatechange = function(){

if(xhr.readyState == 4 && xhr.status >= 200 && xhr.status < 300 || xhr.status == 304){

alert(xhr.responseText);

}

}

然后就会报错了,出现了同源策略限制了。

四、什么是跨域呢

说的跨域,其实呢就是跨源。而跨域是一个统称,通过上面的我们知道了,因为同源策略,不同源之间,不能进行交互。那么跨域就是解决不同源之间发起请求、请求数据、发送数据、通信等交互问题解决方法的统称。

在浏览器中,

这句话什么意思呢,其实就是,你可以通过这几个标签来跨域加载资源,但是,发起的GET请求 返回的数据,通过 js 获取不到。

注意:通过

127.0.0.1 index.html

Document

window.onload = function(){

say();

}

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值