Javascript 使用React或JS和WebSocket上传文件的最佳方式是什么？

我是新来的。 我做了一个文件上传功能。 它适用于较小的文件大小，但有些文件不适合它。 所以我想就正确的方法提出一些建议。该项目通过WebSocket和另一个后端软件（基于php）工作，因此我们需要采用这种架构/风格

我是如何做到的：

选择文件后，我执行以下操作：

作为下一步，我将通过WebSocket发送此base64原始数据（reader.result）

在后端，我分割这些数据，进行一些验证，将原始数据（在base64_解码后）保存到文件中，并将其写入数据库

所有这些都可以完美地工作，所以大多数情况下没有问题，但有些文件工作不好。 我想知道为什么。正如我所分析的，websocket的框架可能很大，文件也因此无法拆分。所以问题不在于文件大小。而且，并非所有的文件都有很大的大小。也许，这是一个主要的逻辑问题

是否可以将base64原始数据发送到后端，然后手动将其写入文件和数据库？

---

或者我需要创建另一个新端点，类似于POST查询的RestFull API访问？在“无关于上载”，仅关于文件选择。谷歌有不同的结果，那么什么是最好的方法呢？

为什么要使用web套接字，而不仅仅是普通的HTTP PUT？当你可以发送二进制数据时，为什么你要使用base64来实现这一点，从而增加了33%的大小开销和额外的CPU？>为什么你要使用web套接字来实现这一点，因为这个项目有这样的体系结构，而且是在我之前完成的（3个不同的前端应用程序和一个后端应用程序，所有数据都通过WebSockets传输），所以，与添加两行代码相比，您更愿意编写更多的代码，只是以非标准方式处理文件上传，而不需要浏览器进行优化，对您的用例没有任何好处？这听起来是个坏主意。即使您确实通过Web套接字发送，为什么不使用二进制？

为什么要使用base64

React在选择此格式的文件后显示它。如果你们能给我更多更好的方式，我很乐意知道。我怀疑React是在制造这种限制。根据您的代码，在我看来，您读取的文件是base64（

readAsDataURL（）

），但缺少该部分代码，因此很难确定。与其做所有这些，不如将对该文件的引用用作普通的请求主体<代码>获取（'/upload'，{method'PUT'，body:file}）然后，客户端就完成了。服务器端很轻松

$\u文件

。为什么要为此使用web套接字，而不仅仅是普通的HTTP PUT？当你可以发送二进制数据时，为什么你要使用base64来实现这一点，从而增加了33%的大小开销和额外的CPU？>为什么你要使用web套接字来实现这一点，因为这个项目有这样的体系结构，而且是在我之前完成的（3个不同的前端应用程序和一个后端应用程序，所有数据都通过WebSockets传输），所以，与添加两行代码相比，您更愿意编写更多的代码，只是以非标准方式处理文件上传，而不需要浏览器进行优化，对您的用例没有任何好处？这听起来是个坏主意。即使您确实通过Web套接字发送，为什么不使用二进制？

为什么要使用base64

React在选择此格式的文件后显示它。如果你们能给我更多更好的方式，我很乐意知道。我怀疑React是在制造这种限制。根据您的代码，在我看来，您读取的文件是base64（

readAsDataURL（）

），但缺少该部分代码，因此很难确定。与其做所有这些，不如将对该文件的引用用作普通的请求主体<代码>获取（'/upload'，{method'PUT'，body:file}）然后，客户端就完成了。服务器端很轻松<代码>$\u文件。

let reader = new FileReader();
reader.onloadend = () => {
              this.setState({
                avatarPreview: reader.result,
                enableSave: true,
              });
}