Как передать значение на страницу в разработке расширения Chrome?

Question

У меня есть всплывающее окно, вызовите 'welcome.html', и я хотел бы, чтобы пользователь выделил текст и щелкнул по моему плагину, он будет использовать некоторую информацию о странице и распечатает обратно на приветствие..html.Например, заголовок веб-сайта, текст, выбранный пользователем, и URL-адрес.Но как я могу передать значение этому welcome.html?Спасибо.

Answer 1

Я делаю это в моем расширении , так как оно добывает много данных, позволяя пользователю легко скопировать их в буфер обмена.

Поскольку вы ищете намного меньше данных, это еще проще. Когда ваше всплывающее окно загружается, вы можете вызвать следующую функцию, чтобы получить необходимую информацию:

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 отправляет запрос на выбранную вкладку. * * * * * * * Сценарий содержимого должен быть вставлен на страницу, чтобы это работало, поэтому убедитесь, что вы правильно настроили манифест или вставили его программно до вызова getData или это не сработает. Сценарий, который необходимо ввести, должен выглядеть следующим образом:

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

Это просто возвращает текущий выбранный текст. Одна проблема заключается в том, что этот поиск данных может вызвать небольшую паузу во время визуализации всплывающего окна, но вы должны проверить это самостоятельно и поэкспериментировать с ним, но есть решения .

Это должно охватывать все, что вам нужно знать, так что удачи, и дайте мне знать, если вам нужна дополнительная помощь, так как я знаю, что это может быть немного подавляющим, если вы новичок в расширениях Chrome.