1

I just deployed my flask application on development server after i checked that the socketio works well on regular run server and also using gunicorn with eventlet on local, Now i deployed my flask app and it runners well when i open any page (HTTP) like API or so, But when i try to connect to the websockets it says the following error in the console tab in the browser

Firefox can’t establish a connection to the server at ws://server-ip/chat/socket.io/?EIO=4&transport=websocket&sid=QClYLXcK0D0sSVYNAAAM.

This is my frontend using socketio cdn

 <script src="https://cdn.socket.io/4.3.2/socket.io.min.js" integrity="sha384-KAZ4DtjNhLChOB/hxXuKqhMLYvx3b5MlT55xPEiNmREKRzeEm+RVPlTnAn0ajQNs" crossorigin="anonymous"></script>
var socket = io.connect('http://server-ip/chat/send/', {"path" : "/chat/socket.io"});

I set "path" here to the correct socket.io url, If i tried to remove it and just type the url it gives

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://37.76.245.93/socket.io/?EIO=4&transport=polling&t=NrcpeSQ. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

So i added it to redirect it to the correct url but it can't connect it using ws as shown above

I am using this command on server to run flask

gunicorn --worker-class eventlet -w 1 --bind 0.0.0.0:8000 --timeout 500 --keep-alive 500 wsgi:app

and this is my wsgi file

from chat import app
from dotenv import load_dotenv, find_dotenv
from flask_socketio import SocketIO
from messages.socket import socket_handle

load_dotenv(find_dotenv())
app = app(settings="chat.settings.dev")
socket = SocketIO(app, cors_allowed_origins=app.config['ALLOWED_CORS'])
socket_handle(socket)

The 'socket_handle' function just appends the join and message_handle functions with socket decorator to them, I think something is preventing the server to work on ws but i don't know why

I know that this need to be run as ASGI not WSGI but as socketio docs says i think using eventlet will solve this, But i also tried to replace my wsgi.py file to this

from chat import app
from dotenv import load_dotenv, find_dotenv
from flask_socketio import SocketIO
from messages.socket import socket_handle
from asgiref.wsgi import WsgiToAsgi

load_dotenv(find_dotenv())
apps = app(settings="chat.settings.dev")
socket = SocketIO(apps,  cors_allowed_origins=apps.config['ALLOWED_CORS'])
socket_handle(socket)
asgi_app = WsgiToAsgi(apps)

And when i run Gunicorn command i get this

gunicorn --worker-class eventlet -w 1 --bind 0.0.0.0:8000 --timeout 500 --keep-alive 500 wsgi:asgi_app

[2021-11-28 16:17:42 +0200] [39043] [INFO] Starting gunicorn 20.1.0
[2021-11-28 16:17:42 +0200] [39043] [INFO] Listening at: http://0.0.0.0:8000 (39043)
[2021-11-28 16:17:42 +0200] [39043] [INFO] Using worker: eventlet
[2021-11-28 16:17:42 +0200] [39054] [INFO] Booting worker with pid: 39054
[2021-11-28 16:17:47 +0200] [39054] [ERROR] Error handling request /socket.io/?EIO=4&transport=polling&t=NrcwBTe
Traceback (most recent call last):
  File "/root/.local/share/virtualenvs/chat-Tb0n1QCf/lib/python3.9/site-packages/gunicorn/workers/base_async.py", line 55, in handle
    self.handle_request(listener_name, req, client, addr)
  File "/root/.local/share/virtualenvs/chat-Tb0n1QCf/lib/python3.9/site-packages/gunicorn/workers/base_async.py", line 108, in handle_request
    respiter = self.wsgi(environ, resp.start_response)
TypeError: __call__() missing 1 required positional argument: 'send'
^C[2021-11-28 16:17:48 +0200] [39043] [INFO] Handling signal: int
[2021-11-28 16:17:48 +0200] [39054] [INFO] Worker exiting (pid: 39054)
[2021-11-28 16:17:48 +0200] [39043] [INFO] Shutting down: Master

I am using latest flask & socketio versions

AmrElsayed
  • 21
  • 7
  • First of all, Flask is not an ASGI framework, so stop trying to make ASGI work. That'll never work with current versions of Flask. Second, after you've added CORS to your Flask-SocketIO, what is the error that you get when the client connects via WebSocket? – Miguel Grinberg Nov 28 '21 at 19:44
  • I don't get the second question, I am using SocketIO on the frontend to connect to the websocket and i get the above error, can’t establish a connection to the server at ws://server-ip/chat/socket.io/?EIO=4&transport=websocket&sid=QClYLXcK0D0sSVYNAAAM. – AmrElsayed Nov 28 '21 at 21:15
  • when i connect via '''io.connect('http://server-ip/chat/send/', {"path" : "/chat/socket.io"});''' it redirects the request to ws://server-ip/chat/socket.io and then says failed – AmrElsayed Nov 28 '21 at 21:19
  • You need to look for actual details of the failure. When a request fails, the network tab and/or the console in your browser will show more details. In any case, my suggestion is that you don't customize the `path` of your Socket.IO endpoint until you get everything working. Once it works, you can try to move the endpoint to a different URL, but since this isn't working I think you should remove any possible side effects by using the defaults. – Miguel Grinberg Nov 29 '21 at 17:24
  • @miguel I customized the path because my server has more than application running, So in the main url i have Django app, and on that link /services/chat/ i have my flask app with his Gunicorn stuff, When i connect the network says 200 to the GET for that link ""http://server-ip/service/chat/socket.io/?EIO=4&transport=polling&t=Nri-dzG&sid=yAM3geeJBts6ZZcpAAAA"" and same request with options, But there is a waiting GET request to the same url with no response i guess it is still trying to get response, – AmrElsayed Nov 29 '21 at 18:38
  • And in console i get """can’t establish a connection to the server at ws://37.76.245.93/service/chat/socket.io/?EIO=4&transport=websocket&sid=yAM3geeJBts6ZZcpAAAA.""" – AmrElsayed Nov 29 '21 at 18:39
  • @Miguel the mention above didn't work – AmrElsayed Nov 30 '21 at 18:24
  • Remove all the custom path stuff and make it work that way, which is easier. Once you confirm the connection works, move the endpoint to the location that you want. – Miguel Grinberg Nov 30 '21 at 18:42
  • @Miguel The custom path is because the url of the Flask project not in the main url i added it to sub directory which is /service/chat/ because i have another application running on the server, If i removed the path it will not find socket.io because it will read it from www.server.com/socket.io which doesn't exist as i tried, But it's located in server.com/service/chat/socket.io, That's why i added a path – AmrElsayed Nov 30 '21 at 19:08
  • is there any Nginx configuration i have to add to make it work? – AmrElsayed Nov 30 '21 at 19:12
  • I've uploaded some screenshots for the network and console tabs here [link](https://imgur.com/a/WT5sfhC) – AmrElsayed Nov 30 '21 at 19:35
  • and this is a screenshot of my Nginx common.conf [link](https://imgur.com/a/RlWH36Y) – AmrElsayed Nov 30 '21 at 20:22
  • I made some changes to the Nginx as the above screenshot and now there is no error appears on the console or network or the Gunicorn, But it doesn't connect to the websocket, I have a print in join function on the server which is working locally but it doesn't work on the server, So i guess it's something related to the Nginx, Is there is something i miss in Nginx conf? – AmrElsayed Nov 30 '21 at 20:45
  • Did you read the documentation? There is an example nginx configuration there. – Miguel Grinberg Dec 01 '21 at 19:07
  • @Miguel Yes i did, And now i can get request response 101 so it connects successfully, And this is my network and console also that shows that socket var has connected = True, [link](https://imgur.com/a/MGdlVPx) But it doesn't actually go to 'join' function that is in my server that should receive request when user joins the socket, I made a print statement in order to detect that someone just connected but nothing appears on the server, It works locally with no problem i don't know why not in production – AmrElsayed Dec 02 '21 at 10:13
  • Oh i figured it out, Lol, it works now, in my socket views i had namespace = '/send/', So in frontend i had to change 'url/service/chat/send/' to 'url/send/' and it now works, Thanks @Miguel for your great help and following up – AmrElsayed Dec 02 '21 at 10:20

0 Answers0