TLDR;
How do I deploy a LiveView app such that I want the WebSocket to be hosted on a separate domain than the deployed app? I want my app liveview.com app to access the websockets on wss://notliveview.com/live.

I have changed my app.js to point to the full website, but the LiveView crashes and infinitely refreshes. I have changed the check_origin: policy to false and set session_options as, but still it does not connect. I can see on the network inspector that the cookie is not set when accessing wss://notliveview.com from a website hosted on liveview.com.

  @session_options [
    store: :cookie,
    key: "_app_web_key",
    signing_salt: "ARodNYY",
    same_site: "None",
    secure: true
  ]

Why ?

I have a monolithic Phoenix LiveView that currently serves the landing, privacy policy and terms-of-service from a single server. I also want to create a new blog, and I want to split it from the monolithic app and deploy it as a static site.

I have deployed my Phoenix LiveView app on Fly and the new marketing site (generated using a static site generator on Vercel). I’m planning to use Vercel as the front-facing website. When a person visits your site, it first checks if it matches the Vercel ones and if it doesn’t the rest of the request is reverse proxied through next.config.js: rewrites | Next.js through to the LiveView app.

It works fine for apps over HTTP, but does not work with Websockets because of the above issue, any pointers would be really helpful.