jsonp 跨域的理解及实现

345 阅读1分钟

一. 什么是跨域?

在访问ajax的时候,浏览器为了防止CSRF攻击,允许同源访问。非同源访问就是跨域请求了。

二. 什么是同源?

浏览器访问地址的协议,域名,端口都一致,称为同源。否则就是非同源,非同源就是跨域。

三. jsonp 的原理

ajax请求受同源策略影响,不允许进行跨域请求,利用script标签src属性中的链接却可以访问外网,利用这个特性,服务端不再返回JSON格式的数据,而是包着一段函数,然后客户端触发这个函数,拿到服务端传输的值,这样实现了跨域。


四. 用node模拟服务端实现jsonp。

1. 首先我请求ajax ,浏览器会提示跨域操作。


2. 点击获取姓名或者年龄按钮。


我们可以在body里,会动态生成<srcipt></srcipt>。

通过src 的地址,我们成功访问到外网,并获取到数据。

完整代码可以访问 github.com/yqzyou/yqzy…