uni-app 微信小程序 用高德sdk获取地理位置，以和天气信息

uni-app 微信小程序采用高德sdk获取地理位置和天气信息主要有以下几个步骤：

1. 注册高德开发者，并获取应用key

    概述-微信小程序插件 | 高德地图API

在这个网页最下面，按步骤来就可以了。注意创建完应用后，点击添加按钮，选择小程序sdk 生成key。最后生成的key如下所示：

 2. 下载高德小程序sdk，并放在uni-app项目中

相关下载-微信小程序插件 | 高德地图API

3. 使用高德小程序sdk 获取地理位置接口，天气信息接口

1.  
   import amap from "@/libs/gaode/amap-wx.130.js";
2.  
    
3.  
   created() {
4.  
   this.amapPlugin = new amap.AMapWX({
5.  
   key: "fc60464e53ac5bfc1f933d9b5e0a0a3b",
6.  
   });
7.  
   this.getLocation();
8.  
   },
9.  
    
10.  
    methods: {
11.  
    async getLocation() {
12.  
    const res = await checkAuthorize("userLocation");
13.  
    if (res.success) {
14.  
    this.getRegeo();
15.  
    }
16.  
    },
17.  
    getRegeo() {
18.  
    const that = this;
19.  
    uni.showLoading({
20.  
    title: "获取信息中",
21.  
    });
22.  
    this.amapPlugin.getRegeo({
23.  
    success(data) {
24.  
    that.loc = data[0].name;
25.  
    uni.hideLoading();
26.  
    },
27.  
    fail(err){ //不加此字段控制台会报错
28.  
    console.log('fail')
29.  
    }
30.  
    });
31.  
    this.amapPlugin.getWeather({
32.  
    success(res){
33.  
    console.log('liubbc weather: ', res)
34.  
    that.imgList[4].name = res.humidity.data
35.  
    that.temperature = res.temperature.data
36.  
    that.weather = res.weather.data
37.  
    that.imgList[1].name = res.windpower.data
38.  
    that.time = res.liveData.reporttime
39.  
    },
40.  
    fail(err){
41.  
    console.log('fail')
42.  
    }
43.  
    })
44.  
    },
45.  
    },

注意在接口传递参数中要加上fail 字段，否则控制台会报错。

4. 添加服务器域名（https://restapi.amap.com）

    你可能在开发微信开发者工具中，以及真机调试中都能获取地理位置和天气信息，但发布到体验版，或发布到线上，一直loading 获取不到天气信息，这是因为没有把高德小程序sdk接口用到的URL地址添加到小程序服务器域名中。

这篇好文章是转载于：学新通技术网