微信小程序獲取當前位置和城市名

這篇文章主要介紹了微信小程序獲取當前位置和城市名的思路,非常不錯，具有一定的參考借鑒價值，需要的朋友可以參考下

目錄

• 一、授權並獲取經緯度
• 騰訊地圖API
• • • **簡介**
    • Hello world！

一、授權並獲取經緯度

1， 獲取當前地理位置，首先要拿到用戶的授權wx.openSetting；
2，微信的getLocation接口，獲取當前用戶的地理位置（微信返回的是經緯度，速度等參數）；
3，微信沒有將經緯度直接轉換為地理位置，借用騰訊位置服務中關於微信小程序的地理轉換JS SDK 的API（返回信息中包括國家，省，市，區，經緯度等地理位置）
步驟描述清楚以后，下面就開始按步驟操作了；（本文僅僅講述如何獲取用戶地理位置的授權）

圖示為獲取用戶地理位置授權彈窗

在用戶首次進入某頁面（需要地理位置授權）時候，在頁面進行onLoad，onShow時候，進行調用wx.getLocation要求用戶進行授權；以后每次進入該頁面時，通過wx.getSetting接口，返回用戶授權具體信息。

wx.getSetting接口具體API地址鏈接為點擊打開鏈接

上圖中scope.userLocation就是地理授權的標志；

當該標志是underfind，表示用戶初次進入該頁面，當該標志是false，表示用戶初次進入該頁面拒絕了地理授權，應進行重新要求獲取授權。

wx.getSetting({
   success: (res) => {
    console.log(JSON.stringify(res))
    // res.authSetting['scope.userLocation'] == undefined 表示 初始化進入該頁面
    // res.authSetting['scope.userLocation'] == false 表示 非初始化進入該頁面,且未授權
    // res.authSetting['scope.userLocation'] == true 表示 地理位置授權
    if (res.authSetting['scope.userLocation'] != undefined && res.authSetting['scope.userLocation'] != true) {
     wx.showModal({
      title: '請求授權當前位置',
      content: '需要獲取您的地理位置，請確認授權',
      success: function (res) {
       if (res.cancel) {
        wx.showToast({
         title: '拒絕授權',
         icon: 'none',
         duration: 1000
        })
       } else if (res.confirm) {
        wx.openSetting({
         success: function (dataAu) {
          if (dataAu.authSetting["scope.userLocation"] == true) {
           wx.showToast({
            title: '授權成功',
            icon: 'success',
            duration: 1000
           })
           //再次授權，調用wx.getLocation的API
          } else {
           wx.showToast({
            title: '授權失敗',
            icon: 'none',
            duration: 1000
           })
          }
         }
        })
       }
      }
     })
    } else if (res.authSetting['scope.userLocation'] == undefined) {
     //調用wx.getLocation的API
    }
    else {
     //調用wx.getLocation的API
    }
   }
  })

在拿到用戶授權以后，使用微信的API獲取當前位置的經緯度鏈接: 微信獲取位置API

騰訊地圖API

簡介

騰訊位置服務為微信小程序提供了基礎的標點能力、線和圓的繪制接口等地圖組件和位置展示、地圖選點等地圖API位置服務能力支持，使得開發者可以自由地實現自己的微信小程序產品。 在此基礎上，騰訊位置服務微信小程序JavaScript SDK是專為小程序開發者提供的LBS數據服務工具包，可以在小程序中調用騰訊位置服務的POI檢索、關鍵詞輸入提示、地址解析、逆地址解析、行政區划和距離計算等數據服務，讓您的小程序更強大

Hello world！

1、申請開發者密鑰（key）： 申請密鑰

2、開通webserviceAPI服務：控制台 ->應用管理 -> 我的應用->添加key-> 勾選WebServiceAPI -> 保存

3、(小程序SDK需要用到webserviceAPI的部分服務，所以使用該功能的KEY需要具備相應的權限)

4、下載微信小程序JavaScriptSDK，微信小程序JavaScriptSDK v1.1 JavaScriptSDK v1.2
5、安全域名設置，在小程序管理后台 -> 開發 -> 開發管理 -> 開發設置 -> “服務器域名” 中設置request合法域名，添加https://apis.map.qq.com

小程序示例

// 引入SDK核心類，js文件根據自己業務，位置可自行放置
var QQMapWX = require('../../libs/qqmap-wx-jssdk.js');
var qqmapsdk;
Page({
 
    onLoad: function () {
        // 實例化API核心類
        qqmapsdk = new QQMapWX({
            key: '申請的key'
        });
    },
    onShow: function () {
        // 調用接口
        qqmapsdk.search({
            keyword: '酒店',
            success: function (res) {
                console.log(res);
            },
            fail: function (res) {
                console.log(res);
            },
        complete: function (res) {
            console.log(res);
        }
     });
  }
})

獲取當前位置

wx.getLocation({
      isHighAccuracy: true,
      success(res) {
        let {latitude,longitude} = res
        // 調用騰訊地圖api獲取當前位置
        qqmapsdk.reverseGeocoder({
          location: {
            latitude: latitude,
            longitude: longitude
          },
          success: function (res) {
          	console.log(res.result)
          },
          fail: function (res) {
            console.log(res);
          },
          complete: function (res) {
            console.log(res);
          }
        });
      }
    })

使用限制
為了保證我們的服務穩定，我們對每個key的每個服務接口的調用量做了如下限制：

日調用量：1萬次 / Key
並發數：5次 / key / 秒 。
超過日調用量和並發數的開發者，可通過以下途徑解決：
1.對於多頻次的相同請求，可通過緩存結果，並定時訪問更新的方式，減少對在線服務調用的依賴；
2.企業開發者的配額高於個人開發者，申請企業認證后，需要在 控制台->配額申請 中免費申請你需要的配額。
我們將對您的申請進行評估並進行審批（3個工作日內），審批通過后將會獲得您申請的配額。
3.對於切實需要大配額來滿足應用需求的，請在控制台->配額管理中提交購買配額申請，我們的商務會與您取得聯系。