欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

微信小程序獲取當(dāng)前位置和城市名

 更新時間:2019年11月13日 16:06:07   作者:下頁、再停留  
這篇文章主要介紹了微信小程序獲取當(dāng)前位置和城市名的思路,非常不錯,具有一定的參考借鑒價值,需要的朋友可以參考下

   1, 獲取當(dāng)前地理位置,首先要拿到用戶的授權(quán)wx.openSetting;

    2,微信的getLocation接口,獲取當(dāng)前用戶的地理位置(微信返回的是經(jīng)緯度,速度等參數(shù));

    3,微信沒有將經(jīng)緯度直接轉(zhuǎn)換為地理位置,借用騰訊位置服務(wù)中關(guān)于微信小程序的地理轉(zhuǎn)換JS SDK 的API(返回信息中包括國家,省,市,區(qū),經(jīng)緯度等地理位置)
步驟描述清楚以后,下面就開始按步驟操作了;(本文僅僅講述如何獲取用戶地理位置的授權(quán))

圖示為獲取用戶地理位置授權(quán)彈窗

在用戶首次進入某頁面(需要地理位置授權(quán))時候,在頁面進行onLoad,onShow時候,進行調(diào)用wx.getLocation要求用戶進行授權(quán);以后每次進入該頁面時,通過wx.getSetting接口,返回用戶授權(quán)具體信息。

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

 上圖中scope.userLocation就是地理授權(quán)的標志;

當(dāng)該標志是underfind,表示用戶初次進入該頁面,當(dāng)該標志是false,表示用戶初次進入該頁面拒絕了地理授權(quán),應(yīng)進行重新要求獲取授權(quán)。

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

在拿到用戶授權(quán)以后,使用微信的API獲取當(dāng)前位置的經(jīng)緯度微信獲取位置API

這里,我們進行使用的是騰訊位置服務(wù);專為小程序開發(fā)者提供LBS數(shù)據(jù)服務(wù)工具包,可以在小程序中調(diào)用騰訊位置服務(wù)的POI檢索、關(guān)鍵詞輸入提示、地址解析、逆地址解析、行政區(qū)劃和距離計算等數(shù)據(jù)。 

    1,得到開發(fā)者秘鑰

    2,下載微信小程序javaScriptSDK,

    3,安全域名設(shè)置,在“設(shè)置” -> “開發(fā)設(shè)置”中設(shè)置request合法域名,添加http://api.map.qq.com

在文件中引入對應(yīng)的javaScriptSDK文件

var QQMapWX = require('../../../utils/qqmap-wx-jssdk.js');
var qqmapsdk;

在文件中進行js調(diào)用

 最后的結(jié)果就是可以獲得自己所在城市的具體位置了

index.js部分的代碼

//index.js
//獲取應(yīng)用實例
const app = getApp();
var QQMapWX = require('../../../utils/qqmap-wx-jssdk.js');
var qqmapsdk;
Page({
 data: {
  province: '',
  city: '',
  latitude: '',
  longitude: ''
 },
 onLoad: function () {
  qqmapsdk = new QQMapWX({
   key: 'XXXX-XXXX-XXXX-XXXX' //這里自己的key秘鑰進行填充
  });
 },
 onShow: function () {
  let vm = this;
  vm.getUserLocation();
 },
 getUserLocation: function () {
  let vm = this;
  wx.getSetting({
   success: (res) => {
    console.log(JSON.stringify(res))
    // res.authSetting['scope.userLocation'] == undefined  表示 初始化進入該頁面
    // res.authSetting['scope.userLocation'] == false  表示 非初始化進入該頁面,且未授權(quán)
    // res.authSetting['scope.userLocation'] == true  表示 地理位置授權(quán)
    if (res.authSetting['scope.userLocation'] != undefined && res.authSetting['scope.userLocation'] != true) {
     wx.showModal({
      title: '請求授權(quán)當(dāng)前位置',
      content: '需要獲取您的地理位置,請確認授權(quán)',
      success: function (res) {
       if (res.cancel) {
        wx.showToast({
         title: '拒絕授權(quán)',
         icon: 'none',
         duration: 1000
        })
       } else if (res.confirm) {
        wx.openSetting({
         success: function (dataAu) {
          if (dataAu.authSetting["scope.userLocation"] == true) {
           wx.showToast({
            title: '授權(quán)成功',
            icon: 'success',
            duration: 1000
           })
           //再次授權(quán),調(diào)用wx.getLocation的API
           vm.getLocation();
          } else {
           wx.showToast({
            title: '授權(quán)失敗',
            icon: 'none',
            duration: 1000
           })
          }
         }
        })
       }
      }
     })
    } else if (res.authSetting['scope.userLocation'] == undefined) {
     //調(diào)用wx.getLocation的API
     vm.getLocation();
    }
    else {
     //調(diào)用wx.getLocation的API
     vm.getLocation();
    }
   }
  })
 },
 // 微信獲得經(jīng)緯度
 getLocation: function () {
  let vm = this;
  wx.getLocation({
   type: 'wgs84',
   success: function (res) {
    console.log(JSON.stringify(res))
    var latitude = res.latitude
    var longitude = res.longitude
    var speed = res.speed
    var accuracy = res.accuracy;
    vm.getLocal(latitude, longitude)
   },
   fail: function (res) {
    console.log('fail' + JSON.stringify(res))
   }
  })
 },
 // 獲取當(dāng)前地理位置
 getLocal: function (latitude, longitude) {
  let vm = this;
  qqmapsdk.reverseGeocoder({
   location: {
    latitude: latitude,
    longitude: longitude
   },
   success: function (res) {
    console.log(JSON.stringify(res));
    let province = res.result.ad_info.province
    let city = res.result.ad_info.city
    vm.setData({
     province: province,
     city: city,
     latitude: latitude,
     longitude: longitude
    })
   },
   fail: function (res) {
    console.log(res);
   },
   complete: function (res) {
    // console.log(res);
   }
  });
 }
})

頁面展示部分的代碼

<!--index.wxml-->
<view class="retailStore">
  <view class="cnaps borderBottom">
  <text>所在城市</text>
  <input class='m-bbt' placeholder-class='plhStyle' type='number' maxlength='50' placeholder='' bindinput="bindKeyInput" value='{{province}} {{city}}' disabled></input>
 </view>
</view>

總結(jié)

以上所述是小編給大家介紹的微信小程序獲取當(dāng)前位置和城市名,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
如果你覺得本文對你有幫助,歡迎轉(zhuǎn)載,煩請注明出處,謝謝!

相關(guān)文章

最新評論