Question

我有一个弹出窗口，调用'welcome.html'，我想做的事情就是当用户选择一个文本，然后点击我的插件时，它会使用一些页面信息，并打印回欢迎html的。例如，网站标题，用户选择的文本和网址。但是我怎样才能将值传递给welcome.html？谢谢。

Answer 1

我在my extension中做了很多这样的事情，因为它挖掘了大量数据，使用户可以轻松地将其复制到剪贴板。

由于您正在寻找更少的数据，因此更简单。当您加载弹出窗口时，您可以调用以下函数来检索所需的信息;

function getData(callback) {
    chrome.tabs.getSelected(null, function (tab) {
        var data = {
            selection: '',
            title: tab.title,
            url: tab.url
        };
        /*
         * We can't call content scripts on some pages and the process will get
         * stuck if we try.
         */
        if (tab.url.indexOf('chrome') === 0 ||
                tab.url.indexOf('https://chrome.google.com/webstore') === 0) {
            callback(data);
        } else {
            chrome.tabs.sendRequest(tab.id, {}, function (response) {
                data.selection = response.selection;
                callback(data);
            });
        }
    });
}

确保传入一个回调函数，该函数将在提取完所有数据后调用;

getData(function (data) {
    console.log('Title: ' + data.title);
    console.log('URL: ' + data.url);
    console.log('Selected Text: ' + data.selection);
    // Display the data instead
});

您可能已经注意到getData函数向选定的选项卡发送请求。需要将content script注入页面才能实现此功能，因此请确保在调用getData之前正确配置了清单或injected it programmatically，否则它不会工作。需要注入的脚本应该类似于以下内容;

(function () {
    chrome.extension.onRequest.addListener(function (request, sender,
            sendResponse) {
        sendResponse({
            selection: window.getSelection().toString()
        });
    });
})();

这只会返回当前选定的文本。一个问题是，这个数据查找可能会在弹出窗口时稍微暂停，但是您应该自己测试并尝试使用它，但有solutions。

这应该涵盖您需要知道的所有好运，如果您需要任何进一步的帮助，请告诉我，因为我知道如果您不熟悉Chrome扩展程序，这可能会有点压力。

如何在Chrome扩展程序开发中将值传递给页面？

1 个答案: