需求:有一个项目是微信公众号,属于汽车服务。当车主在填写车主资料或者车辆认证时,需要填写车牌号或者车架号;车牌号需要选择省,为了方便用户操作,所以想自动定位默认省,如下图:

我查询了一些博客,找到了一些方法,经过测试,记录一下还能用的。

方法一:搜狐API

有时候cname这个字段返回的不是省市,因为在2/3/4G网络时,定位失败,但是IP还是可以用的,亦可以配合第二种方法使用。

 <!-- 获取用户IP以及位置信息、http&&https兼容--><script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>
<script src="https://pv.sohu.com/cityjson?ie=utf-8"></script><script>
// 打印returnCitySN : {"cip": "222.66.154.186", "cid": "310000", "cname": "上海市"};console.log(returnCitySN )let hcityIp = returnCitySN['cip'];let hxreturnCitySN = {cip:hcityIp,cname:returnCitySN['cname']};sessionStorage['hxreturnCitySN'] = JSON.stringify(hxreturnCitySN);
</script>

方法二:126API

// 126APIhttp://ip.ws.126.net/ipquery?ip=IP// 返回结果:
var lo="上海市", lc="徐汇区"; var localAddress={city:"徐汇区", province:"上海市"}

缺点:返回格式有点问题,不是UTF-8格式,转格式也失败

其实,我发现不加IP,也是可以返回正常结果的。鉴于第一种方法搜狐API的cname有时候拿不到正确的省市值,(确保cname在省市里面查不到,sessionStorage存储的时候就存储为空)我把他们结合了一下使用,当cname拿不到正确值时,拿到IP用于126API使用,我用了ajax的get请求,但是不知为何success情况下拿不到值,只能在error时才能拿到(如果有大佬知道,请告诉我一下,灰常感谢!!!),所以:

 error:function (err) {let hsStr = err.responseText;hsStr = hsStr.substring(hsStr.indexOf("{"), hsStr.indexOf("}")+1);hsStr = hsStr.substring(hsStr.indexOf("e")+3,hsStr.indexOf("}")-1)window.sessionStorage.setItem('hxProvince',hsStr);}

我在error里操作了,因为err.responseText结果返回格式是string,所以我截取了,拿到了

   // 20191227-Echo_hx-IP定位// 各省对应的简称hsimpleLicense:Array<any>= simpleLicense;hsimProvince:string='北京市';let hxProName = JSON.parse(sessionStorage['hxreturnCitySN']).cname;let hxProvince = sessionStorage['hxProvince'];let hsp = hxProName ? hxProName : hxProvince;this.hsimProvince = hsp ? hsp : '北京市'this.hsimpleLicense.forEach((val,index,arr)=>{if(this.hsimProvince.indexOf(val.fullLic)> -1){this.selectedLicense = val.simLic;}})

我还写了一个数组,用于得到相对应的省市的简称,如下:

export const simpleLicense = [{ fullLic:'北京市', simLic:'京' },{ fullLic:'天津市', simLic:'津' },{ fullLic:'河北省', simLic:'冀' },{ fullLic:'山西省', simLic:'晋' },{ fullLic:'内蒙古自治区', simLic:'蒙' },{ fullLic:'辽宁省', simLic:'辽' },{ fullLic:'吉林省', simLic:'吉' },{ fullLic:'黑龙江省', simLic:'黑' },{ fullLic:'上海市', simLic:'沪' },{ fullLic:'江苏省', simLic:'苏' },{ fullLic:'浙江省', simLic:'浙' },{ fullLic:'安徽省', simLic:'皖' },{ fullLic:'福建省', simLic:'闽' },{ fullLic:'江西省', simLic:'赣' },{ fullLic:'山东省', simLic:'鲁' },{ fullLic:'河南省', simLic:'豫' },{ fullLic:'湖北省', simLic:'鄂' },{ fullLic:'湖南省', simLic:'湘' },{ fullLic:'广东省', simLic:'粤' },{ fullLic:'广西壮族自治区', simLic:'桂' },{ fullLic:'海南省', simLic:'琼' },{ fullLic:'重庆市', simLic:'渝' },{ fullLic:'四川省', simLic:'川' },{ fullLic:'贵州省', simLic:'贵' },{ fullLic:'云南省', simLic:'云' },{ fullLic:'西藏自治区', simLic:'藏' },{ fullLic:'陕西省', simLic:'陕' },{ fullLic:'甘肃省', simLic:'甘' },{ fullLic:'青海省', simLic:'青' },{ fullLic:'宁夏回族自治区', simLic:'宁' },{ fullLic:'新疆维吾尔自治区', simLic:'新' },
];

所以只要这两个API不停用,基本上OK的 , ^_^;

方法三:淘宝

// 淘宝API:
http://ip.taobao.com/service/getIpInfo.php?ip=IP

返回的是

我用方法一获取了一个IP给它用,返回的JSON结果也很详细,但是!!!我不会用T_T,哭泣。。。有一篇博客说它有缺点:有时候调用速度很快,但是有时候回超过30秒而导致服务器报错,终结页面的运行,我不造,反正我用不动!!!

方法四:太平洋API

没错,正如那篇博客写的,功能很强大!!!

// 太平洋APIhttp://whois.pconline.com.cn

访问如下:

但是,我也不造咋用,之前时间比较紧,就没研究了,,,勤快的小伙伴自己动手去研究一下呗,哈哈哈

后记:

因为我没有判断好第一种方法里的cname值,当定位不到的时候,好像是China啥的来着,但不是空,我就直接sessionStorage了,以至于后面判断的时候出错,这是我刚刚写以上博客的时候,才发现之前忽视的一个bug,导致有的手机在2/3/4G的情况下,定位失败,默认为“京”。

但是写这篇博客之前,我已经用了AMAP去获取经纬度定位,无论什么网络状况下,都会定位很准确,,哈哈哈哈,不想再改回去了,,我这是因为项目其他地方用了AMAP之前就引入的,我直接用了,,如果有的小伙伴没有引入AMAP的话,还是可以用第一种和第二种方法结合的,加油!!如果有大佬查漏补缺,指正错误就更好了,欢迎~

参考文章:

获取用户IP并查询所在地理位置(附几个第三方免费开放API)

第三方免费开放API 获取用户IP 并查询其地理位置相关推荐

  1. 百度地图JavaScript API获取用户当前经纬度和详细地理位置,反之通过详细地理位置获取当前经纬度...

    前言: 前段时间刚好使用了百度地图的js api定位获取用户当前经纬度并获取当前详细位置和通过当前用户详细地理位置换取用户当前经纬度坐标的功能,为了方便下次找起来方便一些自己在这里记录一下,希望也能够 ...

  2. 【vue】前端通过腾讯接口获取用户ip

    前言 之前在前端项目中获取用户ip的方式一直用的是搜狐的接口:http://pv.sohu.com/cityjson?ie=utf-8%22,同时这也是网上分享次数最多的接口,虽说提供的信息很少,但因 ...

  3. 使用淘宝IP库获取用户ip地理位置

    为什么80%的码农都做不了架构师?>>>    以前用过GOOGLE地图和百度地图获取过用户地理位置,现在又多了一个方法,那就是使用淘宝IP库获取用户ip地理位置,一起来看代码吧. ...

  4. 前端获取用户ip地址,并放在请求头上(uniapp和H5)

    今日需求: 获取用户ip地址,并在每一次请求的时候带上这个ip地址 1.如何获取用户IP地址: 获取 用户ip地址的方式有很多,各大地图的开发者平台都能找到相关的API接口地址,都很牛掰,但是我看了一 ...

  5. php获取用户ip地理位置利用淘宝IP库

    利用淘宝IP库获取用户ip地理位置 我们查ip的时候都是利用ip138查询的,不过那个有时候是不准确的,还不如自己引用淘宝的ip库来查询,这样准确度还高一些.不多说了,介绍一下: 淘宝IP地址库 淘宝 ...

  6. go 通过nginx代理后获取用户ip

    go 如果使用自己的服务器,可以直接使用 net/http 来获取 func ip(w http.ResponseWriter, r *http.Request) {fmt.Println(r.Rem ...

  7. 获取用户Ip地址通用方法常见安全隐患 x-forwarded-for

    分析过程 这个来自一些项目中,获取用户Ip,进行用户操作行为的记录,是常见并且经常使用的. 一般朋友,都会看到如下通用获取IP地址方法. function getIP() { if (isset($_ ...

  8. 【用jQuery来判断浏览器的类型】及【javascript获取用户ip地址】

    用jQuery来判断浏览器的类型,主要是使用$.browser这个工具类,使用方法: $.browser.['浏览器关键字'] //谷歌浏览器.360浏览器等其他一些浏览器,没有专门的判断 funct ...

  9. php与ie通信,php 获取用户IP与IE信息程序

    php 获取用户IP与IE信息程序 function onlineip() { global $_SERVER; if(getenv('HTTP_CLIENT_IP')) { $onlineip = ...

最新文章

  1. 单元、集成、系统、验收测试比较
  2. 2020年全国信息安全标准化技术委员会大数据安全标准特别工作组全体会议即将召开...
  3. 计算机组成与结 读写数据实验,计算机组成与结构实验报告现实版.doc
  4. php 字符串隔位取,PHP 字符串截取字符串函数
  5. Eclipse error: “The import XXX cannot be resolved”
  6. python归并排序理解不了_一日一技:如何更好地理解归并排序?
  7. rust windows 交叉编译_树莓派上使用rust:交叉编译
  8. 广告roi怎么计算公式_二类电商信息流广告投放注意这几方面
  9. hdu 2141 Can you find it(二分)
  10. 最详细的 Spring Boot 多模块开发与排坑指南
  11. docker镜像与容器概念
  12. SpeedTree学习笔记(转)
  13. nginx配置跨域对服务异常(包括404)时失效的解决
  14. Tensorflow实现Softmax回归
  15. C++读取图片二进制数据并保存
  16. Unity软件界面--Unity基本介绍
  17. linux中的man命令总结
  18. 数学在计算机科学中的作用,计算机科学中数学的重要性及其运用
  19. Vmware Esxi在线管理虚拟机
  20. 计算机硬盘显示隐藏,隐藏与显示硬盘盘符的最简单的方法

热门文章

  1. geometry-api-java 学习笔记(五)多边形 Polygons
  2. value toDF is not a member of org.apache.spark.rdd.RDD[People]
  3. node-red教程 7dashboard简介与输入型仪表板控件的使用
  4. python通过hive transform处理数据
  5. webdriver 执行完毕关闭chromedriver进程
  6. 设计模式 | 适配器模式及典型应用
  7. 解决 nfs挂载错误wrong fs type, bad option, bad superblock
  8. js操作样式自动prefix
  9. java提高篇(四)---LinkedList
  10. .NET开发Windows Service程序 - Topshelf