I am working on a Chrome Extension which is structured like this :

• the service_worker : fetches a list of compatible websites every day and if it is compatible, I will inject a 'widget' in the website
• the widget : is a React App injected inside the page (a 300x300px position:absolute div) that can help the user and that is linked to the user account from my website, for example he can save a product from Amazon and see it later in his account in my website.

My problem is the communication between these two parts. An example : I want to check if the user has currently a session opened in my website, if yes, in the React App (the widget) I will render him some tools and his items, and if not I will render him a link to login in my website.

Tried solutions:

• Call my website API directly from the widget : but I dont want to make the verification from the widget because it is a part of the webpage and I am afraid of a cookie/token hijacking (tell me if i'm wrong).

• Using CustomEvents to get a response : I found this useful post, the problem is that as said in the 5th point I cant really wait for a response from the service_worker and store it.

• Using CustomEvents with callbacks : I also can't send a callback function as said here.

• Using sendMessage from Chrome API : To use this between webpage and the service_worker you need to specify in the manifest.json the pattern of every website that needs to use it, but the list can change every day. Also the domain cannot be *, and we cannot use <all_urls>

So, my communication is only working from the web page to the extension but not in the opposite way.

Can you advise me a way of making this work ? Thanks !