跨域访问CORS

99 阅读2分钟

本文已参与「新人创作礼」活动,一起开启掘金创作之路。

由于现代浏览器的同源策略,合理的跨域请求也变得至关重要。

同源

我们认为若协议 + 域名 + 端口号均相同,那么就是同域。 域名、协议、端口有一个不同就不是同源,三者均相同,这两个网站才是同源

CORS

CORS(Cross-Origin Resource Sharing,跨域资源共享)定义了在必须访问跨域资源时,浏览器与服务器应该如何沟通。它背后的思想是使用自定义的HTTP头部让浏览器与服务器进行沟通,从而决定请求或相应是应该成功还是应该失败。

解决跨域的一些方法

  1. JSONP

JSONP(JSON with padding 填充式JSON或参数式JSON),是应用JSON的一种新方法,是被包含在函数调用中的JSON。

JSONP由两部分组成:回调函数+数据。

 

  1. Comet

Comet是一种服务器向页面推送数据的技术。而Ajax页面向服务器请求数据的技术

两种实现方式:长轮询和流。

(短轮询:浏览器定时向服务器发送请求,看有没有更新的数据;

长轮询:页面发起一个到服务器的请求,然后服务器一直保持连接打开,直到有数据可发送。发送完数据之后浏览器关闭连接,随即又发起一个到服务器的新请求。这一过程在页面打开期间一直持续不断)

(HTTP流实现。在页面整个生命周期内只使用一个HTTP连接:浏览器发送一个请求,而服务器保持连接打开,然后周期性地向浏览器发送数据。)

 

  1. SSE

SSE(Server-Sent Events,服务器发送事件)是围绕只读Comet交互推出的API或者模式。用于创建到服务器的单向连接,服务器通过这个连接可以发送任意数量的数据。

 

  1. web sockets

它的目标是在一个单独的持久连接上提全双工、双向通信。

同源策略对web sockets不适用,因此可以通过它打开到任何站点的连接。

 

  1. iframe 实现跨域