天天看点

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

今天给大家来点干货!

完整需求:根据用户所在地的不同,网站自动切换最适合用户的语言

解析需求:

1、我们需要根据ip获取用户所在地,其中获取IP具体有三种方法:

(1)、在项目中引入搜狐这个组件库

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

然后在js代码中,通过 window.returnCitySN.cip 就可以获取到用户主机的ip地址了

(2)、手动查看用户IP

同时按下键盘window图标+R,打开命令行

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

接着输入cmd,按下回车键,出现黑色界面,输入ipconfig,如图:

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

继续按下回车,出现各种ip相关信息,找到IPV4地址,后面的ip就是你的主机ip,也就是你这个用户的ip,如图

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

(3)、根据域名来获取ip信息

以方式(2)中的操作,打开黑色命令行,输入nslookup 域名,即可出现该域名对应的ip信息,如图输入百度的域名,里面的非权威应答的信息就是百度这个域名对应的ip信息,里面的localhost对应的ip就是当前用户的ip

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

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或者自动识别当前用户所在国家、地区、城市

【注】在你访问这个接口的时候,如果没有任何配置,会因为同源策略而无法正常显示数据,所以此时就需要你解决同源策略的影响,进行跨域访问。

我之后会更新一篇博客,为大家讲解详细的前端跨域的配置;

3、确定用户所在地区之后,就进行语言切换吧!