json解决ajax跨域的原理

jsonp只能解决GET类型的ajax请求跨域问题
jsonp请求不是ajax请求，而是一般的get请求
基本原理
- 　　浏览器端：
  1. 　　动态生成<script>来请求后台接口(src就是接口的url)
  2. 　　定义好用于接受响应数据的函数(fn),并将函数名通过请求参数提交给后台(如：callback=fn)
- 　　服务器端
  1. 　　接收到的请求处理产生结果数据后，返回一个函数调用的js代码，并将结果数据作为实参传入函数调用
- 　　浏览器端
  1. 　　收到响应自动执行函数调用的js代码，也就是执行了提前定义好的回调函数，并得到了需要的结果数据

/*

jsonp请求的接口请求函数

*/

　　import jsonp from 'jsonp'

　　import { message } from 'antd'

export const reqWeather= (city)=>{

    return new Promise((resolve,reject) => {

        const url = `http://wthrcdn.etouch.cn/weather_mini?city=${city}`

        //发送jsonp请求

        jsonp(url,{},(err,data) =>{

            console.log('json()',err,data)

            //如果成功了

            if(!err&&data.status===){

                const {date,type} = data.data.forecast[]

                resolve({date,type})

            }else{

            //如果失败了

                message.error('获取天气信息失败')

            }

        })

    })

}

//reqWeather('武汉')

巴特西

json解决ajax跨域的原理

最新文章

热门文章