The call in h5 uses jsonp. Note that the callback will be included in the parameter, and the logic of this parameter needs to be additionally processed.
The library used by jsop here is vue-jsonp
/**
* 生成签名
* @param {*} path
* @param {*} params
*/
const getSig = function (path, params) {
const paramsStr = Object.keys(params)
.sort()
.reduce((res, key) => {
const value = params[key]
return [...res, key + '=' + value]
}, [])
.join('&')
return md5(path + '?' + paramsStr + SECRET_KEY)
}
/**
* 地图专用API请求(主要是为了处理跨域问题)
* @param {Object} path
* @param {Object} param
*/
const mapRequest = function (path, params) {
return new Promise((resolve, reject) => {
const callbackName = 'jsonp_' + guid()
params = {
key: MAP_KEY,
output: 'json',
...params,
}
// #ifdef H5
params.output = 'jsonp'
params.callback = callbackName
// #endif
params.sig = getSig(path, params)
const url = 'https://apis.map.qq.com' + path
// #ifdef H5
jsonp(url, { ...params, callbackName })
.then((data) => {
resolve(data)
})
.catch((error) => {
reject(error)
})
// #endif
// #ifndef H5
uni.request({
url: url,
method: 'GET',
data: params,
success: (data) => {
resolve(data.data)
},
fail: (error) => {
reject(error)
},
})
// #endif
})
}