Flask - SocketIO hidden behind reverse proxy with Nginx

Question

I want to integrate Flask-SocketIO with my Flask project. My app is running behind a Nginx reverse proxy:

location /plivo_api{
       rewrite ^/plivo_api(.*) /$1 break;
       proxy_pass http://127.0.0.1:8090;
}

So I undestand all trafic received in the /plivo_api will be rewrited as "/" port 8090. This part work well.

The problem starts when I want to connect to the socket. Direct connection to socket has no problem.

# all those examples work
# from localhost
var socket = io.connect()
var socket = io.connect('http://localhost:8090/')
# running the app out of the reverse proxy
var socket = io.connect('http://my_server:8090/')

But throught Nginx I cannot connect

# Bad Gateway
var socket = io.connect('http://my_server/plivo_api')

Question is Do I'm missing something to connect to my socketio app or there's something extra to add to Nginx config ?

The flask app code with socketio integration looks like

# this code work well, the flask app and socket io
# problem must be in Ngin settings.
The flask app code with socketio integration looks like 
from flask import Flask, render_template
from flask_socketio import SocketIO, emit

HOST = '127.0.0.1'
PORT = 8090

app = Flask(__name__)
app.config['SECRET_KEY'] = 'secret'
app.config['DEBUG'] = True
app.config['SERVER_NAME'] = f'{HOST}:{PORT}'
socketio = SocketIO(app)

@app.route('/')
def index():
    return render_template('index.html')

if __name__ == '__main__':
    socketio.run(app, port=PORT, host=HOST)

score 8 · Accepted Answer · answered Apr 13 '18 at 15:24

You need to create a special location block in nginx for the Socket.IO endpoint. You can't use a regular URL like you do for your HTTP routes.

The documentation has an example:

server {
    listen 80;
    server_name _;

    location /socket.io {
        include proxy_params;
        proxy_http_version 1.1;
        proxy_buffering off;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "Upgrade";
        proxy_pass http://127.0.0.1:5000/socket.io;
    }
}

Flask - SocketIO hidden behind reverse proxy with Nginx

1 Answers1