2016-10-19 7 views
3

MutationObserverを新しく追加したノードを使用するサードパーティの<script>がありますが、それは含まれる必要があります<head>ブロック内にあります。同期サードパーティスクリプトを<head>ブロックに挿入するChrome拡張コンテンツスクリプト(document_start)を取得できません

ブロック内にサードパーティの<script>ブロックを含めると、すべて正常に動作し、サードパーティの<script>はすべての突然変異を観察することができます。

しかし、私は、ウェブサイトの<head>ブロックにサードパーティ<script>を注入するChromeの拡張機能を使用する場合 - <script>が適切にウェブサイトの<head>ブロックに注入されているサードパーティが、非常に少数の変異を観察しています、比較的話している。

クローム>デベロッパーツール>ネットワークパネルは、サードパーティ<script>開始<img>に属するリクエスト可変数の後の負荷シーケンス、<script><body>ブロックの内部<etc>要素ことを明らかにした私のレビュー。この発見ともう少しの調査の結果、Chrome が実際にデフォルトで動的に注入された<script>タグを非同期に読み込むことを確認できました。

manifest.jsonの設定が使用されていることと、サードパーティの<script>を注入しようとしたいくつかの方法があります。

manifest.jsonを

"content_scripts": [{ 
    "matches": ["*://*/*"], 
    "run_at": "document_start", 
    "js": ["head.content-script.js"] 
}] 

head.content-script.js(試行#1)

document.write('<script async="false" src="//third-party-js.com/third-party.js"></script>'); 

head.content-script.js(試行#2)

var script = document.createElement('script'); 

script.async = false; 
script.src = ('//third-party-js.com/third-party.js'); 

document.documentElement.appendChild(script); 

head.content-script.js(試行#3)

var script = document.createElement('script'), 
    code = '(' + function() { 
     document.write('<script src="//third-party-js.com/third-party.js"><\/scr' + 'ipt>'); 
    } + ')()'; 

script.textContent = code; 
(document.head || document.documentElement).appendChild(script); 
script.remove(); 

head.content-script.js(試行#4)

var observer = new MutationObserver(function(mutations) { 
    mutations.forEach(function(mutation) { 
     mutation.addedNodes.forEach(function(addedNode) { 
      if (addedNode.nodeName === 'HEAD') { 
       var script = document.createElement('script'); 

       script.async = false; 
       script.src = ('//third-party-js.com/third-party.js'); 

       addedNode.appendChild(script); 
      } 
     }); 
    }); 
}); 

observer.observe(document, { 
    'childList': true, 
    'subtree': true 
}); 

は、他の誰がこの問題を経験しています?私は、これを行うより良いアプローチがあれば、提案にもオープンしています。私は、応答をオンザフライで変更するために、mitmproxyのようなものを使用することさえできます。再度、Chrome拡張機能の主な目的は、サードパーティの<script>を含むようにウェブサイトのソースを手動で更新したかのように、スムーズで信頼性の高いページロードで終了することです。

+0

クロムは、元の非注入コンテンツをエンキューすると思います。 '

関連する問題