实现jsonp js

JSONP是常见的跨域请求方法,利用浏览器可跨域请求外链JS文件的特性实现数据传输。其请求过程包括:浏览器创建script标签并赋值发起请求,服务端将返回数据作为参数和回调函数拼接返回,浏览器接收响应数据后相当于调用回调函数并传入参数。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

JSONP是一种非常常见的实现跨域请求的方法。其基本思想是利用浏览器中可以跨域请求外链的JS文件,利用这一特性实现数据传输。

JSONP的请求过程

  • 请求阶段:浏览器创建一个 script 标签,并给其src 赋值(类似 http://example.com/api/?callback=jsonpCallback)。
  • 发送请求:当给scriptsrc赋值时,浏览器就会发起一个请求。
  • 数据响应:服务端将要返回的数据作为参数和函数名称拼接在一起(格式类似”jsonpCallback({name: 'abc'})”)返回。当浏览器接收到了响应数据,由于发起请求的是 script,所以相当于直接调用 jsonpCallback 方法,并且传入了一个参数。
var newscript = document.createElement('script');
newscript.src = 'https://sp0.baidu.com/su?username=Jack&callback=foo';
document.body.appendChild(newscript);
function foo(data) { //callback函数要绑定在window对象上
    console.log(data);  //foo({ username: 'Jack' })
}

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值