浏览器的同源策略及跨域请求
具有相同协议，域名和端口的页面，则具有相同的源，即它们是来自同一个服务的资源．
如，对＂http://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 | 失败 | 不同协议 ( https和http ) |
| http://store.company.com:81/dir/etc.html | 失败 | 不同端口 ( 81和80) |
| http://news.company.com/dir/other.html | 失败 | 不同域名 ( news和store ) |
注：1、端口和协议的不同，只能通过后台来解决
2、域名和实际ip地址属于跨域，如：localhost和127.0.0.1虽然都指向本机，但也属于跨域
浏览器的同源策略限制了从同一个源加载的资源 (文档或脚本等) 如何与来自另一个源的资源进行交互，它是一个用于隔离潜在恶意文件的重要安全机制。
同源策略控制了不同源之间的交互，当浏览器从一个源的网页去请求另一个源的资源时，即浏览器在做跨服务的资源访问时，就会出现跨域问题．
注：1、同源策略及跨域问题只是浏览器设计的一种安全机制，对于其他工具如 curl 则完全没有同源及跨域的概念
2、浏览器在跨域请求资源时，实际的请求会被发送到被请求的服务端，响应也会被接收，只是如果不做跨域处理时，返回的响应不会被浏览器解析，同时浏览器会抛出跨域受限的错误
跨域问题的处理
１．修改header
若在来自＂源A (http://127.0.0.1:8888)＂的一个页面中要访问＂源B (http://127.0.0.1:8887)＂中的资源，则＂源B＂可以通过修改其 response 中 header 的 "Access-Control-Allow-Origin"字段来允许来自＂源A＂的跨域请求．浏览器检测到＂Access-Control-Allow-Origin＂字段，则会根据结果对响应做解析．
Access-Control-Allow-Origin : * 表示源B接收来自其它任何源的跨域请求
Access-Control-Allow-Origin : 源A (如：http://127.0.0.1:8888) 表示源B只接收来自源A的跨域请求
CORS的预请求
在跨域时，并不是所用的方法都会被允许，对于非默认允许方法，需要经过近一步验证后才会得到跨域允许，这就涉及到CORS的预请求．
在跨域时默认允许的Method：
- GET
- HEAD
- POST
在跨域时默认允许的Content-Type：
- text/plain
- multipart/form-data
- application/x-www-form-urlencoded
跨域时其它的限制：
- 请求头的限制
- XMLHttpRequestUpload 对象均没有注册任何事件监听器
- 请求中没有使用ReadableStream对象
CORS预请求 (prefligt请求) 就是浏览器在在发生请求时，会预先自动发出一个OPTIONS请求来检测本次请求中涉及到的一些内容（如Method, Content-Type 等）是否被服务器接受。一个OPTIONS请求一般会携带下面两个与跨域相关相关的头：
Access-Control-Request-Method: 本次预请求的请求方法。Access-Control-Request-Headers：本次请求所携带的自定义首部字段
服务端收到该预请求后，会返回相关的响应头。主要会包括下面几个：
Access-Control-Allow-Origin: 服务器允许的跨域请求源Access-Control-Allow-Methods: 服务器允许的请求方法Access-Control-Allow-Headers: 服务器允许的自定义的请求首部字段
通过预请求后，浏览器就会发生正式的数据请求。整个请求过程其实是发生了两次请求：一个预请求，以及预请求通过后的实际数据请求。
在上面的两次请求中，预检请求只是一个检查的过程，它不会携带任何请求的参数；预检通过后的请求才会真正的携带请求参数与服务器进行数据通信。
若服务器对预请求没有任何响应，那么浏览器不知道服务器是否支持跨域访问，就而不会发送后续的实际请求；或者服务器不支持当前的Origin跨域访问也不会发送后续请求。
2. jsonp跨域
jsonp（JSON with Padding：填充式JSON)，应用JSON的一种新方法，
JSON、JSONP的区别：
1、JSON返回的是一串数据、JSONP返回的是脚本代码(包含一个函数调用)
2、JSONP 只支持get请求、不支持post请求
jsonp的原理很简单，就是动态的创造script标签，然后利用script的src 不受同源策略约束来跨域获取数据。(link,script,image标签不受浏览器的同源策略约束)
参考：