Flask socket(server-side) is not connecting with client-side (Javascript)

Question

The client-side isn't connecting with the server-side.

THE SERVER-SIDE CODE:

from flask import Blueprint, render_template
from hook.routes.auth import login_required
# from flask_socketio import emit, join_room, leave_room
from .. import socketio

chat = Blueprint('chat', __name__)

@chat.route('/')
@login_required
def index():
    """ chat page if user is logged in """
    return render_template('main/chat.html')


@socketio.on('connecting', namespace='/chat')
def connected(data):
    print("""

        connecting server-side...
        
        """)
    print(data)

THE CLIENT-SIDE CODEconsole.log("Javascript (chat-script) connected.")

document.addEventListener('DOMContentLoaded', () => {
    // Connect to Websocket
    var socket = io.connect(location.protocol + '//' + document.domain + ':' + location.port + '/chat');
    console.log("Starting sockets! " + location.protocol + '//' + document.domain + ':' + location.port + '/chat')
    // When connected
    socket.on('connect', () => {
        console.log("Connecting script...");
        socket.emit('connecting', {'data': 'I\'m connected!'});
    })
});

No errors but the server-side is not receiving the data from the client-side.

I have added the text already, help? – Emmanuel Oloyede Sep 24 '20 at 16:27 — Emmanuel Oloyede, Sep 24 '20 at 16:27
Does it output `Connecting script...`? – Kruspe Sep 24 '20 at 22:20 — Kruspe, Sep 24 '20 at 22:20
Yes, it does. The javascript is connecting. – Emmanuel Oloyede Sep 24 '20 at 23:43 — Emmanuel Oloyede, Sep 24 '20 at 23:43

score 0 · Answer 1 · answered Sep 25 '20 at 00:13

Changing the name of the event to something else will make the code work. I changed the event name "connecting" to something else("connected") and even tried other words. It still worked.

CLIENT-SIDE CODE:

console.log("Javascript (chat-script) connected.")

document.addEventListener('DOMContentLoaded', () => {
    // Connect to Websocket
    var socket = io.connect(location.protocol + '//' + document.domain + ':' + location.port + '/chat');

    // When connected
    socket.on('connect', () => {
        console.log("Connecting script...");
        socket.emit('connected', {'data': 'I\'m connected!'});
    });
});

SERVER SIDE CODE:

from flask import Blueprint, render_template
from hook.routes.auth import login_required
# from flask_socketio import emit, join_room, leave_room
from .. import socketio

chat = Blueprint('chat', __name__)

@chat.route('/')
@login_required
def index():
    """ chat page if user is logged in """
    return render_template('main/chat.html')


@socketio.on('connected', namespace='/chat')
def connected(data):
    print("""
        connecting server-side...
        """)
    print(data['data'])

Now, it works as it should.

Flask socket(server-side) is not connecting with client-side (Javascript)

1 Answers1