用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 相关文章推荐
javascript中clipboardData对象用法详解
May 13 Javascript
JavaScript基于ajax编辑信息用法实例
Jul 15 Javascript
javascript实现数组中的内容随机输出
Aug 11 Javascript
关于js里的this关键字的理解
Aug 17 Javascript
基于replaceChild制作简单的吞噬特效
Sep 21 Javascript
jQuery实现花式轮播之圣诞节礼物传送效果
Dec 25 Javascript
ES6新特性:使用export和import实现模块化详解
Jul 31 Javascript
JS Input里添加小图标的两种方法
Nov 11 Javascript
Angular5集成eventbus的示例代码
Jul 19 Javascript
Vue 使用formData方式向后台发送数据的实现
Apr 14 Javascript
json_decode 索引为数字时自动排序问题解决方法
Mar 28 Javascript
使用JavaScript获取扫码枪扫描得到的条形码的思路代码详解
Jun 10 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制作文本式留言板
2015/03/18 PHP
php mailer类调用远程SMTP服务器发送邮件实现方法
2016/03/04 PHP
ThinkPHP实现转换数据库查询结果数据到对应类型的方法
2017/11/16 PHP
TP(thinkPHP)框架多层控制器和多级控制器的使用示例
2018/06/13 PHP
PHP将英文数字转换为阿拉伯数字实例讲解
2019/01/28 PHP
javascript学习笔记(七) js函数介绍
2012/06/19 Javascript
jQuery-Tools-overlay 使用介绍
2012/07/14 Javascript
JS画5角星方法介绍
2013/09/17 Javascript
jQuery 删除/替换DOM元素的几种方式
2014/05/20 Javascript
jQuery实现文本框输入同步的方法
2015/06/20 Javascript
Nodejs Express4.x开发框架随手笔记
2015/11/23 NodeJs
jQuery插件echarts实现的循环生成图效果示例【附demo源码下载】
2017/03/04 Javascript
jquery插件canvaspercent.js实现百分比圆饼效果
2017/07/18 jQuery
详解webpack打包nodejs项目(前端代码)
2018/09/19 NodeJs
详解如何在vue项目中使用layui框架及采坑
2019/05/05 Javascript
微信小程序实现滑动操作代码
2020/04/23 Javascript
vue 单页应用和多页应用的优劣
2020/10/22 Javascript
[40:03]RNG vs VG 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/17 DOTA
使用python检测手机QQ在线状态的脚本代码
2013/02/10 Python
Python中pandas dataframe删除一行或一列:drop函数详解
2018/07/03 Python
详解flask入门模板引擎
2018/07/18 Python
selenium使用chrome浏览器测试(附chromedriver与chrome的对应关系表)
2018/11/29 Python
10 分钟快速入门 Python3的教程
2019/01/29 Python
python的Jenkins接口调用方式
2020/05/12 Python
使用python修改文件并立即写回到原始位置操作(inplace读写)
2020/06/28 Python
python关于倒排列的知识点总结
2020/10/13 Python
100%法国制造的游戏和玩具:Les Jouets Français
2021/03/02 全球购物
什么是Linux虚拟文件系统VFS
2015/08/25 面试题
优纳科技软件测试面试题
2012/05/15 面试题
市场营销调查计划书
2014/05/02 职场文书
工作说明书格式
2014/07/29 职场文书
校长师德师风自我剖析材料
2014/09/29 职场文书
2015年工程部工作总结
2015/04/30 职场文书
小学四年级作文之人物作文
2019/11/06 职场文书
Python 类,对象,数据分类,函数参数传递详解
2021/09/25 Python
css3 选择器
2022/05/11 HTML / CSS