socketio doesn't work anymore

[meetAndEgg]

I am trying to transform my socketIO project into a blueprint to merge it into a larger project. Before I transform it, the server works well, but after I transformed it following the Flask-SocketIO-Chat, it doesn't work anymore. The server can still run and accept the request from client and return a success code 200, but the binding functions to the routes will never be excuted.
My project structure

FlaskServer
├─ FlaskServer
│  ├─ CameraApp
│  │  ├─ PylonCamera.py
│  │  ├─ routes.py
│  │  └─ __init__.py
│  └─ __init__.py
└─ main.py

My code:

# -----------------main.py-----------------
from FlaskServer import create_app, socketio

app = create_app(debug=True)


if __name__ == '__main__':
    socketio.run(app, port=5000)

# -----------------FlaskServer/__init__.py-----------------
from flask import Flask
from flask_socketio import SocketIO

socketio = SocketIO()


def create_app(debug=True):
    """Create an application."""
    app = Flask(__name__)
    app.debug = debug
    # app.config['SECRET_KEY'] = 'secret!'

    from .CameraApp import camera_app
    app.register_blueprint(camera_app)

    socketio.init_app(app, cors_allowed_origins='*')
    return app
#  -----------------FlaskServer/CameraApp/__init__.py-----------------
from flask import Blueprint
from . import PylonCamera

camera_app = Blueprint('camera_app', __name__, url_prefix='/camera')
camera = PylonCamera.PylonCamera()

from . import routes

# -----------------FlaskServer/CameraApp/routes.py-----------------
from . import camera
from .. import socketio


@socketio.on('connect')
def connect():
    # doesn't excute when client ask for connect but the server returns 200 
    camera.init_cap()
    print(f'client {request.remote_addr}:{request.environ.get("REMOTE_PORT")} connect') 
...

When JS client trying to connect, server console print this:

(3784) wsgi starting up on http://127.0.0.1:5000
(3784) accepted ('127.0.0.1', 60458)
127.0.0.1 - - [07/Aug/2023 14:41:41] "GET /socket.io/?EIO=4&transport=polling&t=OdEkkGd HTTP/1.1" 200 330 0.000000
(3784) accepted ('127.0.0.1', 60459)
127.0.0.1 - - [07/Aug/2023 14:41:41] "POST /socket.io/?EIO=4&transport=polling&t=OdEkkGk&sid=YN1wxQ82Omwxol3IAAAA HTTP/1.1" 200 219 0.000000
(3784) accepted ('127.0.0.1', 60460)
127.0.0.1 - - [07/Aug/2023 14:41:41] "GET /socket.io/?EIO=4&transport=polling&t=OdEkkGl&sid=YN1wxQ82Omwxol3IAAAA HTTP/1.1" 200 233 0.000000
127.0.0.1 - - [07/Aug/2023 14:41:41] "GET /socket.io/?EIO=4&transport=websocket&sid=YN1wxQ82Omwxol3IAAAA HTTP/1.1" 200 0 0.004982

And JS client(io('http://127.0.0.1:5000/camera', { autoConnect: false, reconnection: false })) error:

Error
    at Proxy.onpacket (socket.js:466:29)
    at Emitter.emit (index.mjs:136:20)
    at manager.js:204:18

[miguelgrinberg]

Socket.IO does not use any Flask routes, so it makes no sense to create a blueprint for it. I suggest you remove the /camera path from the connection URL in the client, that is how you specify a Socket.IO namespace and has nothing to do with any routes you define in your Flask application or in any blueprints.

[meetAndEgg]

So can I delete camera_app = Blueprint('camera_app', __name__, url_prefix='/camera'), from .CameraApp import camera_app and app.register_blueprint(camera_app)? When I just remove the /camera path from the connection URL in the client, the camera module can work, but when I remove these codes (seems useless if I understand your meaning correctly), the module cannot work again. Here is the code after adjusted.

# -----------------main.py-----------------
from FlaskServer import create_app, socketio

app = create_app(debug=True)


if __name__ == '__main__':
    socketio.run(app, port=5000)

# -----------------FlaskServer/__init__.py-----------------
from flask import Flask
from flask_socketio import SocketIO

socketio = SocketIO()


def create_app(debug=True):
    """Create an application."""
    app = Flask(__name__)
    app.debug = debug
    # app.config['SECRET_KEY'] = 'secret!'
    socketio.init_app(app, cors_allowed_origins='*')
    return app
#  -----------------FlaskServer/CameraApp/__init__.py-----------------
from flask import Blueprint
from . import PylonCamera

camera = PylonCamera.PylonCamera()
from . import routes

# -----------------FlaskServer/CameraApp/routes.py-----------------
from . import camera
from .. import socketio


@socketio.on('connect')
def connect():
    # doesn't excute when client ask for connect but the server returns 200 
    camera.init_cap()
    print(f'client {request.remote_addr}:{request.environ.get("REMOTE_PORT")} connect') 
...

[meetAndEgg]

And I have another question. I register normal flask modules to the socketio server the same as the initial method I register the camera(socketio) modules.As you can see, I already set cors_allowed_origins='*' in the socketio, but when the js client try to connect server(using axios) by http, a CROS error arised in client, which never arise when I using flask app server. So I have to change the url to https, now the CROS error disappear, but the server gives a code 400, message Bad request version error and client gives a net::ERR_SSL_PROTOCOL_ERROR error.

[meetAndEgg]

I am a noob. If I am missing something very basic, please forgive my ignorance. Thanks a lot!

[meetAndEgg]

I have already solved theses problems!
First: I don't import the camera module to the socketio server when I delete the codes. So all I need to do is add from . import CameraApp in create_app function.
Second: It seems that the cors_allowed_origins='*' only applies to socketio and does not applies to flask app. I add from flask_cors import CORS // CORS(app) in the create_app function and it works now.