微信小程序授权获取用户当前经纬度位置并转换为具体城市
生活随笔
收集整理的這篇文章主要介紹了
微信小程序授权获取用户当前经纬度位置并转换为具体城市
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
每日一句激勵人心的雞湯:
????認真閱讀接口文檔,
????認真閱讀接口文檔,
????認真閱讀接口文檔。
微信小程序獲取用戶當前經緯度位置
getLocation() API文檔傳送門,查看文檔后你會發現想要拿到用戶當前所在位置的經緯度,你還得經過他的授權,就是你進入一個小程序的時候,他會彈出一個框:XX小程序現在想要獲取你的位置>>>>>授權授權授權,可以用 wx.getSetting,wx.openSetting , wx.authorize 來引導獲取用戶的授權,然后看文檔吧,我下面就貼代碼
// 微信獲得經緯度getLocation() {let that = this;wx.getLocation({type: 'wgs84',//wgs84 返回 gps 坐標,gcj02 返回可用于 wx.openLocation 的坐標success(res) {console.log(JSON.stringify(res))var latitude = res.latitudevar longitude = res.longitudevar speed = res.speedvar accuracy = res.accuracy;that.getLocal(latitude, longitude)},fail(res) {console.log('fail' + JSON.stringify(res))}})}, // 微信授權 獲取當前地理位置getUserLocation() {let vm = this;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的APIvm.getLocation();} else {wx.showToast({title: '授權失敗',icon: 'none',duration: 1000})}}})}}})} else if (res.authSetting['scope.userLocation'] == undefined) {//調用wx.getLocation的APIvm.getLocation();}else {//調用wx.getLocation的APIvm.getLocation();}}})},轉換為具體城市
??申請密鑰通過經緯度去確認位置需要用到第三方接口,這里用的是騰訊地圖的
??百度微信搜索下載微信小程序JavaScriptSDK,獲得新道具qqmap-wx-jssdk.min,放到我們的util下面
??安全域名設置:百度搜索微信小程序,進入,掃碼登錄的你的賬號,在“設置” -> “開發設置”的服務器域名中設置request合法域名,添加??https://apis.map.qq.com
最后還要在我們項目的配置SDK的設置,我用的是uniapp寫的,就在manifest.json中這樣寫道:
總結
以上是生活随笔為你收集整理的微信小程序授权获取用户当前经纬度位置并转换为具体城市的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: ArcGIS制作四色地图
- 下一篇: 计算机毕业设计(附源码)python药店