VUE2.0之Jsonp的使用方法(前端)

36 篇文章 7 订阅 ¥19.90 ¥99.00
本文详细介绍了在Vue2.0项目中如何使用JSONP来实现跨域数据请求。首先解释了JSONP的用途和原理,即利用Script标签的src属性实现跨域。接着,通过引入github上的jsonp库,封装了一个jsonp.js,并展示了在recommend.vue组件中如何调用这个API,最后展示了成功的请求结果。
摘要由CSDN通过智能技术生成

本文主要介绍的是在VUE2.0Jsonp的使用方法,通过github引入jsonp和promise封装,实现跨域获取数据。

1.JSONP的用途和原理

使用JSONP主要是目的通过动态创建Script,动态拼接url,进而抓取数据,实现跨域。确切地说,AJAX请求由于同源影响,是不允许进行跨域请求的,而Script标签src属性中的链接却可以访问跨域的js脚本,利用这一特性,服务端不再返回JSON格式的数据,而是返回一段调用某个函数的JS代码,在src属性中进行调用,实现跨域。

2.JSONP的使用方法

2.1 引入github的jsonp

打开项目>package.json>在"dependencies"下添加代码
"jsonp": "^0.2.1"
这里写图片描述
如图所示,然后执行安装cmd指令,并重新运行项目
npm install npm run

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值