根据ip或者自动识别当前用户所在国家、地区、城市

今天给大家来点干货!
完整需求:根据用户所在地的不同,网站自动切换最适合用户的语言
解析需求:
1、我们需要根据ip获取用户所在地,其中获取IP具体有三种方法:
(1)、在项目中引入搜狐这个组件库
在这里插入图片描述
然后在js代码中,通过 window.returnCitySN.cip 就可以获取到用户主机的ip地址了
(2)、手动查看用户IP
同时按下键盘window图标+R,打开命令行根据ip或者自动识别当前用户所在国家、地区、城市_第1张图片
接着输入cmd,按下回车键,出现黑色界面,输入ipconfig,如图:
根据ip或者自动识别当前用户所在国家、地区、城市_第2张图片
继续按下回车,出现各种ip相关信息,找到IPV4地址,后面的ip就是你的主机ip,也就是你这个用户的ip,如图
根据ip或者自动识别当前用户所在国家、地区、城市_第3张图片
(3)、根据域名来获取ip信息
以方式(2)中的操作,打开黑色命令行,输入nslookup 域名,即可出现该域名对应的ip信息,如图输入百度的域名,里面的非权威应答的信息就是百度这个域名对应的ip信息,里面的localhost对应的ip就是当前用户的ip
根据ip或者自动识别当前用户所在国家、地区、城市_第4张图片
2、获取到用户ip之后,我们根据这个ip来获取其对应的国家,地区,城市等的信息
我们可以选用第三方接口来获取,在这里我提供俩个
(1)、http://ip.taobao.com/service/getIpInfo.php?ip=192.168.0.116
(2)、http://ip.ws.126.net/ipquery?ip=192.168.0.116
方法(1)(2)任选其一,将ip=后面的内容替换为用户的ip,即可查到用户对应的国家地区城市等信息
接1中获取ip的方法,我们将ip=后面替换为window.returnCitySN.cip,即可自动获取使用你网站的用户所在国家、地区、城市了
如图:
根据ip或者自动识别当前用户所在国家、地区、城市_第5张图片
【注】在你访问这个接口的时候,如果没有任何配置,会因为同源策略而无法正常显示数据,所以此时就需要你解决同源策略的影响,进行跨域访问。
我之后会更新一篇博客,为大家讲解详细的前端跨域的配置;
3、确定用户所在地区之后,就进行语言切换吧!

你可能感兴趣的:(web前端开发,ip识别用户地区)