最近接到一個只能在手機微信端訪問頁面的需求,限於不能跟微信做交互,所以用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();
});