什么是 JSONP?
JSONP
请求方:frank.com 的前端程序员(浏览器)
响应方:jack.com 的后端程序员(服务器)
请求方创建 script,src 指向响应方,同时传一个查询参数 ?callbackName=yyy
1.响应方根据查询参数callbackName,构造形如
yyy.call(undefined, '你要的数据')
yyy('你要的数据')
这样的响应
2.浏览器接收到响应,就会执行 yyy.call(undefined, '你要的数据')
3.那么请求方就知道了他要的数据
这就是 JSONP
完整的JsonP代码如下,过程在笔记上
image.png
使用jQuery和的代码如下
image.png
代码:以后直接用
···
$.ajax({
url: "http://localhost:8001/pay", //要改的地方
dataType: "jsonp",
success: function (response) {
if (response === 'success') {
alert('success')
}
}
})
else if (path === '/pay') {
//下面的直接用
let callbackName = query.callback
response.setHeader('Content-Type', 'application/javascript')
response.write(${callbackName}.call(undefined, 'success')
)
response.end()
···
其中($ajax)其实是一个<script>不是一个真的ajax
JSONP 为什么不支持 POST?
因为JASONP是通过动态创建script实现的,我们动态创建script的时候只能用get没办法用post