# Liveview websocket connect info blocking iframe renderization

**URL:** <https://forum.elixirforum.com/t/liveview-websocket-connect-info-blocking-iframe-renderization/35981>\
**Category:** Questions\
**Tags:** phoenix, liveview\
**Created:** [December 4, 2020, 3:02pm UTC](https://forum.elixirforum.com/t/liveview-websocket-connect-info-blocking-iframe-renderization/35981 "2020-12-04T15:02:02Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![horus](https://forum.elixirforum.com/letter_avatar_proxy/v4/letter/h/ce73a5/32.png) [@horus](https://forum.elixirforum.com/u/horus)\
**Post date:** [December 4, 2020, 3:02pm UTC](https://forum.elixirforum.com/t/liveview-websocket-connect-info-blocking-iframe-renderization/35981/1 "2020-12-04T15:02:02Z")

</div>

Hi!  
I’m actually working on a phoenix app which I require to render in some websites embeded on an iframe, I finished coding the logic but I found that it was only working on Firefox, when using it on Chome or Opera, it end on an infinite loop recharging trying to render the content, throwing the following warning:

 ![image](https://forum.elixirforum.com/uploads/default/original/3X/b/6/b61367c647e588882e4d1b72aa8d4a87dd6c5bc0.png)

I was trying to allow this with the extra option like this with no success.

```elixir
  @session_options [
    store: :cookie,
    key: "_analytics_key",
    signing_salt: "BM3P8GYS",
    extra: "SameSite=None;",
  ]

```

and then I found that on the last version of the Endpoint it had an specific option for this cookie called same\_site, so I tried like this but I got the same results:

```elixir
  @session_options [
    store: :cookie,
    key: "_analytics_key",
    signing_salt: "BM3P8GYS",
    same_site: "None",
    #extra: "SameSite=None;",
    secure: true
  ]

```

and everytime it fails rendering I got this logs on my console:

 ![image](https://forum.elixirforum.com/uploads/default/original/3X/8/6/862d5fdb80ebeb2ec091d635b1bf00f0486f7dd5.png)

Anything seemed to work, but I found that removing the connect\_info from the websocket on the endpoint automatically solved the issue, just like this:

```elixir
# socket "/live", Phoenix.LiveView.Socket, websocket: [connect_info: [session: @session_options]]
  socket "/live", Phoenix.LiveView.Socket, websocket: []

```

But this will affect things like guardian and I guess a few security things, so I was looking for a way to remove this ONLY when trying to render the page on the iframe, I was thinking on a plug to do this but I don’t know if this is possible for this specific part, maybe anyone know about something I could do here to accomplish what I want? Thanks in advance!

---

<div class="post-metadata">

**Author:** ![rhcarvalho](https://forum.elixirforum.com/user_avatar/forum.elixirforum.com/rhcarvalho/32/32243_2.png) [@rhcarvalho](https://forum.elixirforum.com/u/rhcarvalho)\
**Post date:** [July 22, 2024, 3:41pm UTC](https://forum.elixirforum.com/t/liveview-websocket-connect-info-blocking-iframe-renderization/35981/2 "2024-07-22T15:41:37Z")

</div>

There are a few threads about LiveViews on iframes now. For anyone landing here in the future, this is the current solution I’ve found:

* * *

After trying several things I gathered around the internet, I found the 3 minimal steps which limit security-related changes to the embeddable LiveViews only.

> [@How to: Embed a LiveView via iframe](https://forum.elixirforum.com/t/embed-a-liveview-via-iframe-solution/65066):
>
> After collecting information from multiple sources ([this forum](https://forum.elixirforum.com/t/embedding-a-live-view-as-an-iframe/42517), [blogs](https://tmr08c.github.io/2021/04/phoenix-app-in-iframe/), [StackOverflow](https://stackoverflow.com/questions/65146002/phoenix-liveview-websocket-connect-info-blocking-iframe-content) and [GitHub](https://github.com/phoenixframework/phoenix_live_view/issues/2470#issuecomment-1437447294)), I was finally able to successfully embed part of an existing Phoenix LiveView app in an iframe. I’d like to share the steps here, both for future reference and to hopefully help others. If you find this useful, please let me know. Do you think the official docs should contain a small guide on this topic? Configuring a LiveView app to be embeddable via iframe There are luckily only a few changes t…

- Separate LiveView Socket.
- Separate Router Pipeline replacing `x-frame-options` HTTP header with a restrictive CSP.
- Separate layout for embeddable LiveViews independent from session-based assigns.