码迷,mamicode.com
首页 > Web开发 > 详细

Jsonp解决跨域问题

时间:2019-02-26 15:09:09      阅读:218      评论:0      收藏:0      [点我收藏+]

标签:exp   response   span   modal   component   rom   安装   dex   back   

一、安装Jsonp

npm install jsonp --save

二、封装组件

建一个axios文件夹,创建index.js文件

技术图片
 1 import Jsonp from jsonp
 2 import  axios from axios
 3 import {Modal} from antd
 4 export default  class Axios{
 5      static jsonp(options){
 6       return   new Promise((resolve,reject)=>{
 7              Jsonp(options.url,{
 8                  param:callback
 9              },function(err,response){
10                 if(response.status === success){
11                     resolve(response);
12                 }else{
13                     reject(response.message);
14                 }
15              })
16          })
17      }
18 
19 }
View Code

三、调用

技术图片
 1     getWeatherAPIData(){
 2         let city=北京
 3         axios.jsonp({
 4             url:http://api.map.baidu.com/telematics/v3/weather?location=+encodeURIComponent(city)+&output=json&ak=3p49MVra6urFRGOT9s8UBWr2
 5         }).then((res)=>{
 6             if(res.status === success){
 7             let data =res.results[0].weather_data[0];
 8             this.setState({
 9                 dayPictureUrl:data.dayPictureUrl,
10                 weather:data.weather
11             })
12             }
13          }
14 
15         )
16     }
View Code

然后就实现了跨域请求

Jsonp解决跨域问题

标签:exp   response   span   modal   component   rom   安装   dex   back   

原文地址:https://www.cnblogs.com/yinhao-jack/p/10437289.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!