【前端自学之路】JS之跨域

js 跨域, 跨域怎么办, 跨域原理

什么是跨域

是指不同源之间请求交互数据

什么是同源、什么是不同源、什么是同域、什么是不同域

跨域是指 协议域名端口 只要其中任意一个不同,即为跨域,比如

我们先了解下 协议 域名 和 端口
一个url如 https://www.baidu.com:80
协议是 https
域名是 www.baidu.com
端口是 80 ,不过绝大多数场合下端口都是忽略不写的,因为默认 http的端口是 80,https端口是 443

为什么会有跨域呢

由于浏览器的安全同源策略,不允许不同源之间请求数据,这是浏览器的核心安全功能

有跨域,那请求是禁止发出了吗?

不是,虽然有跨域,但是HTTP请求还是正常发送出去,而且数据正常返回给浏览器了

但是,浏览器由于同源策略,数据它拿到后并没有传给你了(XMLHttpRequest),而是拦截了

是不是JS都不允许跨域呢?

不是,跨域仅仅是浏览器的行为和策略的,脱离浏览器后,就没有任何跨域问题

有哪些允许跨域请求数据的方式吗?

有,script标签、img标签、iframe标签、link标签等,都是允许跨域请求的

如何解决跨域问题呢?

第一种方式

JSONP,很常见的方式

就是利用script允许跨域的这个特点,我们来介绍下JSONP为什么能跨域请求

第一步

客户端JS发送一个script请求

第二步

服务器返回一段JS代码字符串,数据的真实数据在()内
JSONP12312454534({“errNo”:”0”,”content”: []})

第三步

客户端JS收到这段字符串后,会把它当作script的源代码执行

我们仔细看服务器返回的字符串,其实就是一段代码,而且是函数调用,而且函数名就是我们已经定义过的

因此在函数声明的地方可以看到 console.log(obj)

坚持原创技术分享,您的支持将鼓励我继续创作!