用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 相关文章推荐
基于jQuery的倒计时插件代码
May 07 Javascript
jquery延迟加载外部js实现代码
Jan 11 Javascript
jquery给图片添加鼠标经过时的边框效果
Nov 12 Javascript
jQuery的each终止或跳过示例代码
Dec 12 Javascript
Vue.js第三天学习笔记(计算属性computed)
Dec 01 Javascript
input输入密码变黑点密文的实现方法
Jan 09 Javascript
详解vue-cli 脚手架项目-package.json
Jul 04 Javascript
jQuery md5加密插件jQuery.md5.js用法示例
Aug 24 jQuery
Angular PWA使用的Demo示例
Jan 31 Javascript
用js限制网页只在微信浏览器中打开(或者只能手机端访问)
Dec 24 Javascript
用云开发Cloudbase实现小程序多图片内容安全监测的代码详解
Jun 07 Javascript
Vue全局事件总线你了解吗
Feb 24 Vue.js
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
Ajax实现对静态页面的文章访问统计功能示例
2016/10/10 PHP
php传值方式和ajax的验证功能
2017/03/27 PHP
在Laravel5中正确设置文件权限的方法
2019/05/22 PHP
详解JavaScript基于面向对象之创建对象(2)
2015/12/10 Javascript
微信公众号 客服接口的开发实例详解
2016/09/28 Javascript
angularjs 实现带查找筛选功能的select下拉框实例
2017/01/11 Javascript
bootstrap+jQuery实现的动态进度条功能示例
2017/05/25 jQuery
Windows安装Node.js报错:2503、2502的解决方法
2017/10/25 Javascript
jquery.picsign图片标注组件实例详解
2018/02/02 jQuery
详解Webpack + ES6 最新环境搭建与配置
2018/06/04 Javascript
在Vue中使用icon 字体图标的方法
2019/06/14 Javascript
javascript实现导航栏分页效果
2019/06/27 Javascript
JS数组方法slice()用法实例分析
2020/01/18 Javascript
如何基于js判断浏览器版本
2020/02/20 Javascript
JS数组方法reduce的用法实例分析
2020/03/03 Javascript
Vue 使用iframe引用html页面实现vue和html页面方法的调用操作
2020/11/16 Javascript
[01:04:48]VGJ.S vs TNC Supermajor 败者组 BO3 第一场 6.6
2018/06/07 DOTA
Python 列表(List)操作方法详解
2014/03/11 Python
python3中dict(字典)的使用方法示例
2017/03/22 Python
Python中列表list以及list与数组array的相互转换实现方法
2017/09/22 Python
Python机器学习算法之k均值聚类(k-means)
2018/02/23 Python
Python生成任意范围任意精度的随机数方法
2018/04/09 Python
Python中循环引用(import)失败的解决方法
2018/04/22 Python
详解Python3.6的py文件打包生成exe
2018/07/13 Python
使用Py2Exe for Python3创建自己的exe程序示例
2018/10/31 Python
对python操作kafka写入json数据的简单demo分享
2018/12/27 Python
详解python 3.6 安装json 模块(simplejson)
2019/04/02 Python
Python中函数参数匹配模型详解
2019/06/09 Python
python-tkinter之按钮的使用,开关方法
2019/06/11 Python
python从zip中删除指定后缀文件(推荐)
2019/12/05 Python
使用pth文件添加Python环境变量方式
2020/05/26 Python
四风存在的原因分析
2014/02/11 职场文书
有趣的广告词
2014/03/18 职场文书
如何撰写一封出色的求职信
2014/04/27 职场文书
2015年六一儿童节活动方案
2015/05/05 职场文书
Typescript类型系统FLOW静态检查基本规范
2022/05/25 Javascript