如何访问使用 websockets 发送的烧瓶中的 formData？Flask-SocketIO答案

【问题标题】：How to access formData in flask sent using websockets?Flask-SocketIO如何访问使用 websockets 发送的烧瓶中的 formData？Flask-SocketIO
【发布时间】：2016-08-08 05:06:35
【问题描述】：

如何使用 Web 套接字访问发送到 Flask 的表单数据？我在谷歌浏览器开发者工具->控制台中收到无效的帧头。

从我的 javascript 代码中提取：

var form_data = new FormData($('#my_form')[0]); 

socket.emit('handle_form',{data:form_data});

如何从烧瓶访问 my_form 中的“标题”字段？

request.form 抛出同样的错误“Invalid frame header”

还有一个问题，使用 web sockets 提交表单并完全替代 ajax 是否好？

【问题讨论】：

那么在上传图片时如何将文件保存在烧瓶中？无法执行 request.files.getlist()。有什么解决办法吗？

标签： javascript flask websocket socket.io flask-socketio

【解决方案1】：

您应该构建一个普通的字典并发送它，而不是发送 FormData 对象，这是一个仅限客户端的构造，因为在 Socket.IO 中来回传输的所有数据都被序列化为 JSON。

然后在服务器上，您将拥有一个作为参数发送给您的套接字回调函数的 dict。请参阅此example，了解如何将表单数据发送到服务器。

【讨论】：

如何将要上传的文件添加到javascript，以便可以使用flask文件对象访问？
再一次，不要从表单提交的角度去想，那是一个 HTTP 的东西，当你使用 WebSocket 或 SocketIO 时是不存在的。如果您想发送文件，只需在emit 调用中发送数据即可。
同样的事情，对不起，我是初学者，但无法弄清楚如何在 emit 中发送文件！因为在使用 ajax 时，我使用了 javascript 的 formData。
浏览器在通过 HTTP 发送文件时做了很多工作。然而，对于 WebSocket，你得到的只是一个用于写入数据的通信通道。如果要发送文件，则需要在 javascript 中读取文件，然后将这些内容包含在您发送的有效负载中。为什么不直接使用 ajax 调用来发送文件？除非您必须经常这样做，否则使用 Socket.IO 并没有真正的好处。
没想到ajax和socketio一起用。再次感谢 :) 在实时聊天的背景下，让用户也分享图像是什么？单独的ajax调用来上传图像并在聊天中发出文本？这就是我的情况。

【解决方案2】：

这不像Flask-SocketIO 工作。

当您socket.emit 某事时，您会通过回调处理它。

@socketio.on('handle_form')
def handle_form_callback(data):
    print('received message: ' + data)

在这种情况下，您没有request.form。

它可以作为表单提交的替代品，但我认为它不是一个好的替代品。 Websockets 不是无状态的，它们难以扩展并且本质上绑定到服务器。当然，它有一些变通方法，但它不像有详细记录的 HTTP 服务器缩放。

【讨论】：

那么在上传图片时如何将文件保存在烧瓶中？无法执行 request.files.getlist()。有什么解决办法吗？
可以通过websocket将数据作为二进制字符串发送，但我不推荐。它不支持分段上传之类的东西。使用普通的 HTTP POST 来完成。