用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 相关文章推荐
ajax无刷新动态调用股票信息(改良版)
Nov 01 Javascript
javascript 字符 Escape,encodeURI,encodeURIComponent
Jul 09 Javascript
jBox 2.3基于jquery的最新多功能对话框插件 常见使用问题解答
Nov 10 Javascript
JS简单的图片放大缩小的两种方法
Nov 11 Javascript
jQuery对html元素取值与赋值的方法
Nov 20 Javascript
js获得参数的getParameter使用示例
Feb 26 Javascript
JavaScript高阶函数_动力节点Java学院整理
Jun 28 Javascript
vue-resource 拦截器(interceptor)的使用详解
Jul 04 Javascript
微信小程序渲染性能调优小结
Jul 30 Javascript
layui表单验证select下拉框实现验证的方法
Sep 05 Javascript
JavaScript 链表定义与使用方法示例
Apr 28 Javascript
详解Vite的新体验
Feb 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下目前为目最全的CURL中文说明
2010/08/01 PHP
基于PHP的cURL快速入门教程 (小偷采集程序)
2011/06/02 PHP
解析PHP实现下载文件的两种方法
2013/07/05 PHP
php代码审计比较有意思的例子
2014/05/07 PHP
轻松掌握php设计模式之访问者模式
2016/09/23 PHP
PHP 7.1新特性的汇总介绍
2016/12/16 PHP
PHP中的正则表达式实例详解
2017/04/25 PHP
php弹出提示框的是实例写法
2019/09/26 PHP
javascript getElementsByClassName 和js取地址栏参数
2010/01/02 Javascript
使用JS进行目录上传(相当于批量上传)
2010/12/05 Javascript
JS控制图片翻转示例代码(兼容firefox,ie,chrome)
2013/12/19 Javascript
通过location.replace禁止浏览器后退防止重复提交
2014/09/04 Javascript
JS实现状态栏跑马灯文字效果代码
2015/10/24 Javascript
javascript结合Flexbox简单实现滑动拼图游戏
2016/02/18 Javascript
jQuery判断是否存在滚动条的简单方法
2016/09/17 Javascript
JavaScript仿聊天室聊天记录
2016/12/27 Javascript
webpack学习--webpack经典7分钟入门教程
2017/06/28 Javascript
简单实现jquery隔行变色
2017/11/09 jQuery
小程序二次贝塞尔曲线实现购物车商品曲线飞入效果
2019/01/07 Javascript
详解JS实现简单的时分秒倒计时代码
2019/04/25 Javascript
Vue.js 中制作自定义选择组件的代码附演示demo
2020/02/28 Javascript
详解微信小程序(Taro)手动埋点和自动埋点的实现
2021/03/02 Javascript
Django中使用group_by的方法
2015/05/26 Python
python django 实现验证码的功能实例代码
2017/05/18 Python
Python使用plotly绘制数据图表的方法
2017/07/18 Python
关于阿里云oss获取sts凭证 app直传 python的实例
2019/08/20 Python
Python发送邮件封装实现过程详解
2020/05/09 Python
Python 必须了解的5种高级特征
2020/09/10 Python
Python的信号库Blinker用法详解
2020/12/31 Python
你不知道的葡萄干处理法、橙蜜处理法、二氧化碳酵母法
2021/03/17 冲泡冲煮
HTML5中5个简单实用的API
2014/04/28 HTML / CSS
台湾母婴用品限时团购:妈咪爱
2018/08/03 全球购物
毕业生求职简历的自我评价
2013/10/07 职场文书
五型班组建设方案
2014/02/10 职场文书
复制别人的成功真的会成功吗?
2019/10/17 职场文书
python实现会员管理系统
2022/03/18 Python