微信小程序 + 腾讯位置服务获取全国城市列表 - 新闻资讯 - 云南小程序开发|云南软件开发|云南网站建设-昆明葵宇信息科技有限公司

159-8711-8523

云南网建设/小程序开发/软件开发

知识

不管是网站,软件还是小程序,都要直接或间接能为您产生价值,我们在追求其视觉表现的同时,更侧重于功能的便捷,营销的便利,运营的高效,让网站成为营销工具,让软件能切实提升企业内部管理水平和效率。优秀的程序为后期升级提供便捷的支持!

您当前位置>首页 » 新闻资讯 » 小程序相关 >

微信小程序 + 腾讯位置服务获取全国城市列表

发表时间:2020-10-4

发布人:葵宇科技

浏览次数:59

目录

            • 1、注册登录腾讯位置服务
            • 2、创建key(申请开发者密钥)
            • 3、下载微信小程序JavaScriptSDK
            • 4、配置微信小程序安全域名
            • 5、小程序代码示例
            • 6、小程序添加配置
            • 7、控制台查看调用结果

1、注册登录腾讯位置服务

点击前往

2、创建key(申请开发者密钥)

【控制台】-【key管理】-【创建新密钥】

完成后要开通开通webserviceAPI服务

【控制台】-【 key管理】-【 设置】(使用该功能的key)-【勾选webserviceAPI】- 【保存】

小程序SDK需要用到webserviceAPI的部分服务,所以使用该功能的key需要具备相应的权限

设置key页面

3、下载微信小程序JavaScriptSDK

下载 微信小程序JavaScriptSDK v1.2 放入到你的小程序项目中

4、配置微信小程序安全域名

登录微信小程序后台,添加 request 合法域名 https://apis.map.qq.com

5、小程序代码示例
// 引入SDK核心类,根据你的路径进行修改
var QQMapWX = require('../../static/qqmap-wx-jssdk1.2/qqmap-wx-jssdk.js');
var qqmapsdk;
Page({
  /**
   * 页面的初始数据
   */
  data: {

  },

  /**
   * 生命周期函数--监听页面加载
   */
 >: function (options) {
    // 实例化API核心类
    qqmapsdk = new QQMapWX({
      key: '你申请的 key 填入此处'
    });
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
 >: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
 >: function () {
    var _this = this;
    //调用获取城市列表接口
    qqmapsdk.getCityList({
      success: function (res) {//成功后的回调
        console.log(res);
      },
      fail: function (error) {
        console.error(error);
      }
    });
  }
})
6、小程序添加配置

app.json 文件最后面添加

"permission": {
    "scope.userLocation": {
      "desc": "你的位置信息将用于小程序位置接口的效果展示"
    }
  }
7、控制台查看调用结果

返回的城市列表

相关案例查看更多