同源策略相关

同源策略

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

同源，即域名（或IP）、端口、协议相同。

下面给出了与 URLhttp://store.company.com/dir/page.html的源进行对比的示例:

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://news.company.com/dir/other.html	不同源	域名不同

浏览器默认同源之间的站点是可以相互访问资源和操作DOM的，而不同源之间想要互相访问资源或者操作DOM，那就需要加一些安全策略的限制。

非同源限制：

• 数据层面：不能获取不同源站点的Cookie、LocalStorage、indexDB等数据
• DOM层面：不同源站点之间不能相互访问和操作DOM（DOM节点:将html文档视为树结构，以便进行查找和操作）
• 网络层面：不能通过XMLHttpRequest向不同源站点发送请求

跨域

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

同源策略限制不是绝对隔离不同源的站点，比如<link>、<img>、<script>标签都没有跨域限制，这让我们开发更灵活了，但是也同样带来了一些安全问题，也就是跨域问题。

跨域的三种方式

常见的跨域方式主要有以下三种：JSONP、postMessage以及websocket

1.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传参的长度有限制

2.postMessage

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

3.Websocket

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