同源与跨域

一、同源：
指三个相同：
协议相同，域名相同，端口相同，不同源的网站不可以相互访问

同源的目的：保证用户信息的安全，防止恶意的网站窃取数据。同源策略是必须的，如果cookie在不同源的网站共享，那么互联网将毫无安全性可言。

同源策略的限制范围：
1.cookie,LocalStorage，IndexDB无法读取
2.ajax请求无法发送
3.DOM无法获得

如果我们知道两个网站都是安全的，那么我们希望两个网站能互相请求数据时，我们就需要用到跨域。

二、跨域
效果：不同源的网站之间可以互相访问

1.jsonp可以解决主流浏览器跨域数据访问的问题。
原理：服务端返回一个预先定义好的函数的调用 ，然后将后端的数据以该函数实参的形式传递给前端，前端需要声明一个函数，通过实参获取到服务端返回的数据。这个方法需要前后端配合

jquery将jsonp的封装得相当简单，只需要把datatype固定为jsonp即可
datatype:"jsonp"
jsonp和json并没有关系，只是jquery把jsonp当做json的形式封装起来了罢了。

##特点：
jsonp兼容性好
但是仅支持get请求

2.cors跨域资源共享
使用前提：
浏览器必须支持这个功能
后端必须支持这种跨域。

cors流程：
a.浏览器会根据同源策略查看是否是跨域请求，如果同源，那么浏览器直接发送ajax请求。
b.如果属于跨域，那么浏览器会发送一条不带数据的请求，查看服务端是否允许这种跨域。
c.如果服务端不允许cors跨域，那么浏览器不会发送ajax请求
d.如果服务端允许cors跨域（后端会设置一串代码）,那么浏览器会发送ajax请求
##跨域是浏览器行为，是浏览器阻止了ajax请求，服务端没有跨域问题。

##特点：使用方便，只要后端允许cors跨域，和通常发送ajax请求没有什么区别。
兼容性不好，需要浏览器支持cors支持。

只要后端支持，前端不需要做任何操作。

 

 

3.反向代理
以代理服务器接受浏览器上的请求，然后把请求发送到内部服务器，然后将获取的结果发送给浏览器，这个代理服务器就是反向代理服务器。
反向代理是一个跨域解决方案，只要后端把环境配置好，前端不需要做任何操作。

操作流程：
打开httpd-conf文件,去掉135行和143行的注释（去掉第一个符号#）
变成：
LoadModule proxy_module modules/mod_proxy.so
LoadModule proxy_http_module modules/mod_proxy_http.so

修改 D:\phpStudy\Apache\conf\extra\httpd-vhosts.conf 文件，找到bxg对应的配置，添加以下代码
# 关闭正向代理
ProxyRequests off
# 开启反向代理，当服务器碰到/api的请求之后，会帮我们替换成http://api.botue.com/v8，并且发送请求获取数据。
ProxyPass /api http://api.botue.com/v8

 只要后端支持，前端也不需要做任何操作。