如何解决 js 跨域问题
在进行项目开发过程中，可能会经常遇见跨域问题，那么什么是跨域呢？
1 什么是跨域
跨域：违背同源策略就会跨域。比如可能会有多台服务器，提供不同的功能，可能多台服务器对应的域名，端口之类的都不太一样。
什么是同源策略：是浏览器的安全策略，协议名，域名，端口名必须完全一致。
解决跨域问题的方法有：jsonp,cors,代理等
2 jsonp
jsonp解决ajax跨域的原理
1). jsonp只能解决GET类型的ajax请求跨域问题
2). jsonp请求不是ajax请求, 而是一般的get请求
3). 基本原理
浏览器端:
动态生成<script>来请求后台接口(src就是接口的url)
定义好用于接收响应数据的函数(fn), 并将函数名通过请求参数提交给后台(如: callback=fn)
服务器端:
接收到请求处理产生结果数据后, 返回一个函数调用的js代码, 并将结果数据作为实参传入函数调用
浏览器端:
收到响应自动执行函数调用的js代码, 也就执行了提前定义好的回调函数, 并得到了需要的结果数据小案例实现：
// 创建script标签
var script = document.createElement("script")
// 设置回调函数
function getData(data){
//数据请求之后会触发的函数
console.log(data)
}
// 设置标签src属性
script.src = "http://localhost:3000?callback=getData" //会自动调用getData函数
//让script标签生效
document.body.appendChild(script)3 代理
代理服务器，需要做以下几个步骤：
1.接受客户端请求 。
2.将请求转发给服务器。
3.拿到服务器响应数据。
4.将响应转发给客户端。
假设客户端发送请求的域名为localhost:3000，服务端所在的域名是localhost:5000。
客户端发送请求时，不直接到服务器，而是先到代理的中间层，在这里将localhost:3000的这个域名转换为localhost:5000，再将请求发送到服务器这样在服务器端收到的请求就是使用的localhost:5000域名，同理，当服务器返回数据的时候，也是先到代理的中间层将localhost:5000转换成localhost:3000，这样在客户端也是在相同域名下访问的了。
- 本文作者： étoile
- 版权声明： 本作品采用 知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议 进行许可。转载请注明出处！
