无法将内容脚本中的变量发送到弹出窗口

时间:2017-01-26 06:39:10

标签: javascript google-chrome google-chrome-extension

所以我一直在努力将“{1}}(我的内容脚本)中的”getVideo“传递给content.js。现在我从https://developer.chrome.com/extensions/messaging复制,试图收到消息。但是,只要页面打开,我就会在控制台上收到错误:popup.js。我已经尝试过与Chrome扩展消息相关的每个帖子中的每一个建议/答案,但没有任何效果。这让我相信我有更多的错误,我有如何设置扩展,但我不知道是什么。谢谢!

的manifest.json

Cannot read property 'farewell' of undefined

popup.js

{
  "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"
 }]
}

content.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 + " ");
        }
    });
});

popup.html

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);
        });




    }
}

1 个答案:

答案 0 :(得分: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发送消息content.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);
            });
        });
    });
});

感谢您的帮助! @Makyen @wOxxOm