用js限制网页只在微信浏览器中打开(或者只能手机端访问)


Posted in Javascript onDecember 24, 2020

用js限制网页只在微信浏览器中打开

js代码一

$(function(){
	//判断页面是否是在微信浏览器打开
	//对浏览器的UserAgent进行正则匹配,不含有微信独有标识的则为其他浏览器
 var useragent = navigator.userAgent;
 if (useragent.match(/MicroMessenger/i) != 'MicroMessenger') {
  window.location.href = "wxError.html";//若不是微信浏览器,跳转到温馨error页面
 }
})

代码二 写成函数方便引用

/**
   * 判断是否是微信环境
   */
  function getIsWxClient () {
    var ua = navigator.userAgent.toLowerCase();
    if (ua.match(/MicroMessenger/i) == "micromessenger") {
      return true;
    }
    return false;
  };

代码三 微信自己写的的代码

window.isInWeixinApp = function() {
    return /MicroMessenger/.test(navigator.userAgent);
  };

页面

<!DOCTYPE html>
<html>
 <head>
 	<meta charset="utf-8">
 	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
 </head>
 <body>
  <script type="text/javascript">
   var ua = navigator.userAgent.toLowerCase();
   var isWeixin = ua.indexOf('micromessenger') != -1;
   var isAndroid = ua.indexOf('android') != -1;
   var isIos = (ua.indexOf('iphone') != -1) || (ua.indexOf('ipad') != -1);
   if (!isWeixin) {
    document.head.innerHTML = '<title>抱歉,出错了</title><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0"><link rel="stylesheet" type="text/css" href="https://res.wx.qq.com/open/libs/weui/0.4.1/weui.css" rel="external nofollow" >';
    document.body.innerHTML = '<div class="weui_msg"><div class="weui_icon_area"><i class="weui_icon_info weui_icon_msg"></i></div><div class="weui_text_area"><h4 class="weui_msg_title">请在微信客户端打开链接</h4></div></div>';
   }
  </script>
 </body>
</html>

一般情况下限制页面被pc端访问就可以了,那么就可以参考下面的代码了

在需要被pc端访问的页面的脚本里加上如下代码即可:

<script>
var system = {};
var p = navigator.platform;
var u = navigator.userAgent;

system.win = p.indexOf("Win") == 0;
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) { //win手机端

} else {


window.location.href = "提示页面路径";

}
}

</script>

再附一个各大网站常用的代码

var browser = {
	versions : function () {
		var u = navigator.userAgent,
		app = navigator.appVersion;
		return {
			trident : u.indexOf('Trident') > -1,
			presto : u.indexOf('Presto') > -1,
			webKit : u.indexOf('AppleWebKit') > -1,
			gecko : u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1,
			mobile : !!u.match(/AppleWebKit.*Mobile.*/) || !!u.match(/AppleWebKit/),
			ios : !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),
			android : u.indexOf('Android') > -1 || u.indexOf('Linux') > -1,
			iPhone : u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1,
			iPad : u.indexOf('iPad') > -1,
			webApp : u.indexOf('Safari') == -1,
			QQbrw : u.indexOf('MQQBrowser') > -1,
			UCbrw : u.indexOf('UCBrowser') > -1,
			weiXin : u.indexOf('MicroMessenger') > -1,
			ucLowEnd : u.indexOf('UCWEB7.') > -1,
			ucSpecial : u.indexOf('rv:1.2.3.4') > -1,
			
			ucweb : function () {
				try {
					return parseFloat(u.match(/ucweb\d+\.\d+/gi).toString().match(/\d+\.\d+/).toString()) >= 8.2
				} catch (e) {
					if (u.indexOf('UC') > -1) {
						return true;
					} else {
						return false;
					}
				}
			}
			(),
			Symbian : u.indexOf('Symbian') > -1,
			ucSB : u.indexOf('Firefox/1.') > -1
		};
	}
	()
}

到这里就完美了,三水点靠木小编专门从电影网站扒的代码。

Javascript 相关文章推荐
简单JS代码压缩器
Oct 12 Javascript
在图片上显示左右箭头类似翻页的代码
Mar 04 Javascript
有关于JS辅助函数inherit()的问题
Apr 07 Javascript
从数组中随机取x条不重复数据的JS代码
Dec 24 Javascript
利用js实现在浏览器状态栏显示访问者在本页停留的时间
Dec 29 Javascript
js交换排序 冒泡排序算法(Javascript版)
Oct 04 Javascript
jquery中EasyUI实现同步树
Mar 01 Javascript
JS实现环形进度条(从0到100%)效果
Jul 05 Javascript
javascript常用的设计模式
Feb 09 Javascript
JS中去掉array中重复元素的方法
May 26 Javascript
微信小程序tab切换可滑动切换导航栏跟随滚动实现代码
Sep 04 Javascript
JS如何生成动态列表
Sep 22 Javascript
vue引用外部JS的两种种方法
Jan 28 #Javascript
Java Varargs 可变参数用法详解
Jan 28 #Javascript
关于引入vue.js 文件的知识点总结
Jan 28 #Javascript
JS简单表单验证功能完整示例
Jan 26 #Javascript
JS实现的定时器展示简单秒表、页面弹框及跳转操作完整示例
Jan 26 #Javascript
js常用方法、检查是否有特殊字符串、倒序截取字符串操作完整示例
Jan 26 #Javascript
vue跳转方式(打开新页面)及传参操作示例
Jan 26 #Javascript
You might like
深入分析php之面向对象
2013/05/15 PHP
简单的php中文转拼音的实现代码
2014/02/11 PHP
深入浅析PHP7.0新特征(五大新特征)
2015/10/29 PHP
两种php实现图片上传的方法
2016/01/22 PHP
神奇的代码 通杀各种网站-可随意修改复制页面内容
2008/07/17 Javascript
jQuery学习笔记之jQuery的动画
2010/12/22 Javascript
Array的push与unshift方法性能比较分析
2011/03/05 Javascript
深入理解JavaScript系列(7) S.O.L.I.D五大原则之开闭原则OCP
2012/01/15 Javascript
关于js new Date() 出现NaN 的分析
2012/10/23 Javascript
javascript简单事件处理和with用法介绍
2013/09/16 Javascript
什么是 AngularJS?AngularJS简介
2014/12/06 Javascript
js实现网页多级级联菜单代码
2015/08/20 Javascript
angularjs表格分页功能详解
2016/01/21 Javascript
javascript简单判断输入内容是否合法的方法
2016/05/11 Javascript
深入理解JavaScript中Ajax
2016/08/02 Javascript
seajs学习教程之基础篇
2016/10/20 Javascript
Vue.js学习之过滤器详解
2017/01/22 Javascript
ajax+node+request爬取网络图片的实例(宅男福利)
2017/08/28 Javascript
原生JS实现移动端web轮播图详解(结合Tween算法造轮子)
2017/09/10 Javascript
js实现前面自动补全位数的方法
2018/10/10 Javascript
ES6 let和const定义变量与常量的应用实例分析
2019/06/27 Javascript
js实现小星星游戏
2020/03/23 Javascript
js实现飞机大战游戏
2020/08/26 Javascript
[44:50]2018DOTA2亚洲邀请赛 4.1 小组赛 A组 TNC vs VG
2018/04/02 DOTA
浅谈Python peewee 使用经验
2017/10/20 Python
pytorch中nn.Conv1d的用法详解
2019/12/31 Python
简洁自适应404页面HTML好看的404源码
2020/12/16 HTML / CSS
微软俄罗斯官方网站:Microsoft俄罗斯
2016/09/18 全球购物
美国专业汽车音响和移动电子产品零售商:Car Toys
2019/05/13 全球购物
如何实现一个自定义类的序列化
2012/05/22 面试题
商业项目策划方案
2014/06/05 职场文书
小学生志愿者活动方案
2014/08/23 职场文书
2015年敬老月活动总结
2015/03/27 职场文书
2016年感恩节寄语
2015/12/07 职场文书
机关干部作风整顿心得体会
2016/01/22 职场文书
如何解决php-fpm启动不了问题
2021/11/17 PHP