腾讯地图–逆地址解析(经度纬度转换地址)

一、使用腾讯地图的API接口必须先拥有开发者账号并申请自己的key 腾讯地图入口
申请了自己的key通过get请求接口
https://apis.map.qq.com/ws/geocoder/v1/?location=39.984154,116.307490&key=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77&get_poi=1
详细api参数请查看 官方文档

作者也是在使用的时候遇到了几个问题,我在这给大家避下坑:

一、跨域

在本地使用接口的使用我们会遇到No ‘Access-Control-Allow-Origin’ header is present on the requested resource’跨域错误,所以就需要我们在vue.config.js配置代理
vue.config.js 文件:

devServer: {
    port: port,
    open: true,
    overlay: {
     warnings: false,
     errors: true
   },
   proxy: { // 配置跨域
       '/tx': {
            target: 'https://apis.map.qq.com/',
            changeOrigin: true,
             pathRewrite: {
              '^/tx': ''
             }
        }
   },

之后我们就必须改变一下腾讯地图给我们的api接口:

http://localhost:8080/tx/ws/geocoder/v1/?location=39.984154,116.307490&key=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77&get_poi=1

注意这里我加了tx这个标识,改成本地的localhost。

二、错误处理

当我们调用接口时有报错时可以查看文档 状态码说明
关于授权的问题:可以直接在腾讯地图api官网里控制台的应用管理进行设置
在这里插入图片描述

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐