uni-app微信小程序獲取用戶地理位置信息 - 新聞資(zī)訊 - 雲南小程序開發|雲南軟件開發|雲南網站(zhàn)建設-西山區知普網絡科技工作室

159-8711-8523

雲南網建設/小程序開發/軟件開發

知識

不管是網站(zhàn),軟件還是小程序,都要直接或間接能為您産生價值,我們在追求其視覺表現的同時,更側重于功能的便捷,營銷的便利,運營的高效,讓網站(zhàn)成為營銷工具,讓軟件能切實提升企業(yè)内部管理水平和(hé)效率。優秀的程序為後期升級提供便捷的支持!

uni-app微信小程序獲取用戶地理位置信息

發表時間:2020-10-8

發布人:葵宇科技

浏覽次數:90

uni-app 小程序項目無法直接獲取到地理位置,隻能通(tōng)過獲取到的經緯度,調用第三方地圖Api獲取。

1.在 manifest.json - 微信小程序配置 - 填寫微信小程序AppID、選擇位置接口,填寫申請原因

2.選擇第三方地圖Api,因為是做小程序,這裡選擇騰訊地圖

3.注冊、登陸後,在控制台 - key管理中(zhōng)創建秘鑰

4.引入騰訊地圖Api

5.授權調用已經封裝好的方法,獲取經緯度解析出地理位置信息

6.如(rú)果用戶未授權,默認會執行fail回調,所以添加提示框進行重新授權确認

/**
 * @Author: licheng
 * @Date: 2019/12/21 6:06 下(xià)午
 * @Description:
 */
import QQMapWX from "../static/js/qqmap-wx-jssdk.min.js";

const getCity = () => {
  return new Promise((resolve, reject) => {
    // 獲取授權信息
    uni.getSetting({
      success: res => {
        // console.log(res);
        if (res.authSetting && res.authSetting.hasOwnProperty("scope.userLocation")) {
          if (res.authSetting["scope.userLocation"]) {
            getCityInfo();
          } else {
            uni.showModal({
              title: "提示",
              content: "請重新授權獲取你(nǐ)的地理位置,否則部分功能将無法使用",
              success: (res) => {
                if (res.confirm) {
                  uni.openSetting({
                    success: () => getCityInfo()
                  });
                } else {
                  reject("請授權獲取你(nǐ)的地理位置,否則部分功能将無法使用!");
                }
              },
            });
          }
        } else {
          getCityInfo();
        }
      }
    });

    // 獲取地理位置信息
    const getCityInfo = () => {
      // 騰訊地圖Api
      const qqmapsdk = new QQMapWX({ key: "這裡填寫騰訊地圖的秘鑰" });
      // 授權
      uni.authorize({
        scope: "scope.userLocation",
        success: () => {
          uni.getLocation({
            type: "gcj02", //  wgs84: 返回GPS坐(zuò)标,gcj02: 返回國測局坐(zuò)标
            success: res => {
              const {latitude, longitude} = res;
              const location = {latitude, longitude};
              qqmapsdk.reverseGeocoder({
                location,
                success: res => resolve(res.result)
              });
            }
          });
        },
        fail: () => reject("請授權獲取你(nǐ)的位置,否則部分功能将無法使用!"),
      });
    };
  });
};

export default getCity;

轉載:uni-app 小程序項目獲取地理位置

相關(guān)案例查看更多