使用微信小程序顯示用戶當前地理位置的詳細代碼

更新時間：2022年06月08日 11:00:15 作者：chy

這篇文章主要介紹了使用微信小程序顯示用戶當前地理位置的詳細代碼,在微信小程序的開發(fā)中不可避免的會遇到需要顯示用戶地理位置的操作，本文將簡單介紹如何在微信小程序中顯示用戶當前的地理位置，需要的朋友可以參考下

前言

在微信小程序的開發(fā)中不可避免的會遇到需要顯示用戶地理位置的操作，本文將簡單介紹如何在微信小程序中顯示用戶當前的地理位置。

wx.getLocation

通過wx.getLocation我們得到用戶的經緯度位置。

使用wx.getLocation之前需要簡單的配置一下。因為獲取用戶地理位置的操作需要用戶同意，所以我們在app.json文件里面加上配置：

"permission": {
    "scope.userLocation": {
      "desc": "你的位置信息將用于小程序位置接口的效果展示"
    }

如下圖：

之后參考官方文檔使用：

 // 獲取用戶地理位置
      const res = await wx.getLocation({
        type: "wgs84",
      })
      console.log('地理位置', res)

輸出值為：

其中latitude是緯度，longitude是經度。

到這里我們的第一步已經完成了。

騰訊位置服務

第二步就是如何將經緯度轉化為地區(qū)位置了，我使用了騰訊的位置服務

根據(jù)個人情況登錄或者注冊，然后再點擊以下位置創(chuàng)建應用

然后點擊文檔里的以下位置

選擇逆地址解析

然后根據(jù)文檔編寫代碼

 var self = this
      wx.request({
        url: 'https://apis.map.qq.com/ws/geocoder/v1/',
        method: 'GET',
        data: {
          location: `${res.latitude},${res.longitude}`,
          key: '你自己的key'
        },
        success: (res) => {
          console.log('地址', res);
        }
      })

返回值如下：