vue工程中，如何查询用户访问的地理位置 + vue中的jsonp

有一个需求，就是当用户访问你们公司的网站时，需要查到这位用户的地理位置（通过电脑ip来访问）

试了很多方法，感觉使用腾讯的位置服务api最好，返回的信息最全，包括经纬度，国家城市地区等。而其他绝大多数仅仅反馈了一个城市名。

接下来就说一下怎么使用腾讯的位置服务获取用户访问的地理信息：

　　一、首先在https://lbs.qq.com/console/setting.html这个网页中 ， 申请你自己key，也就是密钥，有了这个密钥，你才有资格使用位置服务api；

　　二、申请后，然后在官网上设置你的key，找到　　key管理--》启用产品--》WebServiceAPI   选择授权IP  内容输入0.0.0.0-255.255.25.255

　　三、然后在页面上进行使用就行了，但这个接口是跨域的，而腾讯给的方法是jsonp解决跨域，倘若是原生，我们可以直接用jq来进行jsonp跨域，

可是axios根本不能进行jsonp跨域，网上查了半天，才找到vue中原来有一个依赖   vue-jsonp  用于专门解决jsonp跨域

　　接下来就说一下如何使用jsonp来进行腾讯位置信息api的获取：

 

　　1.安装下载vue-jsonp依赖

cnpm i -S vue-jsonp

　　2.在main.js中导入vue-jsonp

import VueJsonp from 'vue-jsonp'
Vue.use(VueJsonp)

　　3.请求接口，获取数据

　　　　created() {
            var data = {
                key: "WDTBZ-EOPRG-5ONQY-IDVMO-NXIIK-C4B7A"  //这个key就是你申请的密钥
            }; 
            var url = "https://apis.map.qq.com/ws/location/v1/ip"; //这个就是地理位置信息的接口
            data.output = "jsonp";
            this.$jsonp(url, data)
                .then(res => {
                  console.log(res) 
                })
                .catch(error => {
                    console.log(error);
                });
        },


　　　　//res：{status: 0, message: "query ok", result: {…}}
　　　　//result中。就是各种信息。比如经纬度，国家，地区等等

ok，完成！