首页 > 其他分享 >js根据地区判断进行跳转页面

js根据地区判断进行跳转页面

时间:2024-01-26 09:45:45浏览次数:42  
标签:function city const ip js xhr 跳转 new 页面

 <script>
    // 获取访问者的 IP 地址
function getVisitorIP() {
    return new Promise((resolve, reject) => {
        const xhr = new XMLHttpRequest();
        xhr.open('GET', 'https://ipinfo.io/json', true);
        xhr.onload = function () {
            if (xhr.status >= 200 && xhr.status < 300) {
                const responseData = JSON.parse(xhr.responseText);
                const ip = responseData.ip;
                resolve(ip);
            } else {
                reject(new Error('Failed to fetch IP address.'));
            }
        };
        xhr.onerror = function () {
            reject(new Error('Network error while fetching IP address.'));
        };
        xhr.send();
    });
}

// 根据 IP 地址获取城市信息
function getCityFromIP(ip) {
    return new Promise((resolve, reject) => {
        const xhr = new XMLHttpRequest();
        xhr.open('GET', `https://ipapi.co/${ip}/json/`, true);
        xhr.onload = function () {
            if (xhr.status >= 200 && xhr.status < 300) {
                const responseData = JSON.parse(xhr.responseText);
                const city = responseData.city;
                resolve(city);
            } else {
                reject(new Error('Failed to fetch city information.'));
            }
        };
        xhr.onerror = function () {
            reject(new Error('Network error while fetching city information.'));
        };
        xhr.send();
    });
}

// 判断是否是北上广深长沙
function isTargetCity(city) {
       const targetCities = ['北京', '上海', '广州', '深圳'];
    return targetCities.includes(city);
}

// 跳转逻辑
function redirectToBaidu() {
    window.location.href = 'https://4399.com/';
}


// 主逻辑:获取 IP 地址,然后根据 IP 地址获取城市信息,最后判断是否是目标城市
function checkCityAndRedirect() {
    getVisitorIP()
        .then((ip) => getCityFromIP(ip))
        .then((city) => {
            console.log('Visitor city:', city);

            if (isTargetCity(city)) {
                redirectToBaidu();
            } else {
                console.log('Not in target cities.');
            }
        })
        .catch((error) => {
            console.error('Error:', error.message);
        });
}

// 在页面加载完成后执行逻辑
window.onload = function () {
    checkCityAndRedirect();
};

</script>

  

标签:function,city,const,ip,js,xhr,跳转,new,页面
From: https://www.cnblogs.com/68xi/p/17988646

相关文章

  • vue实现将word转换为HTML页面,并实现类似word的目录导航和关键字搜索跳转
    <template>  <divclass="content">    <divclass="header">      <divclass="title">        XXXXXX      </div>      <divclass="search">   ......
  • Vue中JSON文件神奇应用fetch、axios异步加载与模块导入全指南
     在Vue中使用JSON文件有多种方式,包括使用fetch方法加载JSON文件、使用axios库加载JSON文件,以及将JSON文件导入为模块。以下是详细描述和相应的示例代码:1.使用fetch方法加载JSON文件:步骤:创建一个JSON文件,例如 data.json://data.json{"name":"John","age":......
  • HTTP 请求体编码用 json 还是 x-www-form-urlencoded
    application/x-www-form-urlencodedapplication/jsonapplication/json对初学者友好application/x-www-form-urlencoded对Postman友好axios和superagent默认使用JSONbody来自专家的建议TheStripeAPIisorganizedaroundREST.OurAPIhaspredictableresour......
  • js中数组反转的方法总结
    1.常用的方法reverse()[1,2,3,4].reverse()  //[4,3,2,1]2.采用for循环方式使用递减循环遍历的方式,将元素一次存入新的数组中,新数组就是反转后的新数组constdataRef=[1,2,3,4]constnewArr:any[]=[]for(leti=dataRef.length-1;i>=0;i--){ne......
  • JS中的箭头函数与this
    JS中的箭头函数与thisJavaScript在ES6语法中新增了箭头函数,相较于传统函数,箭头函数不仅更加简洁,而且在this方面进行了改进。this作为JavaScript中比较诡异的存在,许多文章对于this的解释也不尽相同,本篇文章试图厘清JS中函数与this的关系。一、JS中函数的写法1.常规函数的写法......
  • js位置尺寸
    元素.offsetParent获取父级元素元素尺寸偏移尺寸.offsetHeight;高度(加上边框和可见的水平滚动条),只读.offsetWidth;宽带(同上),只读客户端尺寸.clientHeight;高度(不含边框滚动条),只读.clientWidth;宽度(同上),只读另一种方法.ge......
  • js事件处理
    事件监听letdid=document.getElementById("div-id");监听函数Dom0方式did.onclick=function(e){};Dom2方式did.addEventListener("click",(e)=>{});元素.addEventListener("事件类型",处理函数,处理阶段bool);//处理函数可传入一个唯一的参数事件对象//处理阶段,......
  • vue print.js 打印 此处打印不包含页面的页码 (打印方法二)
    <template><divclass="modalContainerprintAsset"ref="modalContainer"><divv-for="(items,index)intableDataPrint":key=indexstyle="page-break-after:always;zoom:1"ref="show......
  • C# Json序列化方案选择
    在C#中,进行JSON序列化和反序列化有多种方案可供选择,常用的是下面俩个System.Text.Json:这是.NETCore和.NET5中内置的JSON序列化和反序列化库,提供了高性能和低内存消耗的JSON处理能力。Newtonsoft.Json:这是一个流行的第三方JSON处理库,广泛用于Framework中的JSON序列化和反序列化......
  • nginx 如何强制跳转 https
    本项目nginx作为代理服务项目上线,客户说要加个安全证书,于是安全证书是加上了,可是htttp和https都能访问网站,客户要求不行必须强制用带有https的地址访问开整这是http和https都能访问的nginx.conf 关键配置  server{listen80;lis......