外贸独立站建设时,判断用户是中国还是国外,网站跳转到不同的链接
时间:2026-10-29 访问量:1005
给客户做了一个外贸网站,他想让中国用户自动访问中文版,外国用户自动访问英文版。
一开始我想用判断IP来是否为中国来实现跳转,但是后来发现每次要判断IP有点麻烦。
于是我上网查找到可以通过判断用户的浏览器所使用的语言来进行判断。
<script type="text/javascript">
var lang = (navigator.systemLanguage?navigator.systemLanguage:navigator.language);
//获取浏览器配置语言 #括号内是个运算,运算过后赋值给lang,当?前的内容为true时把?后的值赋给lang,为False时把:后的值赋给lang
var lang = lang.substr(0, 2);//获取lang字符串的前两位
if(lang == 'zh'){
location.href = "中文版";
}else{
location.href = "英文版";
};
</script>仅作一下记录,下次再遇到可直接COPY。
高级进阶版详细方案如下:
方案一:通过IP来判断是否为中国大陆,香港,台湾,澳门,如果是,显示中文,如果不是,跳转到英文。
<script type="text/javascript">
(function() {
// 1. 通行证检查:如果用户手动切换过,或者本地有语言缓存,直接放行
var urlParams = new URLSearchParams(window.location.search);
if (urlParams.get('lang') === 'zh' || localStorage.getItem('user_lang') === 'zh') {
localStorage.setItem('user_lang', 'zh');
return;
}
// 2. 限制场景:只在根首页执行判断,防止子页面死循环
if (window.location.pathname !== '/') return;
function redirectToEnglish() {
window.location.href = "https://www.hbxty.com/en/";
}
// 3. 请求接口进行判断
// 优先使用:ipwho.is(完美支持 HTTPS)
fetch('https://ipwho.is/')
.then(function(res) { return res.json(); })
.then(function(data) {
if (data && data.country_code) {
var code = data.country_code.toUpperCase();
// 【全面排除圈】:大陆(CN)、香港(HK)、澳门(MO)、台湾(TW)
// 只有不属于这四个地区时,才跳转到英文版
if (code !== 'CN' && code !== 'HK' && code !== 'MO' && code !== 'TW') {
redirectToEnglish();
}
}
})
.catch(function() {
// 备用方案:当海外接口偶发性连接失败时,调用国内老牌搜狐接口保底
var script = document.createElement('script');
script.src = 'https://pv.sohu.com/cityjson?ie=utf-8';
script.onload = function() {
if (window.returnCitySN && window.returnCitySN.cname) {
var area = window.returnCitySN.cname;
// 【全面中文文本过滤】:确保所有大中华区的命名写法都不会误跳英文
if (area.indexOf('中国') === -1 &&
area.indexOf('省') === -1 &&
area.indexOf('市') === -1 &&
area.indexOf('自治区') === -1 &&
area.indexOf('香港') === -1 &&
area.indexOf('澳门') === -1 &&
area.indexOf('台湾') === -1 &&
area.indexOf('台北') === -1 &&
area.indexOf('特别行政区') === -1) {
redirectToEnglish();
}
}
};
document.head.appendChild(script);
});
})();
</script>方案二:上最上面一样,判断浏览器语言版本。
中文版首页添加:
<script type="text/javascript">
(function() {
// 1. 获取浏览器语言
var userLang = (navigator.language || navigator.userLanguage).toLowerCase();
// 2. 获取当前网址的查询参数(?后面的内容)
var urlParams = new URLSearchParams(window.location.search);
var langParam = urlParams.get('lang'); // 获取 lang 参数的值
// 3. 核心判断逻辑:
// 如果【不是中文浏览器】
// 并且【当前是根首页】
// 并且【网址里没有这个通行证】
if (!userLang.startsWith('zh') && window.location.pathname === '/' && langParam !== 'zh') {
// 强行跳转到英文版
window.location.href = "你的域名/en/";
}
})();
</script>
英文版首页添加:
<script type="text/javascript">
(function() {
// 1. 获取浏览器语言
var userLang = (navigator.language || navigator.userLanguage).toLowerCase();
// 2. 获取当前网址的查询参数
var urlParams = new URLSearchParams(window.location.search);
var langParam = urlParams.get('lang'); // 获取 lang 参数的值
// 3. 核心判断逻辑:
// 如果【是中文浏览器】(以 zh 开头)
// 并且【网址里没有 这个英文通行证】
if (userLang.startsWith('zh') && langParam !== 'en') {
// 自动跳转到中文首页
window.location.href = "你的域名/";
}
})();
</script>然后需要在网站的切换按钮上:如中文版,英文版的按钮上,添加上参数:
<a href="域名/?lang=zh" target="_blank" class="colorfff mr-3 ">中文版</a> <a href="域名/en/?lang=en" target="_blank" class="colorfff mr-0 mr-sm-5">English</a>
正在加载评论…