微信定位功能结合百度地图获取用户城市

需要结合百度地图的API，请先完成这篇文章的流程：《使用百度地图将经纬度转换成具体位置》

以vuejs为例

beforeMount () {
            var that = this;
            this.city = ‘正在定位城市...‘;
            this.wxapi.getWxConfig({
                url: window.location.href.split(‘#‘)[0]
            }).then(_ => {
                if (+(_.returnCode) == 0) {
                    // 初始化微信配置
                    wx.config(_.data);
                    // 微信初始化事件
                    wx.ready(function(){
                        // 调用微信定位接口
                        wx.getLocation({
                            type: ‘wgs84‘, // 默认为wgs84的gps坐标，如果要返回直接给openLocation用的火星坐标，可传入‘gcj02‘
                            success: function (res) {
                                var latitude = res.latitude; // 纬度，浮点数，范围为90 ~ -90
                                var longitude = res.longitude; // 经度，浮点数，范围为180 ~ -180。
                                if (latitude && longitude) {
                                      window.getlocation = function (data) {
                                          Loader.hideAll();
                                          if (data.status == 0) {
                                              var city = data.result.addressComponent.city
                                              Toast("定位到当前城市为：" + city);
                                              that.city = city
                                              this.$store.state.city = city
                                          } else {
                                              Toast(‘地址解析失败，请手动选择城市‘)
                                              that.$router.push(‘/cityselect‘)
                                          }
                                      }

                                      Loader.show(‘正在定位...‘);
                                      var o = document.createElement(‘script‘);
                                      o.src = `http://api.map.baidu.com/geocoder/v2/?callback=getlocation&location=${latitude},${longitude}&output=json&pois=1&ak=PaY0aQpuk5ypaxL1bGH4y65nbitEd0u3`;
                                      document.documentElement.childNodes[0].appendChild(o);
                                  } else {
                                      Toast(‘微信定位失败，请手动选择城市‘)
                                      that.$router.push(‘/cityselect‘)
                                  }
                            }
                        });
                    });
                    // config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
                    wx.error(function(res){
                        that.city = "定位失败，请手动选择城市";
                        Toasrt(‘微信接口调用失败，请手动选择城市‘)
                        that.$router.push(‘/cityselect‘)
                    });
                } else {
                    Toast("获取微信配置失败" + _.msg);
                    that.city = "定位失败，请手动选择城市";
                    that.$router.push(‘/cityselect‘)
                }
            })
        }

原文地址：https://www.cnblogs.com/CyLee/p/8661724.html