题目1: 什么是同源策略
所谓同源是指,域名,协议,端口相同。假如没有同源策略,你现在打开了浏览器,在一 个窗口中打开了银行网站,在另外一个tab窗口中打开了一个恶意网站,而那个恶意网站挂了一个的专门修改银行信息的JavaScript,当你访问 这个恶意网站并且执行它JavaScript时,你的银行页面就会被这个JavaScript修改,后果会非常严重。
本域指的是?
同协议:如都是http或者https
同域名:如都是http://jirengu.com/a 和http://jirengu.com/b
同端口:如都是80端口
如:
http://jirengu.com/a/b.js 和 http://jirengu.com/index.php (同源)
不同源的例子:
http://jirengu.com/main.js 和 https://jirengu.com/a.php (协议不同)
http://jirengu.com/main.js 和 http://bbs.jirengu.com/a.php (域名不同,域名必须完全相同才可以)
http://jiengu.com/main.js 和 http://jirengu.com:8080/a.php (端口不同,第一个是80)
需要注意的是: 对于当前页面来说页面存放的 JS 文件的域不重要,重要的是加载该 JS 页面所在什么域,也就是我们平常再script标签中能够引入其他域
题目2: 什么是跨域?跨域有几种实现形式
跨域顾名思义就是突破同源策略的限制,去不同的域下访问数据。 主要有如下几种实现形式:
jsonp
CORS:跨域资源共享(Cross-Origin Resource Sharing)
降域
postMessage()
题目3: JSONP 的原理是什么
1.首先在客户端注册一个callback, 然后把callback的名字传给服务器。
2.服务器先生成 json 数据。
3.然后以 javascript 语法的方式,生成一个function , function 名字就是传递上来的参数 jsonp.
4.最后将 json 数据直接以入参的方式,放置到 function 中,这样就生成了一段 js 语法的文档,返回给客户端。
5.客户端浏览器,解析script标签,并执行返回的 javascript 文档,此时数据作为参数,传入到了客户端预先定义好的 callback 函数里.
题目4: CORS是什么
跨域资源共享,简单来说就是指定哪些符合条件的域名下的请求是被接受的,其他的都阻止。
实现方式是,当你使用XMLHttpRequest发送请求时,浏览器发现该请求不符合同源策略,会给该请求加一个请求头:Origin,后台进行一系列处理,如果确定接受请求则在返回结果中加入一个响应头:Access-Control-Allow-Origin; 浏览器判断该相应头中是否包含Origin 的值,如果有则浏览器会处理响应,我们就可以拿到响应数据,如果不包含浏览器直接驳回,这时我们无法拿到响应数据。
题目5: 根据视频里的讲解演示三种以上跨域的解决方式
JSONP方法:
返回结果为:
CORS:
跨域:
PostMessage: