JS前端获取用户的ip地址的方法

时间:2024-03-10 10:34:24

网址:


案例一[使用的第一个网址]

[此案例没有返回用户网络是哪家运营商的]

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>

	<body>

		<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script> 
		<script> 
		      document.write(returnCitySN["cip"]+\',\'+returnCitySN["cname"]) 
		</script>
	</body>
</html>

结果:
在这里插入图片描述

案例二[使用的第二个网址]

[此案例请求会跨域,下面会有解决跨域的方法]

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
		<script> 
		      $(() => {
		      	$.ajax({
		      		type:"get",
		      		url:"http://ip.chinaz.com/getip.aspx",
		      		async:true,
		      		/*使用jsonp解决跨域请求*/
		      		dataType: "jsonp",
		      		jsonp: "callback",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(一般默认为:callback)
		      		//jsonpCallback:"?",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,也可以写"?",jQuery会自动为你处理数据
		      		success:(data)=>{
		      			console.log(data)
		      		}
		      	});
		      });
		</script>
	</body>
</html>

结果:
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-0R1z1ZB4-1585062162420)(5E8B420E9CC54395BF26D4954FE9759E)]


上面解决跨域请求参考的这篇文章 :