题目1: 什么是同源策略
same origin policy 禁止从一个源加载的文档或脚本和来自另一个源的资源发生交互,这是一个隔离潜在恶意文档的关键安全措施。
同源的定义:如果两个页面协议、域名、端口都相同,则是同源。
题目2: 什么是跨域?跨域有几种实现形式
跨域:通过JS在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过JS获取页面中不同域的 iframe 中的数据。
实现形式:
JSONP:利用引入JS文件不受同源策略限制的特性,前后端配合实现跨域访问接口。
CORS:一个W3C标准,允许跨域发出 XmlHttpRequest 请求,需要服务器配合实现。
降域:修改 document.domain,将其设置成更高一级的父域,从而符合同源策略。
a.jrg.com => jrg.com
b.jrg.com => jrg.com
postMessage():HTML5 新特性,提供一种可控机制去规避同源策略的限制,只要正确地使用,这种方式是安全的。
题目3: JSONP 的原理是什么
利用引入JS文件不受同源策略限制的特性,前后端配合实现跨域访问接口。
实现步骤:
定义数据处理函数 fn()
创建 script 标签,src设置为后端接口地址,并加参数 callback=fn
服务器返回 fn(data) 字符串,data 是请求的数据
执行 fn(data)
var cb = req.query.callback;
if(cb)
res.send(cb + '(' + JSON.stringify(data) + ')');
else
res.send(data);
题目4: CORS是什么
CORS(Cross-Origin Resource Sharing)是一个 W3C 标准,允许浏览器跨域发出 XmlHttpRequest 请求,克服了 ajax 只能同源使用的限制。
当发出的 XmlHttpRequest 请求不符合同源策略时,浏览器会给该请求加一个请求头:Origin,如果后台程序接受请求则在返回结果中加一个响应头:Access-Control-Allow-Origin,浏览器检查响应头中是否包含 Origin 的值,如果有则我们可以拿到响应数据。