Flutter Socket io Error on WebSocketException: Connection to was not upgraded to websocket

Viewed 6323

I use this package and it work properly on test websites but in app I got this Error

WebSocketException: Connection to 'https://socket.excopro.com:0/socket.io/?EIO=3&transport=websocket#' was not upgraded to websocket

and this is my Code

SocketService() {
    var socket = io(
        'https://socket.excopro.com:443/', <String, dynamic>{
      'transports': ['websocket'],
      'autoConnect': true,
    });
    socket.on('connect', (_) {
      print('connect');
      socket.emit('msg', 'test');
    });
      socket.on("connecting", (data) => print('connecting'));
      socket.on('connect_error', (data) {
        print(data);
        socket.emit('msg', 'test');
      }); 
  }
5 Answers

I have met the same issue.

For my case, I use Nginx as proxy. I solve the issue by added some proxy header to my Nginx configuration.

proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";

You can refer to this link.

I ran into this error in my Flutter/Dart app which is being serviced by NGinx + NChan. It turned out that the wss:... url that I was creating in Dart was malformed - easily done if you are doing string interpolation in Dart, PHP and JS all within the space of a few minutes given that each language has its own way of interpreting interpolated variables in braces. The result was that location = ~ /path/(regex)$ setting in my Nginx/NChan conf was not recognizing the URL as one that required upgrading to wss. Nginx then proceeded to try and find the resource at https://example.com/malformed/path without upgrading it to wss which then threw up this error in Dart.

Lesson - when this happens check that the URL you are trying to reach is well formed so it ends up being recognized as one requring an upgrade to wssserver side.

You have make sure to enable websocket in Virtual Host.

RewriteCond %{HTTP:Upgrade} =websocket [NC]
RewriteCond %{HTTP:Connection} Upgrade [NC]
RewriteRule /(.*)           ws://127.0.0.1:3055/$1 [P,L]
RewriteCond %{HTTP:Upgrade} !=websocket [NC]
RewriteRule /(.*)           http://127.0.0.1:3055/$1 [P,L]

Here is the complete Virtual Host if anyone needs,

<VirtualHost *:80>
    ServerName domain.com
    ServerAlias www.domain.com

    ProxyRequests Off
    ProxyPreserveHost On
    ProxyVia Full

    <Proxy *>
        Require all granted
    </Proxy>

    ProxyPass / http://127.0.0.1:3055/
    ProxyPassReverse / https://127.0.0.1:3055/

    ProxyPass /api http://127.0.0.1:3055/api
    ProxyPassReverse /api https://127.0.0.1:3055/api

    RewriteEngine on

    RewriteCond %{HTTP:Upgrade} =websocket [NC]
    RewriteCond %{HTTP:Connection} Upgrade [NC]
    RewriteRule /(.*)           ws://127.0.0.1:3055/$1 [P,L]
    RewriteCond %{HTTP:Upgrade} !=websocket [NC]
    RewriteRule /(.*)           http://127.0.0.1:3055/$1 [P,L]

    RewriteCond %{SERVER_NAME} =domain.com [OR]
    RewriteCond %{SERVER_NAME} =www.domain.com
    RewriteRule ^ https://%{SERVER_NAME}%{REQUEST_URI} [END,NE,R=permanent]
</VirtualHost>

Received this error when there was a mismatch on the client and server versions of socket_io. Try finding the matching version to the version the server is using.

I had for the same error, this is what my environment:

  • VPS with docker
  • Azuracast as container
  • Nginx proxy manager as container
  • a public domain that point to the Azuracast via hots in nginx proxy manager.
  • a flutter/dart mobile app that stream the radio flux, and I wanted to get "Now playing audio" updates via Websocket.

I had the same error when trying to connect via https schema with/without port.

I finally found that in nginx proxy manager I have to activate the Websocket option in the host I created. Then changed my url to wss://... instead of https://...

In flutter I used this package for websocket => web_socket_channel: ^2.2.0

and this is the line of code to init the websocket:

var websocket = IOWebSocketChannel.connect(Uri.parse('wss://xxx.com/api/live/nowplaying/my_station_shortcode'))
Related