arjan

arjan

Fall back to LongPoll when websocket fails?

In some corporate environments we’re experiencing that WebSocket transport is not working, because it is blocked by a proxy. The longpolling fallback of Phoenix JS seems only to check whether global.WebSocket is set or not, but does not do any smartness in the case that the browser supports WebSockets but the connection somehow is blocked.

Is there a way to automatically detect whether websockets are working and if not, switching to long polling? Before I start hacking JS, has anybody been doing something in this direction?

Marked As Solved

krstfk

krstfk

Hi I had a similar issue, and I found the information from this thread to be useful and the code posted there (I’m not sure about the author’s name) does what you want :

socket.onError(() => {
  if (navigator.onLine) {
    console.error(`Error connecting using ${socket.transport == window.WebSocket ? 'WebSocket' : 'LongPoll'}`)
    if (socket.transport == window.WebSocket) socket.transport = LongPoll;
    else if (window.WebSocket) socket.transport = window.WebSocket;
  }
});

There are other examples (I believe in some github issue) of how to tackle this.

Edit : the linlk to the aforementioned github issue is given by Chris McCord In the same thread

Also Liked

walter

walter

For reference, Longpoll Fallback has been officially implemented in Phoenix, but will only take effect for newly generated apps.

For existing apps, after upgrading to Phoenix 1.7.11 or later, you should be able to do something like this (adjust to your situation):

# in MyAppWeb.Endpoint, adjust the socket/3 call to configure longpoll in addition to web socket
  socket "/live", Phoenix.LiveView.Socket,
    websocket: [connect_info: [session: @session_options]],
    longpoll: [connect_info: [session: @session_options]]

// in assets/js/app.js
// adjust LiveSocket configuration to declare`longPollFallbackMs` 
let liveSocket = new LiveSocket("/live", Socket, {
  longPollFallbackMs: 2500,
  params: {_csrf_token: csrfToken}
})

Also make sure your Phoenix JS packages are up-to-date as well.

arjan

arjan

Thanks, this is indeed an elegant solution.

Here is also a link to the suggested implementation by @chrismccord

Where Next?

Popular in Questions Top

jononomo
I am trying to figure out how Mix knows whether the environment is test, dev, or prod – where is this set? Thanks.
New
Qqwy
Original source of discussion: This topic on the Pragmatic Programmers’ Functional Web Development with Elixir, OTP, and Phoenix forum. ...
New
hariharasudhan94
I would like to know what is the best IDE for elixir development?
New
openscript
Hello! Sorry for this astonishing simple question, but I’m really stuck. I try to set up the intellij-elixir plugin, but I don’t know ho...
New
stefanluptak
Hello everybody, usually, I use a 29" ultra-wide monitor for VSCode which can easily accomodate explorer (files panel) + file with code ...
New
siddhant3030
Hi, I have to write a raw query for one of my project. But till now I have used ecto queries and don’t have much experience writing raw ...
New
SoCreat
i’m a new one to elixir which editor can i use vs code? or atom? Thanks! :smiley:
New

Other popular topics Top

baxterw3b
Hi guys, i’m new in the Elixir world, and i have to say, that i love it! i’m having some problem to understand anonymous functions with ...
New
lanycrost
Hi everyone! I need implement if…else if…else condition from my elixir code, and anymore of this control flow structures not work proper...
New
joeerl
Hello again - after a longish gap I’ve decided I really must dig into Elixir and see what’s been happening here - so I have a few questio...
New
sen
Hi All, I set a environment variables in dev.exs , like below code. when i start server, how can i set the ${enable} value? thanks. d...
New
axelson
This post is a wiki (feel free to hit the edit button near the bottom right of this post to add your own changes!) This post collects co...
239 49266 226
New
siddhant3030
Hi, I have to write a raw query for one of my project. But till now I have used ecto queries and don’t have much experience writing raw ...
New

We're in Beta

About us Mission Statement