vue 根据当前登录用户的ip 查询所属城市

先上个效果图：

 

 这里用到了 这个IP 查询的 地址： 

https://ip.ws.126.net/ipquery?ip=223.70.131.150

因为这个地址请求设计到跨域，所以在vue里面可以用代理来解决：

vue.config.js 里面：

// 设置代理
		proxy: {
			"/cityApi": {
				target: "https://ip.ws.126.net/ipquery",
				changeOrigin: true,
				pathRewrite: {
					"^/cityApi": ""
				}
			},
}

 然后在vue页面调用接口：

  let formData = {
        ip: "223.70.131.150"   //这里做测试ip地址写死的
      }；
this.$axios({
        url: "/cityApi", 
        method: 'get',
        params: formData
    }).then(res=>{
      console.log("res:", res, JSON.parse(JSON.stringify(res.data)) )
      let result1 = JSON.parse(JSON.stringify(res.data))
      let data1 = result1.split(';')[1]
      let data2 = data1.split('=')[1]
      let data3 = data2.slice(1)
      let data4 = data3.split('}')[0]
      let data5 = data4.split(',')
      console.log("data1:", data1)
      console.log("data2:", data2)
      console.log("data3:", data3)
      console.log("data4:", data4)
      console.log("data5:", data5)
    })

注意： 这里传的ip是 写死的ip，自己用的话，自己改成动态变量就可以了。 

我这里只提供方法，，目前用了： 126 IP API  的查询接口，查询IP的接口有很多个，并不是只有126 IP API才能用，像淘宝IP地址库也能用、新浪IP API等等。

淘宝IP 地址库的使用：
http://ip.taobao.com/service/getIpInfo.php?ip=223.70.131.150