zoukankan      html  css  js  c++  java
  • js的屏蔽地区和屏蔽pc端的方法

    其实不需要后台代码也可以获取地区信息的,就算是后台代码,也得需要引用一些第三方库提供免费的api接口才可以,最后还是反序列化才能得到想要的数据,那干嘛不直接找,提供好json格式的api接口,拿来js就直接用呢?

    我最开始了解到一些大型网站提供ip库应该是属淘宝ip最全面了吧;确实挺全的 不过缺点是 短时间内同一ip不能访问频率过快,还有就是ajax不能直接获取他的数据,必须通过后端代码来实现.

    因此,我在网上找到了下面这个接口 感觉挺好用的,分享给你们。

    直接通过异步访问,不需要后端代码就可以获取地址详细信息,很全面,感觉比淘宝ip库还全面。

    //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

    <script type="text/javascript" src="php高级/jquery-3.4.1.min.js"></script>

    <!--搜狐ip库:http://pv.sohu.com/cityjson(默认GBK编码,修改编码加参数 ?ie=utf-8)-->
    <script type="text/javascript" src="http://pv.sohu.com/cityjson"></script>
    <script type="text/javascript">
    $(function(){
      var ip = returnCitySN.cip;
      console.log("通过搜狗ip库得到当前ip为:"+ip);

      $.get("http://api.online-service.vip/ip3?ip="+ip,function(e){
        console.log(e); //打印日志信息。根据日志信息获取自己需要的字段
        alert('你当前ip为:'+ip+';所属国家:'+e.data.country+';省:'+e.data.province+';市:'+e.data.city);
      })

    //第二种:下面这条api接口通过的信息就比较全面了,感觉比淘宝的还要好用得多
      $.ajax({
        url:"http://api.online-service.vip/ip?ip=" + ip ,
        type:'GET',
        dataType:'JSON', // 处理Ajax跨域问题
        success: function(e){
          console.log(e); //打印日志信息。根据日志信息获取自己需要的字段
          alert(e.city.geoname_id);
        }
      });
    });
    </script>

    ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

    以上代码仅写在html页面即可!常用来屏蔽一些地区,限制用户访问,判断没有写,数据都得到了,判断语句自己写很简单的了。

    ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

    <script>
    /** 屏蔽鼠标右键 */
    document.oncontextmenu = function(){return false;}


    /** 屏蔽f12 */
    document.onkeydown=function (e){
      var currKey=0;
      var evt = e||window.event;//获取event对象
      //获取事件源 :keyCode键盘按键Unicode码,于浏览器兼容问题给3种选择,
      currKey=evt.keyCode||evt.which||evt.charCode;//如:keyCode无法在火狐浏览器用,which就可以
      if (currKey == 123) {//keycode >=112 && keycode <=123 屏蔽f1-f12功能键 (keycode ==8)屏蔽退格健
        window.event.cancelBubble = true;//用来阻止浏览器默认的事件冒泡行为
        window.event.returnValue = false;//禁止或取消了请求,不执行任何提交效果
      }
      $(".sp").html("你按下键盘的Unicode码为:"+currKey+",对应的字符是:"+String.fromCharCode(currKey));
    }
    </script>

    ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

    屏蔽手机端或者想屏蔽pc端:如下

    ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

    var system = {};
    var p = navigator.platform;//获取硬件设备
    var u = navigator.userAgent;//获取浏览器信息

    system.win = p.indexOf("Win") == 0;//win手机端
    system.mac = p.indexOf("Mac") == 0;//苹果手机
    system.x11 = (p == "X11") || (p.indexOf("Linux") == 0);
    if (system.win || system.mac || system.xll) {//如果是PC转
      if (u.indexOf('Windows Phone') > -1) {
        //屏蔽手机端
        alert("被屏蔽对象");
      }
    }

    我在网上找的上面这个效果不是很好 了解一下,使用下面的代码,

    <script>
        /** 
         * 移动端相关数据 =>> mobileUtil 对象
         * 是否是安卓  : isAndroid
         * 是否是IOS   : isIOS
         * 是否是移动端: isMobile
         * 设备平台    : platform [ ios 或 android ]
         * 事件类型    : tapEvent [ tapEvent 或 click ]
         * 系统版本号  : version [ 如: ios 9.1 或 andriod 6.0 ]
         * 是否支持 touch 事件: isSupportTouch
         */
        var mobileUtil = (function (window) {
            var UA = window.navigator.userAgent,
                isAndroid = /android|adr/gi.test(UA),
                isIOS = /iphone|ipod|ipad/gi.test(UA) && !isAndroid,
                isMobile = isAndroid || isIOS,
                platform = isIOS ? 'ios' : (isAndroid ? 'android' : 'default'),
                isSupportTouch = "ontouchend" in document ? true : false;
    
            var reg = isIOS ? (/os [\d._]*/gi) : (/android [\d._]*/gi),
                verinfo = UA.match(reg),
                version = (verinfo + "").replace(/[^0-9|_.]/ig, "").replace(/_/ig, ".");
    
            return {
                isIOS: isIOS,
                isAndroid: isAndroid,
                isMobile: isMobile,
                platform: platform,
                version: parseFloat(version),
                isSupportTouch: isSupportTouch,
                tapEvent: isMobile && isSupportTouch ? 'tapEvent' : 'click'
            };
        })(window);
    
        if(mobileUtil.isMobile){
        	alert("你当前属于手机端访问,是我要屏蔽的对象");
        };
    </script>
    

      

    ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

  • 相关阅读:
    set使用
    css盒子模型详解一
    列表页调用当前栏目的子类织梦标签
    织梦如何在导航栏下拉菜单中调用当前栏目子类
    HDU1812
    BZOJ1485: [HNOI2009]有趣的数列
    组合数学学习笔记
    Full_of_Boys训练2总结
    Full_of_Boys训练1总结
    FFT算法学习笔记
  • 原文地址:https://www.cnblogs.com/longxinyv/p/11581248.html
Copyright © 2011-2022 走看看