2017-05-09 109 views
0

我不是程序員... 我可以在node.js中創建一個websocket應用程序,它可以將圖像發送到borwser,但是我會有幾張圖像,有時會改變。例如, image1.jpg image2.jpg image3.jpg image4.jpg 我需要在瀏覽器中更新此圖像。通過使用node.js實現的websocket接收和更新圖像

我的應用程序現在只適用於一個圖像,沒有更新。 整個項目是聽到:https://github.com/akoscomp/imgstream 我這個代碼發佈圖像:

io.sockets.on('connection', function(socket){ 
fs.readFile(__dirname + '/image.jpg', function(err, buf){ 
    //it's impossible to ebed binary data 
    socket.emit('image', { image: true, buffer: buf.toString('base64') }); 
    console.log('image file is initialized: ' + __dirname + '/image.jpg'); 
});}); 

而且我可以檢查文件更新,但我不能自動在瀏覽器的更新:

var watch = require('node-watch'); 
watch('image.jpg', function(evt, filename) { 
    console.log(filename, ' changed.'); 
}); 

請幫助我自動執行映像更新。之後,我可能可以應用許多圖像的代碼。

回答

0

使用以下代碼更改圖像後即可發送圖像。

io.sockets.on('connection', function(socket) { 
    connections.push(socket); 
    console.log('Connected: %s sockets connected', connections.length); 

    // Diconnect 
    socket.on('disconnect', function(data) { 
    connections.splice(connections.indexOf(socket), 1); 
    console.log('Disconnected %s sockets connected', connections.length); 
    }); 

    fs.readFile(__dirname + '/image.jpg', function(err, buf) { 
    //it's impossible to ebed binary data 
    socket.emit('image', { image: true, buffer: buf.toString('base64') }); 
    console.log('image file is initialized: ' + __dirname + '/image.jpg'); 
    }); 
}); 


var watch = require('node-watch'); 

watch('image.jpg', function(evt, filename) { 
    if (evt === 'update') { 
    fs.readFile(__dirname + '/image.jpg', function(err, buf) { 
     for (var i = 0; i < connections.length; i++) { 
     //it's impossible to ebed binary data 
     connections[i].emit('image', { image: true, buffer: buf.toString('base64') }); 
     console.log('image file is initialized: ' + __dirname + '/image.jpg'); 
     } 
    }); 
    } 
}); 

您可以在https://github.com/yanalavishnu/imgstream

+1

感謝檢查完整的項目。這行得通。 – Akos

+0

我可以爲多個文件編寫代碼,現在我可以顯示自定義數量的圖像。 – Akos