使用node.js、node-formidable和socket.io将上传进度更新发送给客户端

5

我的代码展示了一个简单的上传表单(使用node-formidablenode.js)。我使用socket.io来更新客户端它当前上传文件的进度。 我的问题是我目前将进度更新广播给所有客户端。 例如,如果我使用客户端A开始上传,然后使用客户端B连接到网站,客户端B将看到与客户端A完全相同的进度条。通常情况下,客户端A和客户端B应该是不同的,具有各自的进度条,仅链接到它们各自的上传。

这是我的app.js文件

// Required modules
var formidable = require('formidable'),
    http = require('http'),
    util = require('util'),
    fs = require('fs-extra');

// Path to save file, server side
var savePath = "./uploadedFiles/";

// Loading index.html
var server = http.createServer(function(req, res) {
    // Form uploading Process code
    //Upload route
    if (req.url == '/upload' && req.method.toLowerCase() == 'post') {
        // creates a new incoming form. 
        var form = new formidable.IncomingForm();

        // set the path to save the uploaded file on server
        form.uploadDir = savePath;

        // updating the progress of the upload
        form.on('progress', function(bytesReceived, bytesExpected) {
            io.sockets.in('sessionId').emit('uploadProgress', (bytesReceived * 100) / bytesExpected);
        });

        // parse a file upload
        form.parse(req, function (err, fields, files) {
            res.writeHead(200, { 'content-type': 'text/plain' });
            res.write('Upload received :\n');
            res.end(util.inspect({ fields: fields, files: files }));
        });
        form.on('end', function (fields, files) {
            /* Temporary location of our uploaded file */
            var temp_path = this.openedFiles[0].path;
            /* The file name of the uploaded file */
            var file_name = this.openedFiles[0].name;
            /* Files are nammed correctly */
            fs.rename(temp_path, savePath + file_name, function(err) {
                if ( err ) console.log('ERROR: ' + err);
            });
        });
        return;
    }

    fs.readFile('./index.html', 'utf-8', function(error, content) {
        res.writeHead(200, {"Content-Type": "text/html"});
        res.end(content);
    });
});

// socket.io
var io = require('socket.io').listen(server);

io.on('connection', function (socket) {
  socket.join("sessionId");
});

server.listen(8080);

这是我的index.html文件

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>Socket.io</title>
    </head>

    <body>
        <h1>Test d'upload</h1>

        <script src="/socket.io/socket.io.js"></script>
        <script>
            var socket = io.connect('http://localhost:8080');
            socket.on('uploadProgress' , function (progress){
                document.getElementById("currentProgress").value = progress;
            });
        </script>

        <form action="/upload" method="post" enctype="multipart/form-data">
        <input type="file" name="upload" multiple="multiple"><br>
        <input type="submit" value="Upload">
        </form>

        <p><progress id="currentProgress" value="0" max="100"></progress></p>
    </body>
</html>

我没有比这更多的代码了。我刚开始接触node.js和socket.io,对它们之间以及客户端和服务器之间的交互不是很清楚。
我应该如何修改我的代码,才能只更新正确的客户端?
无论如何,非常感谢您的时间。
1个回答

1

一个建议 有一种基本的方法

socketIO.sockets.socket(this.socketid).emit(<event>, dataObj);

如果你的函数在套接字代码内部...否则我经常会这样做。
connection.query("select socketid from websocket_sessions  where user_id=" + data.form.user_id, function(err, users) {
  socketIO.sockets.socket(users[0].socketid).emit(<event>, dataObj);
});

我一直在更新的地方或者一个


我尝试在我的代码中使用它,但它没有起作用。你如何获取用户ID?你有一个适合我的代码的简单示例吗?谢谢。 - David Gourde

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接