js识别安卓和ios及pc端,以及解决微信的屏蔽

这个功能其实主要针对下载功能来说的,

安卓下载地址肯定和ios下载地址不一样,

如何在不同设备访问下载地址时就能根据用户的设备进行相应的跳转。

同时,微信访问的地址如果是下载地址的话,微信本身是会屏蔽跳转的。

需要识别微信,并给出提示用其他浏览器打开此网址。

代码很简单。完整代码如下:

 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
 2 <html><head><title>自动识别设备</title>
 3     <meta content="text/html; charset=unicode" http-equiv=Content-Type>
 4     <meta name=viewport content="width=device-width, initial-scale=1.0">
 5     <meta name=GENERATOR content="MSHTML 11.00.9600.17496">
 6     <style>
 7         *{  margin: 0;  padding: 0;  }
 8         body{  background: #FFFFFF;  }
 9         img{display: block;width: 100%;vertical-align: middle;}
10     </style>
11     <script>
12         function detectOS() {
13             var osUserAgent = navigator.userAgent.toLowerCase();
14             if (osUserAgent.indexOf("iphone") > -1 || osUserAgent.indexOf("ipad") > -1 || osUserAgent.indexOf("ipod") > -1) {
15                 if (osUserAgent.indexOf("micromessenger") > -1) {
16                     return "wechat";
17                 }
18                 //alert("注意:只限越狱用户可安装");
19                 top.location.href = ‘http://www.apple.com/‘;
20                 return "iphone";
21             }
22             if (osUserAgent.indexOf("android") > -1 || osUserAgent.indexOf("adr") > -1) {
23                 if (osUserAgent.indexOf("micromessenger") > -1) {
24                     return "wechat";
25                 }
26                 top.location.href = ‘http://www.baidu.com‘;
27                 return "android";
28             }
29             if (osUserAgent.indexOf("win") > -1) {
30                 top.location.href = ‘http://www.baidu.com‘;
31                 return "windows";
32             }
33             return osUserAgent;
34         }
35         detectOS();
36     </script>
38 </head>
39 <body>
40 <p><img src="http://img.m.duoku.com/cimages/img/20444/20444.png" /></p>
41 </body>
42 </html>

三个if语句实现查询:ios、Android、还是win(pc)  ,

在 ios和Android的语句中加入了

 if (osUserAgent.indexOf("micromessenger") > -1) {
                   return "wechat";
                }验证是否是在微信中打开的,如果不需要此功能可以删去。
top.location.href = ‘http://www.apple.com/‘;即为相应设备的跳转地址。最后 body里面有一张图片,当为微信访问时,显示此图片,图片内容为提示用其他浏览器打开。
时间: 2024-12-23 21:31:31

js识别安卓和ios及pc端,以及解决微信的屏蔽的相关文章

JS+css3焦点轮播图PC端

1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>js原生web轮播图</title> 6 <style> 7 *{ 8 margin:0; 9 padding:0; 10 list-style: none; 11 -moz-user-select: none;/*文字不可选

JS判断设备类型跳转至PC端或移动端相应页面

if((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i))) { //window.location.href="你的手机版地址"; }else{ //window.location.href=

webapp js与安卓,ios怎么交互

/*这段代码是固定的,必须要放到js中*/function setupWebViewJavascriptBridge(callback) { var u = navigator.userAgent; var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); if (!isiOS) { if (window.WebViewJavascriptBridge) { callback(WebViewJavascriptBridge) } else {

js判断设备是都是pc端

function IsPC() { var userAgentInfo = navigator.userAgent; var Agents = new Array("Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod"); var flag = true; for (var v = 0; v < Agent

PC端网站集成微信支付的关键代码

目前来看,PC段实现微信支付,需要生成二维码,然后用微信扫码支付. 微信支付官网DEMO没有ASP.NET的,只能自己从帮助文档里扣代码摸索.这里需要说明几点特别要注意的. 看了下微信官网的文档,总结支付方式应该是两种: 1.Navite 静态链接方式. 2.JSAPI 方式.这种应该是手机端用到的.只支持微信内置浏览器. 我使用的是第一种方式. 但是据文档描述,这种方式还分为两种.请求流程不同,如下: 1.发送支付请求到微信 -> 微信返回支付Prepay_ID -> 发送支付信息到微信 -

ios 最新系统bug与解决——微信公众号中弹出键盘再收起时,原虚拟键盘位点击事件无效

最近ios发布新版本系统12.1,随着部分用户的系统更新,一些问题也渐渐暴露出来... 公司用户反映微信公众号出现了点击无效的bug!!测试调查发现,只有iphonex.iphone6,ihpone7等部分机型会出现该问题 我当时就是一惊,一般出现在事件上的问题都是疑难杂症.何况是跟键盘相关的. 我们都知道在H5端是没法监控键盘的弹出与收起的,resize事件触发的机型极其有限,何况我在ios中实测没有触发,安卓反而可以.因为安卓弹起键盘时会修改视窗的大小,但是ios并不会,如果你在ios上设置

PHP判断访问者是PC端还是移动端

function isMobile() { // 如果有HTTP_X_WAP_PROFILE则一定是移动设备 if (isset ($_SERVER['HTTP_X_WAP_PROFILE'])) { return true; } // 如果via信息含有wap则一定是移动设备,部分服务商会屏蔽该信息 if (isset ($_SERVER['HTTP_VIA'])) { // 找不到为flase,否则为true return stristr($_SERVER['HTTP_VIA'], "wap

兼容安卓和ios实现一键复制内容到剪切板

实现代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="renderer" content="webkit"> <m

微信开发在Pc端调用公众号粉丝发送过来的图片素材

因为项目要在PC端搞一个微信墙功能,就是把粉丝发送过来的上墙内容给展示出来,但因为微信对微信素材进行了防盗链加密处理,所以在非微信页面上直接引用在微信服务器上的图片的链接是无法显示的,只会显示一张微信默认提示图片,如果我们要调用的话就只能先调用微信获取临时素材接口 https://api.weixin.qq.com/cgi-bin/media/get?access_token=ACCESS_TOKEN&media_id=MEDIA_ID把图片先下载到自己服务器再进行调用,这样就很简单了