2017-01-26 6 views
0

content.js(コンテンツスクリプト)から "getVideo"をpopup.jsに渡すことに苦労しています。今すぐメッセージを取得しようとするとhttps://developer.chrome.com/extensions/messagingからコピーしました。しかし、ページが開くとすぐに、コンソールにエラーが表示されます:Cannot read property 'farewell' of undefined。私は、何も働いていないChrome拡張メッセージングに関連するあらゆるスレッドからのすべての提案/回答を試しました。これは、私が拡張機能をどのように設定しているのか、何かもっと間違っていると信じさせますが、私は何が分かりません。ありがとう!コンテンツスクリプトの変数をポップアップに送信できません

manifest.jsonを

{ 
    "manifest_version": 2, 

    "name": "JW Player Tools", 
    "description": "This extension lets you speed up and download captions from a JW video", 
    "version": "1.2.5", 

    "browser_action": { 
    "default_icon": "icon.png", 
    "default_popup": "popup.html" 
    }, 

    "content_scripts": [ 
{ 
    "matches": ["*://*.tower.la.utexas.edu/*"], 
    "all_frames": true, 
    "js": ["content.js"], 
    "run_at": "document_idle" 
}] 
} 

popup.js

document.addEventListener('DOMContentLoaded', function() { 


    chrome.runtime.onMessage.addListener(
     function(request, sender, sendResponse) { 
     console.log(sender.tab ? 
        "from a content script:" + sender.tab.url : 
        "from the extension"); 
     if (request.greeting == "hello") 
     sendResponse({farewell: "goodbye"}); 
    }); 



    var playback = document.getElementById('playback'); 
    playback.addEventListener('click', function() { 
     var newspeed = prompt("Current Speed: " + getVideo.playbackRate + "\nNew Speed: "); 
     getVideo.playbackRate = newspeed; 
    }); 

    var captions = document.getElementById('captions'); 
    captions.addEventListener('click', function() { 
     for (index = 0; index < getVideo.textTracks[0].cues.length; ++index) { 
      document.write(getVideo.textTracks[0].cues[index].text + " "); 
     } 
    }); 
}); 

content.js

var waitForVideo = setInterval(checkForElement, 150); 

function checkForElement() { 
    var videoElem = document.getElementsByTagName('video'); 
    if (videoElem.length) { 
     clearInterval(waitForVideo); 
     var videolink = videoElem[0].getAttribute('src'); 
     getVideo = videoElem[0]; 



     chrome.runtime.sendMessage({greeting: "hello"}, function(response) { 
      console.log(response.farewell); 
     }); 




    } 
} 

popup.html

<!doctype html> 
    <html> 
     <head> 
     <title>JW Tools</title> 
     <script src="popup.js"></script> 
     </head> 
     <body> 
     <button id="playback">Speed Up</button> 
     <button id="captions">Download Captions</button> 
     </body> 
    </html> 
+1

これをテストしているWebページ(または少なくともURL)に* popup.html *とHTMLを入力してください。 – Makyen

+1

コンテンツスクリプトの名前として* background.js *という名前を使用するのは悪い考えです。バックグラウンドスクリプトと混同するのは非常に簡単です。 – Makyen

+1

コンテンツスクリプトでは、 'getVideo'はDOM要素です。それをメッセージで送信することはできません。 DOM要素はJSON直列化可能ではありません。すべてのメッセージはJSON直列化可能でなければなりません。あなたは実際にそれをメッセージとして送信しようとしているわけではありませんが、最初の文章ではあなたが苦労していることを言っています。 – Makyen

答えて

0

問題を修正しました。私はそのように関数をcontent.jsに移しました。

content.js

var waitForVideo = setInterval(checkForElement, 150); 

function checkForElement() { 
    var videoElem = document.getElementsByTagName('video'); 
    if (videoElem.length) { 
     clearInterval(waitForVideo); 
     getVideo = videoElem[0]; 
    } 
} 

chrome.extension.onRequest.addListener(function(request, sender, sendResponse) { 
    if (request.task == "caption") { 
     for (index = 0; index < getVideo.textTracks[0].cues.length; ++index) { 
      document.write(getVideo.textTracks[0].cues[index].text + " "); 
     } 
    } else if (request.task == "speed") { 
     var newspeed = prompt("Current Speed: " + getVideo.playbackRate + "\nNew Speed: "); 
     getVideo.playbackRate = newspeed; 
    } else { 
     // sendResponse({}); 
    } 
}); 

とメッセージにpopup.jsを使用助けを

document.addEventListener('DOMContentLoaded', function() { 
    var playback = document.getElementById('playback'); 
    playback.addEventListener('click', function() { 
     // var newspeed = prompt("Current Speed: " + getVideo.playbackRate + "\nNew Speed: "); 
     // getVideo.playbackRate = newspeed; 

     chrome.tabs.getSelected(null, function(tab) { 
      chrome.tabs.sendRequest(tab.id, { 
       task: "speed" 
      }, function(response) { 
       alert(response.farewell); 
      }); 
     }); 

    }); 

    var captions = document.getElementById('captions'); 
    captions.addEventListener('click', function() { 
     // for (index = 0; index < getVideo.textTracks[0].cues.length; ++index) { 
     // document.write(getVideo.textTracks[0].cues[index].text + " "); 
     // } 

     chrome.tabs.getSelected(null, function(tab) { 
      chrome.tabs.sendRequest(tab.id, { 
       task: "caption" 
      }, function(response) { 
       alert(response.farewell); 
      }); 
     }); 
    }); 
}); 

感謝をcontent.js! @Makyen @wOxxOm

関連する問題