1.同源策略就是: 如果两个页面拥有相同的协议,域名和端口,那么这两个页面就是同源,只有其中有一个不相同,就是不同源
2.同源策略三要素:同协议,同域名,同端口
2.同源策略的目的 :为了保证用户信息安全,防止恶意的网站数据切奇,最初的同源策略是指:A网站在客户端设置Cookie,B网站不能访问 。随着互联网的发展同源策略也越来越严,在不同源的情况下是无法向非同源地址发送Ajax请求,如果请求,浏览器就会报错
二,跨域
跨域,就是发送不符合同源策略的请求,称为跨域
三,解决跨域的方法
1.使用jsonp方法解决跨域 jsonp就是通过动态创建script标签,请求一个地址,利用回调函数的方法接收返回值,从而达到跨域请求
1.不只是script标签不受跨域的影响,但凡只要有src属性的标签都有跨域的能力,比如:<script>,<img>,<iframe>,
<!-- //通过script标签访问不同源地址,在地址栏传入一个函数名 -->
<script src="http://127.0.0.1/admin?callback=fn"></script>
<script>
//通过定义全局变量的方式接受返回值
function fn(con) {
console.log(con);
}
</script>
2.CORS方法 , 就是在后台设置响应头,允许发送跨域请求
CORS:全称为 Cross-originresource sharing,即跨域资源共享,它允许浏览器向跨域服务器发送 Ajax 请求,克服了 Ajax 只能同源使用的限制。
CORS方法,也是官方认证解决跨域的方法,主要是在后台设置响应头 这里展示一段node.js设置响应头方法
//通过中间件设置响应头
app.use((req, res, next) => {
//设置只有本地域名可以访问,也可以设置 * 任意ip 都可以访问
res.header('Access-Control-Allow-Origin', 'http://127.0.0.1/');
//设置可以接收GET POST 请求 ,也可以设置其他请求方式
res.header('Access-Control-Allow-Methods', 'GET,POST');
next();
})
3.通过设置代理服务器的方法
代理服务器方法:
A服务器 B服务器 A网页发送ajax请求 到A服务器 A服务器 发送请求 B服务器 B服务器在返回到 A服务器 A服务器在返回给 A网页
都是一个套路吧,后台没有同源的限制,直接让后台访问接口 获取到数据在返回
发表评论