首页 > 其他分享 >前端直接获取用户IP的方法

前端直接获取用户IP的方法

时间:2023-05-18 20:11:56浏览次数:29  
标签:ipJson console ipify IP 前端 获取

前端直接获取用户IP的方法

简单来说就是使用两个接口
一个是太平洋网
<script src="//whois.pconline.com.cn/ipJson.jsp?callback=ipJson" type="text/javascript"></script> <script>
一个是ipify
<script type="application/javascript" src="https://api.ipify.org?format=jsonp&callback=getIP"></script>
很多方法都因为浏览器的升级导致获取不到,搜狐的经常是127.0.0.1,就不使用了

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
    <body>        
        <!-- <script src="//whois.pconline.com.cn/ipJson.jsp?callback=ipJson" type="text/javascript"></script>
        <script>
           function ipJson(ipJson) {
             console.log('获取到的网络IP',ipJson);
             //可以把结果存在window上,方便调用
             //window.ipJson=ipJson;
           }
         </script> -->
         <script type="application/javascript">
            function getIP(json) {
              console.log('ipify获取到的网络IP',json.ip);
            }
          </script>
         
          <script type="application/javascript" src="https://api.ipify.org?format=jsonp&callback=getIP"></script>

       </body>
</html>

标签:ipJson,console,ipify,IP,前端,获取
From: https://www.cnblogs.com/jokingremarks/p/17413154.html

相关文章

  • 一文搞定Jenkins Pipeline语法
    作者ZHDYA,曾运营“云原生个锤子”达3000+人,专注免费分享一些DEVOPS/运维/自动化/K8S生态方面的实战技巧,我们一起前行学习!最近更新主要围绕:Kubernetes、持久化存储、Helm、CICD、Ingress-nginx、监控告警、应用可观察性等相关文章。JenkinsPipeline语法作为一种流行的持续集......
  • 折线图 最大值显示白点,默认显示tooltip框框,自定义tooltip
    效果图: 代码如下:(直接放整个vue文件了,省事)<template><div><divstyle="width:406px;height:220px"id="zz_r_two1"></div><divclass="xsTitle"><divclass="fang"></div>......
  • 前端换肤,聊一聊主题切换那些事
    一些网站通常会提供白天、夜间模式,以及自定义主题等等,这种主题切换也就是本文说的前端换肤。这次案例用的是白天和夜间模式的切换,在做换肤之前,得先知道一件事情:css的变量定义,对变量定义不熟悉的同学请看MDN文档:自定义属性(--*):CSS变量主题切换也就是样式的切换,白天和黑夜的模式切......
  • Javascript 常见的循环方式总结
    本文地址:https://www.cnblogs.com/zichliang/p/17412968.html在Javascript中有很多种循环方式。有多种循环方式可以用来遍历数组、对象、以及执行一些重复性任务但是有很多方式甚至从未用过,所以简单来总结一下JS中的循环for循环for循环是在您希望创建循环时经常使用的工具。......
  • 亚马逊AMAZON中国站API详情接口获取商品详情接口
       亚马逊中国站是亚马逊在中国开设的在线购物平台,提供包括图书、电子产品、家居生活、服饰鞋包等各类品类的商品。亚马逊为了满足中国消费者的需求,特别推出了全球购和自营模式两种购物方式,全球购支持跨境购物,自营模式则是由亚马逊直接发货并提供售后服务。同时,亚马逊还提......
  • Apipost Error: Invalid URI "http:///%20"
    1.情景展示使用Apipost调接口时,出现如上图所示的错误。2.具体分析去他们官网,帮助文档,连个搜索功能都没有,也是服了。说明这个请求地址有问题,但实际我把请求地址放到浏览器当中是可以正常访问的。3.解决方案百思不得其解。最后,发现:原来,是自己在复制URL的时候,前面多了一个......
  • 资源文件:获取 EXE、DLL 或 ICO 文件中的图标
    //声明:ExtractIcon( hInst:HINST;     {调用函数的程序实例} lpszExeFileName:PChar;{文件路径;文件可以是*.exe、*.dll、*.ico} nIconIndex:UINT    {图标索引}):HICON;{返回图标句柄;索引为0时返回第一个图标句柄;索引为#FFFFFFFF......
  • ASEMI代理Infineon英飞凌IPB60R099CP原厂MOS管
    编辑-ZIPB60R099CP参数描述:型号:IPB60R099CP持续漏极电流:31A脉冲漏极电流:93A雪崩电流,重复:11A栅极-源极电压:±20V功率耗散:255W操作和储存温度:-55to150℃连续二极管正向电流:18A二极管脉冲电流:93A漏源击穿电压:600V栅极阈值电压:3V零栅极电压漏极电流:5µA栅极-源极泄漏......
  • IPB60R950C6-ASEMI代理英飞凌IPB60R950C6功率晶体管介绍
    编辑-ZIPB60R950C6是一款高性能的功率晶体管,它采用了最新的MOSFET技术,具有低导通电阻、高开关速度和低开关损耗等优点,适用于高效率的开关电源和逆变器等应用。本文将从其特点、应用、参数和优势四个方面进行详细阐述。 1、特点IPB60R950C6具有低导通电阻、高开关速度、低输入......
  • “前端”工匠系列(二):合格的工匠,怎么做好价值落地
    一、"技术鄙视链?"如果你是一个技术人,相信都知道技术圈有个相互的鄙视链,这个链条从技术人自己认知的角度在以业务价值为中心嵌套的一层一层的环,就像洋葱,具体的描述这里不赘述了。出门左拐随便抓住一个人问一下。这种偏自嘲类的观点,有点类似"程序员的穿着必须是格子衫"、"你们只会......