Error during WebSocket handshake: Unexpected response code: 500

I receive the error

Error during WebSocket handshake: Unexpected response code: 500

in my browser.

The Phoenix code is

defmodule SyntaxWeb.UserSocket do
  use Phoenix.Socket

  def connect(%{"token" => token}, socket, _connect_info) do
    IO.inspect "get here"
    case Phoenix.Token.verify(socket, "user socket", token, max_age: 1209600) do
      {:ok, user_id} ->
        IO.inspect "and get there"
        {:ok, assign(socket, :current_user, Syntax.Accounts.get_user!(user_id))}
      {:error, reason} ->
        IO.inspect "bad user socket token : #{reason}"
        :error
    end
  end
end

The javascript code uses is :

let { Socket } = require('phoenix-channels');
socket = new Socket("ws:" + myurl + "/socket", {params: {token: userToken}})
socket.connect();

The request for connection reaches the server as I have both ā€œget hereā€ and ā€œget thereā€ displayed. Would anyone have an idea of what goes wrong ?

If you open your network tab and then refresh, you will see the 500 error request. There may be information as to why the error occurred here.

Another place to look for the error is the Phoenix logs. Can you paste what you see in red when the 500 occurs?

Unfortunately there is nothing display on the server side : like everything is going fine.

I found out that the version of my code works with Phoenix version 1.4.0. The version Iā€™m having problem with is 1.4.9. Iā€™m thinking that maybe there is a compatibility issue with phoenix-channels, or maybe the rest of my code is not compatible with version 1.4.9. On my EndPoint I have

  socket "/socket", SyntaxWeb.UserSocket,
    websocket: true,
    longpoll: false

Maybe it could helpā€¦

Are You sure of this code? I use phoenix npm packageā€¦ which is compatible with 1.4.9

yarn add phoenix

# or 
npm install --save phoenix

# then
import { Socket } from 'phoenix';

BTW doing a DB query when using token is quite strange because You could get all needed info in the token. I sign my token like this.

def sign(user), do: Phoenix.Token.sign(Endpoint, @salt, %{id: user.id, name: user.name})

So I donā€™t need to make additional DB query when checking token. It has the advantage to not expose sensitive data in socket assigns.

Unless You want to invalidate tokens, like guardian-db does.

Syntax.Accounts.get_user!(user_id)

Thanks for the tip :slight_smile:

I now have the exact same version of erlang/elixir/phoenix on dev and production, but I keep having the same issue on production while everything is fine on dev.

The only thing I can think of is the following: I use the following trick on production so that Cowboy can accept connections on the port 80 :

sudo setcap 'cap_net_bind_service=+ep' /HOME/myapp/erts-8.3/bin/beam.smp 

Is it possible that another program than beam.smp is in charge of socket connections ?

I changed nothing, and at some point it started to work. This is mysteriousā€¦
Maybe some cache system somewhere caused this.

Addition :
I found something more specific : The problem disappear when I suppress the website cookie from my browser. I have to find out what causes this.

Is it a particularly large cookie? A marketing installation caused this issue in my app once due to a shared domain. The solution in that case was to allow larger cookies to be processed by cowboy.

1 Like

I donā€™t think it was particularly large. Iā€™ll check if the problem occurs again