同源策略 跨域 JSONP

同源策略

同源策略，它是由Netscape提出的一个著名的安全策略。它是浏览器最核心也最基本的安全功能，现在所有支持JavaScript 的浏览器都会使用这个策略。

同源，即域名、端口、协议相同。

URL	结果	原因
http://store.company.com/dir2/other.html	同源	只有路径不同
http://store.company.com/dir/inner/another.html	同源	只有路径不同
https://store.company.com/secure.html	不同源	协议不同
http://store.company.com:81/dir/etc.html	不同源	端口不同 ( http:// 默认端口是80)
http://news.company.com/dir/other.html	不同源	域名不同

非同源受到的限制:

• Cookie、LocalStorage、IndexedDB 等存储性内容
• DOM 节点（dom节点:将html文档视为树结构，以便进行查找和操作）
• AJAX 请求不能发送

跨域

当协议、子域名、主域名、端口号中任意一个不相同时，都算作不同域。不同域之间相互请求资源，就算作”跨域“。

跨域的三种方式

一.JSONP

原理

利用 <script> 标签没有跨域限制的漏洞，实现跨域请求。和AJAX不同是AJAX属于同源策略，JSONP属于非同源策略（跨域请求）。

<script type="text/javascript" src="http://localhost:20002/test.js"></script>

通过javascript callback的形式可以简单的实现跨域访问。

优缺点

• 优点：1.跨域访问。2.兼容性好，古老的浏览器也支持.3.请求完毕时通过callback的方式回传结果。将回调方法的权限给了调用方，相当于把控制层和视图层分开了.

• 缺点：1.只支持GET请求，不支持POST等其他类型的HTTP请求.2.jsonp在调用失败的时候不会返回HTTP状态码.3.安全性。可能会遭遇XSS攻击.例如代码:

  服务端 GetUser.php

  <?php
  header('Content-type: application/json');
  $jsoncallback = $_REQUEST ['jsoncallback'];//获取回调函数名
  $json_data='({"id":"1","name":"Aaron"})';
  echo $jsoncallback . "(" . $json_data . ")";//输出jsonp格式的数据
  ?>
  

  攻击者构造了一个payload：http://服务端/getUser.php?jsoncallback=<script>alert(1)</script>

  顺带复习下GET和POST请求的区别

  1.GET产生一个TCP数据包；POST产生两个TCP数据包。（post:浏览器先发送header，服务器响应100 continue，浏览器再发送data，服务器响应200 ok（返回数据））

  2.安全性。GET请求传递的内容会暴露在url中.

  3.GET只能进行url编码，而POST支持多种编码方式.

  4.有些网页可能会对GET传参的长度有限制.

二.postMessage

postMessage()方法允许来自不同源的脚本采用异步方式进行有限的通信，可以实现跨文本档、多窗口、跨域消息传递

三.websocket

Websocket是HTML5的一个持久化的协议，它实现了浏览器与服务器的全双工通信，同时也是跨域的一种解决方案。