Javascript前端控制只能在手機微信端訪問頁面

最近接到一個只能在手機微信端訪問頁面的需求,限於不能跟微信做交互,所以用js來獲取設備信息,前端校驗鎖死。
關鍵點:
PC F12被禁用
PC backspace被禁用
//ios終端 禁止ios10以下
加在頁面先校驗,若不通過則window.stop();停止一切代碼加載,也防止了加載無用數據

js代碼


```javascript
var str = "本頁面禁止PC端使用,請在手機微信客戶端操作。感謝您的配合!";
function checkPlatform(){
  //禁止網站F12
  document.onkeydown = function(){
    if(window.event && window.event.keyCode == 123) {
      alert("F12被禁用");
      event.keyCode=0;
      event.returnValue=false;
    }
    if(window.event && window.event.keyCode == 13) {
      window.event.keyCode = 505;
    }
    if(window.event && window.event.keyCode == 8) {
      alert(str+"\n請使用Del鍵進行字符的刪除操作!");
      window.event.returnValue=false;
    }
  }
  var u = navigator.userAgent;
  //ios終端
  var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
  //android終端
  var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; 

  if(/MicroMessenger/i.test(navigator.userAgent)){
    var is_mobi = navigator.userAgent.toLowerCase().match(/(ipod|ipad|iphone|android|coolpad|mmp|smartphone|midp|wap|xoom|symbian|j2me|blackberry|wince)/i) != null;
    if (is_mobi) {
      if(isiOS){
        //判斷是不是ios10系統
        var ver = (navigator.appVersion).match(/OS (\d+)_(\d+)_?(\d+)?/);
        ver = parseInt(ver[1], 10);
        if(ver<10) {
          str = '您當前手機的系統版本不支持,請在IOS10及以上版本操作';
          showforbidpage();
        } else {
          //可以繼續操作
        }
      }
    }else{
      str = '請在手機微信客戶端打開鏈接';
      showforbidpage();
    }
  }else {
    str = '請在手機微信客戶端打開鏈接';
    showforbidpage();s
  }
}
function showforbidpage(){
  window.stop();
  var img = '<img style="width:100px; height:100px" src="http://l087-prod.oss-cn-szfinance.aliyuncs.com/lmes_new/dev/h5_image/chahao.png">';
  var div = '<div><div style="padding-top: 20px;text-align: center;">'+img+'</div><div style="padding-top: 20px;text-align: center;"><h4>'+str+'</h4></div></div>';
  $("body").html(div);
}

$(document).ready(function(){
  checkPlatform();
});
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章