OTT 前端技术

android微信内置浏览器打开链接跳到直接在原生浏览器打开

1. 背景介绍

  默认情况下微信内部点击一条网址打开的是微信内置浏览器、微信浏览器内部链接跳转也在当前浏览器，如果想跳到外部浏览器只能在右上角"..."中选择浏览器中打开

2. 流程 -> 代码

• 第一步 服务端给一个中转链接
• 第二步 服务端判断微信内部访问链接返回状态码206
• 第三步 微信浏览接收到206状态码响应会在原生浏览器重新打开该链接
• 第四步 服务端判断非微信内访问 直接重定向backurl(即前端给后台的真正想访问的url)

  // express node 代码
  router.get('/tonativebrowser', function(req, res) {
    let backUrl = req.query.backUrl 
    if (!backUrl) {
      throw new Error('缺少参数');
    }
    let userAgent = req.headers['user-agent'];
      // android 微信浏览器
    if (/MicroMessenger/i.test(userAgent) && /android/i.test(userAgent)) { 
      res.set('context-length', 0);
      res.set('Content-Disposition', 'attachment;filename=xx.apk');
      res.set('Content-Type', 'text/plain; charset=utf-8');
      // 价值千万的关键代码 关于206状态码百度一下
      res.status(206).send(''); 
    } else if (/ios|iphone/i.test(userAgent)) {
      // ios操作
    } else {
      res.redirect(backUrl);
    }
  });

  //前端页面链接调用 或者直接将链接发给好友皆可
  window.location.href = "http://xxx.xxx.xxx/tonativebrowser?backUrl=http://xxx.xxx.xxx"