专栏首页啸天"s blog微信内置浏览器自动跳转其它浏览器

微信内置浏览器自动跳转其它浏览器

前言

此方法可以实现微信内置浏览器跳转到手机其它浏览器,现在网上其它的方法都只是一个页面,让访问者自己手动点右上角浏览器打开,而这个不同,是可以直接自动跳转的。

安卓访问时可以直接自动跳转浏览器;IOS就复杂一点了,需要点一下然后借助手机淘宝才可以跳转。

代码

下面是全部代码,已经做了安卓和IOS的适配。需要替换其中要跳转的网址,然后保存为php文件,在微信内访问即可实现自动跳转:

<?php
error_reporting(0);
if($_GET['open']==1 && strpos($_SERVER['HTTP_USER_AGENT'], 'MicroMessenger')!==false){
    header("Content-Disposition: attachment; filename=\"load.doc\"");
    header("Content-Type: application/vnd.ms-word;charset=utf-8");
}
?>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Welcome</title>
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport"/>
    <meta content="yes" name="apple-mobile-web-app-capable"/>
    <meta content="black" name="apple-mobile-web-app-status-bar-style"/>
    <meta name="format-detection" content="telephone=no"/>
    <meta content="false" name="twcClient" id="twcClient"/>
    <style>
    body,html{width:100%;height:100%}
    *{margin:0;padding:0}
    body{background-color:#fff}
    .top-bar-guidance{font-size:15px;color:#fff;height:40%;line-height:1.8;padding-left:20px;padding-top:20px;background:url(//gw.alicdn.com/tfs/TB1eSZaNFXXXXb.XXXXXXXXXXXX-750-234.png) center top/contain no-repeat}
    .top-bar-guidance .icon-safari{width:25px;height:25px;vertical-align:middle;margin:0 .2em}
    .app-download-btn{display:block;width:214px;height:40px;line-height:40px;margin:18px auto 0 auto;text-align:center;font-size:18px;color:#2466f4;border-radius:20px;border:.5px #2466f4 solid;text-decoration:none}
</style>
</head>
<body>
    <div class="top-bar-guidance">
        <p>
            点击右上角<img src="//gw.alicdn.com/tfs/TB1xwiUNpXXXXaIXXXXXXXXXXXX-55-55.png" class="icon-safari"/> Safari打开
        </p>
        <p>
            可以继续访问本站哦~
        </p>
    </div>
    <a class="app-download-btn" id="BtnClick" href="javascript:;"> 点此继续访问 </a>
    <script>
        var url = 'https://xtboke.cn';//更改需要跳转的地址
        document.querySelector('body').addEventListener('touchmove', function (event) {
            event.preventDefault();
        });
        window.mobileUtil = (function(win, doc) {
            var UA = navigator.userAgent,
            isAndroid = /android|adr/gi.test(UA),
            isIOS = /iphone|ipod|ipad/gi.test(UA) && !isAndroid,
            isBlackBerry = /BlackBerry/i.test(UA),
            isWindowPhone = /IEMobile/i.test(UA),
            isMobile = isAndroid || isIOS || isBlackBerry || isWindowPhone;
            return {
                isAndroid: isAndroid,
                isIOS: isIOS,
                isMobile: isMobile,
                isWeixin: /MicroMessenger/gi.test(UA),
                isQQ: /QQ/gi.test(UA)
            };
        })(window, document);
        if(mobileUtil.isWeixin){
            if(mobileUtil.isIOS){
                url = "https://t.asczwa.com/taobao?backurl=" + encodeURIComponent(url);
                document.getElementById('BtnClick').href=url;
            }else if(mobileUtil.isAndroid){
                url = '?open=1';
                document.getElementById('BtnClick').href=url;
                var iframe = document.createElement("iframe");
                iframe.style.display = "none";
                iframe.src = url;
                document.body.appendChild(iframe);
            }
        }else{
            document.getElementById('BtnClick').href=url;
            window.location.replace(url);
        }
    //setTimeout('WeixinJSBridge.invoke("closeWindow", {}, function(e) {})', 2000); </script>
</body>
</html>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 端口号超过了65535

    这句话是错误的,实际上是最多监听TCP的端口号是65536,就像一台服务器安装了一个nginx,他的默认端口是80,但可以改为65535。

    Erwin
  • 冷门机强制root

    拥有twrp的可以直接卡刷magisk(但是冷门机根本就没有人适配第三方rec,也没有第三方ROM)比自我的金立s10c

    Erwin
  • 仿站小工具 v3.0 仿站神器

    Erwin
  • 链接在微信内置浏览器自动跳转到其它浏览器的方法

    此方法可以实现微信内置浏览器跳转到手机其它浏览器,现在网上其它的方法都只是一个页面,让访问者自己手动点右上角浏览器打开,而这个不同,是可以直接自动跳转的。

    新阳网络CTO
  • 微信内置浏览器自动跳转其它浏览器

    Youngxj
  • 给新生成的节点(动态生成节点)绑定事件方法总结

    第一种 jquery写法 $('.father').on('click',',child',function(){}) $(document).on('cli...

    吴裕超
  • CSS3盒阴影 box-shadow

    HTML5学堂:CSS3 的 box-shadow 有点类似于 text-shadow,只不过不同的是 text-shadow 是对象的文本设置阴影,在移动端我...

    HTML5学堂
  • ASP.NET MVC5+EF6+EasyUI 后台管理系统(38)-Easyui-accordion+tree漂亮的菜单导航

    本节主要知识点是easyui 的手风琴加树结构做菜单导航 有园友抱怨原来菜单非常难看,但是基于原有树形无限级别的设计,没有办法只能已树形展示 先来看原来的效果 ...

    用户1149182
  • Dubbo源码学习五-服务发现

    从类图中,我们可以看到ReferenceBean继承了Referenceconfig,同时实现了FactoryBean、DisposableBean、Appli...

    路行的亚洲
  • 使用Kubespray安装k8s集群

    本文撰写时,Kubespray的master分支不稳定,请使用release版本来安装,具体来说就是切换到最新的tag上。

    颇忒脱

扫码关注云+社区

领取腾讯云代金券