Flask-socketio部署至Glitch后WebSocket无法连接问题咨询

核心问题点 #

你现在遇到的问题由4个独立错误共同导致：

• 你修改后的gevent版本代码逻辑顺序完全错误：在初始化SocketIO实例之前就启动了原生WSGIServer，serve_forever()是阻塞方法，后续SocketIO初始化、事件注册、服务启动的代码永远不会执行，服务根本没有挂载WebSocket路由。
• Glitch平台不支持硬写5000端口：平台会动态分配服务监听端口，通过PORT环境变量传递给应用，硬写端口会导致平台反向代理无法转发请求到你的服务。同时服务必须监听0.0.0.0地址，不能只监听本地回环127.0.0.1。
• 客户端代码硬编码了http://localhost:5000连接地址，部署到Glitch后服务域名是Glitch分配的二级域名，地址不匹配+跨域限制会直接导致连接失败。另外你贴的客户端JS代码存在语法错误，connect事件的回调函数缺少闭合括号，会直接阻断JS执行。
• 生产环境没有显式指定SocketIO的异步模式，也没有正确关闭debug模式，debug模式的自动重载逻辑会频繁打断WebSocket长连接。

分步修复操作 #

1. 补全依赖 #

在项目requirements.txt中添加完整的生产依赖，避免缺少WebSocket支持库：

flask
flask-socketio
gevent
gevent-websocket

2. 重写正确的服务端代码 #

调整代码执行顺序，适配Glitch平台的环境变量，关闭debug模式，放开跨域限制：

import os
from flask import Flask, render_template, send_from_directory
from flask_socketio import SocketIO, emit

app = Flask(__name__, static_url_path='', static_folder="static/")
# 显式指定gevent异步模式，放开跨域限制
socketio = SocketIO(app, async_mode='gevent', cors_allowed_origins="*")

@socketio.on('connect')
def test_connect():
    print("socket connected")

if __name__ == '__main__':
    # 读取平台分配的端口，本地调试默认回退到5000
    listen_port = int(os.environ.get('PORT', 5000))
    # 监听0.0.0.0允许外部代理访问，关闭debug模式
    socketio.run(app, host='0.0.0.0', port=listen_port, debug=False)

不要额外引入原生gevent的WSGIServer手动启动，socketio.run()会自动基于你指定的async_mode启动适配了WebSocket的gevent服务，手动启动原生WSGI服务会丢失WebSocket能力。

3. 修正客户端连接代码 #

不要硬编码服务地址，使用相对路径自动适配当前访问域名，同时补上缺失的语法括号，配置传输策略优先使用WebSocket：

// 不写死地址，自动匹配当前域名端口，本地、Glitch环境通用
const socket = io({
  transports: ['websocket', 'polling']
});
socket.on('connect', () => {
  console.log('connected!');
});

4. 配置Glitch启动命令 #

在项目根目录新建glitch.json文件，明确告诉Glitch项目启动命令，避免平台自动识别错误：

{
  "start": "python main.py"
}

如果你的服务端文件名不是main.py，替换成对应的文件名即可。

验证结果 #

完成以上修改后重新触发Glitch部署，启动日志中不会再出现WebSocket transport not available的警告，打开网页后控制台会正常打印connected!，服务端日志同步输出socket connected，所有emit通信逻辑即可恢复正常。

内容的提问来源于stack exchange，提问作者Raj jaiswal