js-跨域问题

发表于 | 分类于

前言

之前遇到过跨域的问题。也总结过相关的知识点。基本上我解决跨域的时候，要么通过CORS来解决（也就是后端写http头），要么通过前端服务器自动代理请求数据转发一下。

为什么叫跨域

在web安全中，之前“道哥”写过，前端安全是基于“同源策略”的。
具体的介绍，阮一峰大大的博客有介绍浏览器同源政策及其规避方法。我就不重复ctrl+ c + v 了。

京东jsonp

https://d.jd.com/lab/get?callback=lab

原生封装jsonp格式

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
var h3 = document.querySelector("h3");
var button = document.querySelector("button");
  function JSONP (url,callBack) {
     //给window对象添加一个一个属性fetch_nameV8数值是一个函数
    window.fetch_nameV8 =callBack;
    var oscript = document.createElement("script");
    oscript.src = url;
    document.body.appendChild(oscript);
    document.body.removeChild(oscript);
  }
 //点击事件的时候，我封装了一个函数JSONP()
  button.onclick = function  (argument) {
  JSONP("http://127.0.0.2/anli/result/fetch_name.txt",function  (data) {
      console.log(data);
  });
}

jsonp评价

jsonp依赖于后端，后端需要把要执行的函数和名字都写好。前端通过相同
的函数名进行声明。请求的时候，直接调用。用来获取数据。像京东那样，可以根据自己传过去的函数名，自动返回一个相同的函数是一种比较好的解决办法。
不过还是没有CORS写起来方便。