JSONP接口调用案例

JSONP是一种解决浏览器跨域数据访问的模式,利用<script>元素的特性,通过指定回调函数来接收服务端返回的JSON数据。在客户端注册回调函数,并在服务端动态生成JavaScript代码,调用该函数传递数据。本文介绍了JSONP的工作原理,并通过示例展示了如何进行JSONP接口测试,包括使用jQuery进行无参和有参调用,以及在SSM架构下创建本地测试接口的注意事项。

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

       JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题。由于同源策略,一般来说位于 server1.example.com 的网页无法与不是 server1.example.com的服务器沟通,而 HTML 的<script> 元素是一个例外。利用 <script> 元素的这个开放策略,网页可以得到从其他来源动态产生的 JSON 资料,而这种使用模式就是所谓的 JSONP。用 JSONP 抓到的资料并不是 JSON,而是任意的JavaScript,用 JavaScript 直译器执行而不是用 JSON 解析器解析。-源自百度百科

主要解决:

跨域传输数据的问题,应用场景就是需要跨域传输数据的场景
原理是script脚本的src可以不在同一个域名下,src中加入回调函数名(例如callback)
并将该函数在当前页面注册并实现,服务端根据回调函数名返回回调函数及参数(参数为跨域传输的数据),这样会调用之前注册的回调函数,里面直接取参数即可

1.在客户端调用提供JSONP支持的URL Service,获取JSONP格式数据。大的项目中单点登录会用到(解决不同子系统间的数据传输)

jsonp接口测试:(调用外部接口)

接口测试地址:http://api.asilu.com/#geo

如果需要参数,记得填 data:‘’,参数 下面是无参调用。

jquery:网络地址(对于jquery版本不做要求,尽量不要太低)

<script type="text/javascript" src="

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值