uniapp制作的h5页面如何获取客户端的ip地址

先说解决方式

在要试用的vue文件中

sessionStorage.getItem('ip')//获取客户端的ip地址

本地未打包时是无法获得ip地址的，得打包生成H5项目发布时，sessionStorage.getItem(‘ip’)才有值。

打包步骤，

1，发行
2，网站-PC WEB或手机H5（仅适用于uniapp）；
3，打开项目所属下的unpackage\dist\build\h5路径

4，修改index.html的内容

 <script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>
 <script type="text/javascript">
        sessionStorage.setItem('ip', returnCitySN["cip"])
 </script>

发布到线上，能正常获得ip地址


这就完成了对uniapp制作的h5页面ip的获取了。

思路历程

uniapp自身有获取ip地址的方法

uni.request({
					url: 'http://pv.sohu.com/cityjson?ie=utf-8',
					method: 'POST',
					success: res => {
						const reg = /\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}/;
						let ip = reg.exec(res.data);
						_this.ip = ip[0];
						console.log(ip[0]);
					}
				});

app端使用这个方法能直接获得ip地址，但是uniapp-h5项目会报跨域问题，这个跨域问题不管是代理还是发布到服务器都是无法解决的，思来想去，看到了这个方法，分享给大家，希望对大家有所帮助