乾貨！防運營商劫持

時間 2019-11-05

標籤乾貨運營商劫持简体版

原文原文鏈接

1、什麼是運營商劫持

什麼是運營商：

運營商是指那些提供寬帶服務的ISP，包括三大運營商中國電信、中國移動、中國聯通，還有一些小運營商，好比長城寬帶、歌華有線寬帶。運營商提供最最基礎的網絡服務，掌握着通往用戶物理大門的鑰匙，目前運營商劫持很廣泛。html

舉個劫持的栗子：canvas

劫持方式：

運營商比較常見的做惡方式有三種，分別是DNS劫持、HTTP劫持、HTTPS劫持：瀏覽器

DNS劫持：這種劫持會把你從新定位到其它網站，咱們所熟悉的釣魚網站就是這個原理。可是由於它的違法性，如今被嚴厲的監管起來，已經不多見。安全

HTTP劫持：雖然DNS劫持已經被監管了起來，可是還有HTTP劫持啊！你DNS解析的域名的IP地址不變，當運營商發現你的是HTTP請求時，就會在裏面插入一些奇奇怪怪的廣告（好比一些banner、浮標、更有甚把你你的商品位給劫持了 WTF...）而且這種現象十分常見，不信你能夠試着隨便打開一個網頁，仔細看看你就會發現一些小尾巴，這就是被HTTP劫持了。bash

HTTPS劫持：安全的超文本傳輸協議，數據加密這也能劫持？答案是確定的！該劫持方式有兩種：網絡

僞造證書，經過病毒或者其餘方式將僞造證書的根證書安裝在用戶系統中（較少）
代理也有客戶的證書與私鑰，或者客戶端與代理認證的時候不校驗合法性，便可經過代理來與咱們服務端進行數據交互（較多）

備註：使用本篇的代碼必定會讓你查到HTTPS劫持的（前提是使用了https）dom

2、防運營商劫持

準確的來講是防script、iframe注入型劫持，95%以上是這種劫持方式，由於DNS劫持被嚴管了。異步

運營商是如何劫持的，網上有不少資料，這裏很少逼逼測試

下面是防劫持代碼：網站

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <title>防劫持代碼測試</title>
  <script>
    console.log('發生劫持，初始化就直接置頂的流氓行爲，暫沒法防護，但能夠經過埋點記錄LOG，向工信部投訴！!');
  </script>
  <!-- 防劫持 -->
  <script shendun-eddy>
    /**
     * @note 防劫持代碼
     * @key MutationObserver 提供了監視對DOM樹所作更改的能力 
     */
    (function() {
      var srcFilterTags = ['script', 'iframe'];
      // 域名白名單 能夠加多個
      var whiteList = ['zeptojs.com'];
      var whiteListReg = [];

      // 正則匹配
      whiteList.forEach(function(wl) {
        var wlReg = new RegExp('/.+?\/\/' + wl + '|\/\/' + wl + '|.+?\.' + wl + '|^' + wl);
        whiteListReg.push(wlReg);
      });
      // 白名單助手
      var inWhileList = function(addedNode) {
        // shendun-eddy 是script的白名單標籤
        if (addedNode.src === '' && addedNode.getAttribute('shendun-eddy') !== null) {
          return true;
        }

        var isInWhiteList = false;

        whiteListReg.forEach(function(wlReg) {
          if (wlReg.test(addedNode.src)) {
            isInWhiteList = true;
            return false;
          }
        });

        return isInWhiteList;
      };

      // dom觀察器
      var mutationHandler = function(records) {
        records.forEach(function(record) {
          Array.prototype.slice.call(record.addedNodes).forEach(function(addedNode) {
            srcFilterTags.forEach(function(tagName) {
              // 標籤匹配 白名單匹配
              if (addedNode.tagName === tagName.toUpperCase() && !inWhileList(addedNode)) {
                addedNode.remove();
              };
            });
          });
        })
      };

      // 核心 - MutationObserver 提供了監視對DOM樹所作更改的能力
      // 優勢 - 動態監聽是否有非法的 iframe 和 script 代碼
      // 缺點 - 沒法查找頭部直接插入的代碼
      var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver,
        observeMutationSupport = !!MutationObserver;
      var html = document.getElementsByTagName('html')[0];

      if (observeMutationSupport) {
        new MutationObserver(mutationHandler).observe(html, {
          'childList': true,
          'subtree': true
        });
      }

      // 惟獨直接加載的不能remove掉，異步加載的都能remove掉！！
      // ***  記錄頭部的script，通知工信部 ***
      var eleList = document.querySelectorAll('script');
      var len = eleList.length;
      for (var i = 0; i < len; i++) {
        // 遍歷操做
        if (!inWhileList(eleList[i])) {
          // do sth 這裏的刪除雖然已經晚了，由於頭部同步JS已被執行，刪除操做意義不大，但能夠統計被劫持的代碼是什麼，記錄好LOG 通知工信部
          // sendLog
          eleList[i].remove();
        }
      }
    })();
  </script>
  <script>console.log("劫持1");</script>
</head>
<body>
  <div>防劫持代碼測試</div>
  <div class="father">
    <div class="bro">
      <div class="xiongdei">
        <script src="https://mt.cnzz.com/js/hdpi_canvas.js"></script>
      </div>
    </div>
  </div>
  <script src="http://zeptojs.com/zepto.min.js"></script>
  <!-- 這裏執行了 console.log('哎喲，我來劫持你了...'); 雖然訪問了這個script, 但被remove了不會執行-->
  <script src="http://yun.dui88.com/qiho-h5/jqg/shendun_test.js"></script>
  <script>console.log("劫持....");</script>
</body>
</html>


複製代碼

加入運營商劫持代碼後，不在白名單和安全標籤（shendun-eddy）內的script或者iframe都會被remove掉。

提示：network內能看到加載了其餘非白名單內的script代碼，但它們都沒有執行

以 yun.dui88.com/qiho-h5/jqg… 爲例，代碼以下：

;(function(){
  console.log('哎喲，我來劫持你了...');
})()
複製代碼

核心功能

MutationObserver()建立並返回一個新的 MutationObserver 它會在指定的DOM發生變化時被調用。

具體參數和用法傳送門：developer.mozilla.org/zh-CN/docs/…

兼容性

全部瀏覽器的兼容性是92.79%，手機端的兼容性更高，代碼中加了保護因此放心使用吧！

3、總結

目前運營商劫持率大約是3% ~ 25%，它們無處不在。

爲了還用戶一個乾淨安全的瀏覽環境，咱們須要作好預防措施

全站https，能防一部分
加入防運營商劫持代碼，能防大部分注入型劫持
記錄Log，記錄證據，向工信部投訴

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。