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

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');
      }); 
  }
fluttersocketsdartsocket.io


Solution 1:[1]

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.

Solution 2:[2]

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.

Solution 3:[3]

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>

Solution 4:[4]

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.

Solution 5:[5]

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'))

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Sophanith Chhoun
Solution 2 DroidOS
Solution 3 Hiran D.A Walawage
Solution 4 rapaterno
Solution 5 Stephen Ostermiller

Related Questions