Блог

В моем проекте расширения Chrome я отправляю URL-адрес из content.js сценарий к background.js сценарий. Когда background.js получив URL-адрес, он получит веб-страницу и снизит цену. Я хочу отправить цену обратно в content.js таким образом, он может быть отображен, но каждый раз, когда я пытаюсь вызвать переменную цену, она не определена.

Вот сценарий, который я сделал.

Content.js

 chrome.runtime.sendMessage("https://www.amazon.com/dp/B07SFKTLZM");
 

background.js

 chrome.runtime.onMessage.addListener(gotMessage);

var price;

function gotMessage(message, sender, sendResponse) {
    if (message) {
        fetch(message)
        .then(function(response) {
        // When the page is loaded convert it to text
        return response.text()
        })
        .then(function(html) {

        // Initialize the DOM parser
        parser = new DOMParser();

        // Parse the text
        var document = parser.parseFromString(html, "text/html");
        price = document.getElementById("priceblock_ourprice").innerHTML;
        return price;

        })
        .catch(function(err) {  
            console.log('Failed to fetch page: ', err);  
        });
    }
}
 

Что я пробовал:

 console.log(gotMessage());
 

и

 console.log(price);
 

Что я продолжаю получать

 undefined
 

Чего я ожидаю в Background.js

 $179.00
 

Что сработало

Единственный способ заставить это работать — использовать этот код ниже, но я считаю, что должен быть лучший способ.

 setTimeout(() => { console.log(price); }, 3000);
 

Долговременные соединения https://developer.chrome.com/extensions/messaging

порт var = chrome.runtime.connect() Отправляет сообщение на порт фоновой страницы.postMessage()

Прослушиватель для ответа port.onMessage.addListener()

1. при отправке сообщения вы выполняете следующее chrome.runtime.SendMessage(«https://www.amazon.com/dp/B07SFKTLZM «); вместо этого вы должны отправить его в формате json chrome.runtime.SendMessage({«сообщение»: «https://www.amazon.com/dp/B07SFKTLZM «});
2. вы пытаетесь выполнить javascript в DOM из фонового скрипта, это неправильно. только contentscript имеет доступ к DOM. итак, этот раздел вам нужно перенести из фонового скрипта в contentscript

// Инициализировать синтаксический анализатор DOM parser = новый DOMParser();

     // Parse the text
    var document = parser.parseFromString(html, "text/html");
    price = document.getElementById("priceblock_ourprice").innerHTML;
    return price;