jsonp跨越工作原理及详情示例

在了解什么是jsonp跨域之前，我们先来了解这样一个概念：同源策略。

什么是同源策略：

同源策略及是，浏览器中有一种安全策略（同源策略）。浏览器中的一个url一般包括以下部分，协议，域名，端口，这三个任何一个不同，都是跨域。

以下是Jsonp解决跨域：

首先：ajax无法访问其他服务器暴露出来的接口：例 3000→3001（接口），因为link、img、script（静态资源） 标签可以访问其他服务上的资源。所以我们利用script

window.cb = data =>{   // 创建回调函数。监测服务端返回的数据
	console.log(data)
} 
const src = `http://localhost:3001/users/login?cbName = cb&username = ${username}&password = ${password}`;
$("<script>").attr("src",src).appendTo("body")  //  利用jQuery创建script标签，添加到body元素;

res.send(`${cbName}(${JSON.stringify(data)})`)   // 回调执行函数

以上就是jsonp的工作原理。总结一下，json 是一种数据格式，jsonp 是一种数据调用的方式，带callback的json就是jsonp。

缺点：这种方式只支持get方式。