使用 Websockets 和 Nodejs 上传文件
Posted
技术标签:
【中文标题】使用 Websockets 和 Nodejs 上传文件【英文标题】:Upload Files with Websockets and Nodejs 【发布时间】:2014-01-04 02:45:29 【问题描述】:我正在尝试实现一个文件上传器,其中 html 输入文件由 WebSocket 发送到 Nodejs 服务器。
尝试从 HTML 的 FileReader API 读取 BLOB 和二进制字符串中的文件,并将其发送到 Nodejs 服务器,以便将其写入服务器中的文件。在 Nodejs 部分尝试使用 ascii 或 base 64 编码的 createWriteStream 和 writeFile。
服务器中保存的文件仍然无法正常工作。
我错过了什么吗?
谢谢
更新
客户
var uploader = $("#uploader"),
files = uploader.prop('files'),
file_reader = new FileReader();
file_reader.onload = function(evt)
socketClient.write(
'action': 'ExtensionSettings->upload',
'domain': structureUser.domain,
'v_id': ext,
'file': file_reader.result
);
;
file_reader.readAsDataURL(files[0]);
//readAsDataURL
uploader.replaceWith(uploader.clone());
服务器
var stream = fs.createWriteStream("file");
stream.once("open", function()
stream.write(msg.file, "base64");
stream.on('finish', function()
stream.close();
);
);
【问题讨论】:
请将客户端和服务器代码发给我们,没有它你很难猜出你做错了什么! 你能在服务器上抓包吗? 简单的方法是在客户端使用 dataURL 翻录到 base64 并将该 b64 字符串发送到您将 atob(str.split(",")[1]) 写入文件的节点使用二进制模式(不是 uft8 或 base64)。如果你变得更硬核并且只需要支持更新的浏览器,你实际上可以使用 Socket.send() developer.mozilla.org/en-US/docs/Web/API/WebSocket#send() 发送一个未添加的二进制 blob @user2448953 对于它的价值,您可以考虑使用 BinaryJS (github.com/binaryjs/binaryjs) 来设置您可以更轻松地读取/写入的流。其中一个示例包括完全按照您在此处所做的操作。 同意布拉德的观点,binaryjs 做的完全一样。您正在尝试从头开始编写代码,然后对其进行调试。 【参考方案1】:.readAsDataURL() 返回格式为 data:MIMEtype;base64,.... 的字符串 您应该删除逗号之前的部分,因为它不是 base64 编码文件的一部分,它是服务数据
【讨论】:
【参考方案2】:考虑在 websocket 使用的不同端口上启动一个单独的 http 服务器,然后通过表单中的传统 post 操作上传文件。返回状态码 204(无内容)可确保浏览器在发布操作后不会挂起。服务器代码假定目录“上传”已经存在。这对我有用:
客户
<form method="post" enctype="multipart/form-data" action="http://localhost:8080/fileupload">
<input name="filename" type="file">
<input type="submit">
</form>
服务器
http = require('http');
formidable = require('formidable');
fs = require('fs');
http.createServer(function (req, res)
if (req.url === '/fileupload')
var form = new formidable.IncomingForm();
form.parse(req, function (err, fields, files)
var prevpath = files.filename.path;
var name = files.filename.name;
var newpath = './upload/' + name;
var is = fs.createReadStream(prevpath);
var os = fs.createWriteStream(newpath);
// more robust than using fs.rename
// allows moving across different mounted filesystems
is.pipe(os);
// removes the temporary file originally
// created by the post action
is.on('end',function()
fs.unlinkSync(prevpath);
);
// prevents browser from hanging, assuming
// success status/processing
// is handled by websocket based server code
res.statusCode = 204;
res.end();
);
)
.listen (8080);
【讨论】:
如果没有任何外部 nodejs 库,这将如何完成?【参考方案3】:当您在 nodejs 中流式传输数据时,您不使用 write(),而是使用 pipe()。 因此,一旦您像以前一样拥有写入流: var stream = fs.createWriteStream("file"); 然后你 pipe() 到它,如下所示: sourcestream.pipe(stream); 但是由于文件是通过 Internet 传输的,因此您的文件将以数据包的形式发送,因此它不会一次全部到达,而是分段到达,您必须使用缓冲区数组并手动计算数据块。
您可以在此处了解详细信息: http://code.tutsplus.com/tutorials/how-to-create-a-resumable-video-uploade-in-node-js--net-25445
还有一个可用的模块非常易于使用,并且可能是您想要的: https://github.com/nkzawa/socket.io-stream
如果您不一定关心通过套接字,您也可以在客户端脚本中使用 ajax 表单 POST 使用服务器上的强大模块来处理表单上传:https://github.com/felixge/node-formidable
【讨论】:
以上是关于使用 Websockets 和 Nodejs 上传文件的主要内容,如果未能解决你的问题,请参考以下文章
通过 Websockets 在 Nodejs 和 Python 之间进行通信
端口 34037 已在使用 Heroku + Nodejs + Express + WebSockets