进阶任务13:JSONP_跨域

题目1: 什么是同源策略

  • 浏览器歘于安全方面的考虑,只允许于本域下的接口交互。不同源的客户端脚本在没有明确授权的情况下,不能读写对方的资源。

题目2: 什么是跨域?跨域有几种实现形式

  • 跨域:因为JavaScript同源策略的限制,a.com域名下的js无法操作b.com或是c.a.com域名下的对象。
  • 跨域的几种实现形式:
    1.降域:对主域名相同而子域名不同的网址可使用降域,需要在两个站点的根域设置document.domain属性:document.domain="a.com",配合iframe标签实现。
    2.psotMessage:html5引入的postMessage()方法允许来自不同源的脚本采用异步方式进行有限的通信,可以实现跨文文档、多窗口、跨域消息传递。
    3.jsonp:是服务器与客户端跨院通信的常用方法。最大特点就是简单适用,老式浏览器全部支持,服务器改造非常小。
    4.cors:是一个W3C标准,全称是“跨域资源共享”,它允许浏览器向跨院服务器,发出XMLHttpRequest请求,从而克服了AJAX只能同源使用的限制;目前,所有限制浏览器都支持该功能,IE浏览器不能低于IE10。

题目3: JSONP 的原理是什么

  • 原理是网页通过添加一个<script>元素,向服务器请求JSON数据,<script>元素的src属性不被同源策略影响,它可以获取任何服务器上的脚本并加载;服务器收到请求后,将数据放在一个指定名字的回调函数里传回来。

题目4: CORS是什么?

  • CORS是一个W3C标准,全称是“跨域资源共享”,它允许浏览器向跨源服务器,发出XMLHttpRequest请求,从而克服了AJAX只能同源使用的限制;目前,所有浏览器都支持该功能,IE浏览器不能低于IE10。它的基本原理是通过设置HTTP请求和返回HTTP响应头,告知浏览器该请求是合法的。这涉及到服务器端和浏览器端双方的设置:请求的发起(Http Request Header)和服务器对请求正确的响应(Http response header)。
    浏览器将CORS请求分成两类:
  1. 请求方法是以下三种方法之一:
  • HEAD
  • GET
  • POST
  1. HTTP响应头信息不超出以下几种字段:
  • Accept
  • Accept-Language
  • Content-Language
  • Last-Event-ID
  • Content-Type:只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain

非简单请求:不满足上述条件的所有请求,例如PUT,DELETE或者是Content Type是application/json,均为“非简单的请求”。针对这种请求,浏览器会在正式通信之前,增加一次HTTP查询请求,称为”预检”请求(preflight)。浏览器先询问服务器,当前网页所在的域名是否在服务器的许可名单之中,以及可以使用哪些HTTP动词和头信息字段。只有得到肯定答复,浏览器才会发出正式的XMLHttpRequest请求,否则就报错。

题目5: 根据视频里的讲解演示三种以上跨域的解决方式 ,写成博客

链接

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1- 同源策略: 首先理解什么叫同源同源指的是协议、域名、端口都必须一致。只要其中一个不一致都不是同源。 浏览器中...
    osborne阅读 182评论 0 1
  • 1.什么是同源策略浏览器出于安全方面的考虑,只允许与本域下的接口交互。不同源的客户端脚本在没有明确授权的情况下,不...
    24_Magic阅读 520评论 0 0
  • 1. 跨域和同源 首先来看摘自MDN上对于跨域,较为标准的解释: 当一个资源从与该资源本身所在的服务器不同的域或端...
    晓风残月1994阅读 230评论 0 0
  • 什么是同源策略 同源政策(same-origin policy)是指同域名(或ip),同端口,同协议视为同一个域,...
    小囧兔阅读 560评论 0 1
  • 一个人的时候,整个世界都是你一个人的
    陈的陈阅读 118评论 0 0