uni-app腾讯地图签名计算

 h5中调用使用jsonp,注意参数中会带上callback,需要额外处理这个参数的逻辑。

这里jsop是用的库为 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
  })
}

猜你喜欢

转载自blog.csdn.net/cscj2010/article/details/127890711
今日推荐