腾讯位置服务接入教程

腾讯位置服务接入

在这里插入图片描述
这么炫酷的界面不想来看看吗?
腾讯位置服务

一、前期准备

  1. 账号注册
    微信直接扫码登陆
  2. 申请开发者key
    控制台->key与配额->key管理
    key申请
  3. key设置
    最好把每个独立的功能抽出来申请一个开发者key
    这里我申请了两个 (反正又不花钱^ v ^)
    进入key设置的界面
    key设置
    直接勾选WebServiceAPI就行✔
    set
    之后点保存

二、开发前准备

我想做的是一个根据用户此时的ip获取用户的位置之后查询当地的天气数据原理和实现都比较简单

  1. 作为一名合格的开发者,接触到一个新的东西第一步当然是要看它的开发文档了。
    文档链接在这里WebService API 开发文档
    定位到我们要使用的IP定位服务
    看一下请求和响应字段
    Request:
    在这里插入图片描述
    Response:
    在这里插入图片描述
  2. 拿到一个陌生的接口当然是先自己测试以下,看看返回的数据是否符合接口文档的设计(虽然像腾讯这样的大厂不可能存在数据与文档不符合的情况),这是一个好习惯,可以有效防止开始开发之后因为数据不符与后端扯皮而造成摸鱼时间的减少。
  • 打开posman
    不知道为什么我的postman无法打开,看来之后要重新安装一下
    (这不是减少我的摸鱼时间吗?)
    还好有很多在线接口测试工具可以使用
    这里我用了getman
  • 填好请求地址和参数key就可以愉快的发起请求了
  • 点一下✔ 啪的一下,很快啊,数据就返回了
    在这里插入图片描述
  • 看一下响应字段和嵌套关系
    status和message表示请求结果及状态
    在这里插入图片描述
    在这里插入图片描述
    结构也相同,终于可以进入激动人心的开发环节了

三、开发流程

套用一个以前写的简单的模板
使用了jq封装好的ajax api也简化一下请求操作
主要代码如下:

const key = 'VOKBZ-XXXXX-XXXXX-XXXXX-XXXXX-EKBXF'
console.log(location)
window.onload = ()=>{
    
    
	$.ajax({
    
    
          url: 'https://apis.map.qq.com/ws/location/v1/ip?key='+key,
          data: {
    
    },
          success: function(res){
    
    
           		$("#location").html(res.result.ad_info.province+'/'+res.result.ad_info.city)
          }
	})
}

是不是很简单?
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/qq_41122414/article/details/113111645