reactjs - How to render a chat Widget inside iframe so that it can access the localStorage? - Stack Overflow

I am trying to create a chat widget website like tawk.to / tidio, where I would give user a snippet code and he would put it inside the body of his code and a chat widget appear on his website.

I am a newbie I don't have any knowledge regarding this I am creating this from absolute scratch

I have a frontend which would be for agents (people who would chat with customers that are coming on websites) and I have created my chat widget in react (separate code from the previous frontend) and a backend with socket.io implemented.

There are few issues that are I am facing.

1. I inspected the tawk.to / tidio they are storing token inside the localStorage of the website that has embedded the chat widget but they shouldn't be able to do this because chat widget has different origin than the website.

2. There is'nt any link inside src attribute of iframe tags its just "about:blank"

3. I am struggling with how to render the chat widget should I directly enter the link of my chat widget (running separately) or should I bundle it first then put that bundled folder inside my backend and use it inside the script tag

this is how i am rendering the widget

  app.get("/api/render/widget", (req, res) => {
  res.sendFile(path.join(__dirname, "dist/index.html"));
  });

I tried setting the direct live url of the widget as iframe's src tag.