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
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
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
Thanks, this is indeed an elegant solution.
Here is also a link to the suggested implementation by @chrismccord
Popular in Questions
Other popular topics
Latest Phoenix Threads
Latest on Elixir Forum
Sponsor Spotlight
Catch errors, track performance, monitor hosts and more.
Categories:
Sub Categories:
Forums
Popular Tags
- #ecto
- #liveview
- #troubleshooting
- #learning-elixir
- #deployment
- #library
- #erlang
- #testing
- #genserver
- #mix
- #absinthe
- #remote-other
- #otp
- #plug
- #how-to-question
- #macros
- #postgres
- #channels
- #elixirconf
- #exunit
- #discussion
- #code-sync
- #javascript
- #podcasts
- #onsite
- #dialyzer
- #docker
- #authentication
- #umbrella
- #full-time-contract
- #podcasts-by-brainlid
- #ecto-query
- #elixir-ls
- #phoenix_html
- #iex
- #blog-post
- #graphql
- #genstage
- #ai
- #websockets
- #supervisor
- #advent-of-code
- #elixirconf-us
- #distillery
- #processes
- #forms
- #api
- #metaprogramming
- #security
- #performance
Our Sponsors
Build Elixir applications with speed and confidence.
Supporting innovation across the BEAM ecosystem.
We build reliable cloud platforms for business-critical systems.
Catch errors, track performance, monitor hosts and more.
Real-time error tracking, performance insights, and observability for devs.
Practical resources that improve the lives of professional developers.
Producing high quality Elixir screencasts since 2017.
Enabling companies to succeed by building software people love.
Courses that'll move you from confusion to "Aha, now I get it!"