How to send data from content script to popup.html in a Chrome Extension with JavaScript?

Spread the love

Sometimes, we want to send data from content script to popup.html in a Chrome Extension with JavaScript.

In this article, we’ll look at how to send data from content script to popup.html in a Chrome Extension with JavaScript.

How to send data from content script to popup.html in a Chrome Extension with JavaScript?

To send data from content script to popup.html in a Chrome Extension with JavaScript, we can send and receive messages.

For instance, we write

chrome.runtime.sendMessage({
  totalElements,
});

Then we write

chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
  localStorage.setItem("totalElements", request.totalElements);
});

to call sendMessage to send an object.

Then we call chrome.runtime.onMessage.addListener with a function that gets the sent message from request.

Conclusion

To send data from content script to popup.html in a Chrome Extension with JavaScript, we can send and receive messages.

Leave a Reply

Your email address will not be published. Required fields are marked *