LiveView Websockets not working on my mobile browsers: WebSocket is closed due to suspension

“WebSocket connection to ‘ws://192…:4000/phoenix/live_reload/socket/websocket?vsn=2.0.0’ failed: WebSocket is closed due to suspension.”

Keep getting this error on my mobile consoles and thus Websockets not working.

elixir: "~> 1.14",
{:phoenix, "~> 1.7.10"}, {:phoenix_ecto, "~> 4.4"}, {:ecto_sql, "~> 3.10"}, {:postgrex, ">= 0.0.0"}, {:phoenix_html, "~> 3.3"}, {:phoenix_live_reload, "~> 1.2", only: :dev}, {:phoenix_live_view, "~> 0.20.1"},

Any pointers?

I have tried:

  • Modifying endpoint.ex socket "/live", Phoenix.LiveView.Socket, websocket: [connect_info: [session: @session_options], timeout: 45_000], longpoll: [connect_info: [session: @session_options]]

  • Using HTTPS and WSS locally in dev.

Have you tried with different browser? :smiley:
IIRC, that was an issue a while ago of some browsers disconnecting (safari for example)

Thanks for your reply - I read the issue with Brave and older versions of Safari.

I’ve tried Chrome/Safari on iPhone iOS version 17.4.1

Unfortunately, all iOS browsers are safari engine based AFAIK

Works on iPad.

Doesnt work on iPhone Chrome/Safari.

None of the phx- events seem to be working (phx-submit, phx-change)

For anyone who may have a similar issue, my issue was that I was using

MediaSource API let mediaSource = new MediaSource(); in app.js and it wasn’t loading (because mobile iOS browsers don’t support it apparently "MediaSource" | Can I use... Support tables for HTML5, CSS3, etc) so it prevented the use of the CSRF Token for WebSocket support, hence why WebSocket’s weren’t working.