ファイル内容が変更されたときにブラウザが自動的にリロードされ、nodejsに保存されました

-1

私はnode.jsプロジェクトに取り組んでいます。私の要件は、私はブラウザ上のload.txtファイルにしたいです。このファイルを変更して保存すると、コンテンツが更新されるはずです。ブラウザは自動更新する必要があります。ファイル内容が変更されたときにブラウザが自動的にリロードされ、nodejsに保存されました

var app = require('express')(); 
    var http = require('http').Server(app); 
    var io = require('socket.io')(http); 

    index.js 
    app.get('/', function(req, res){ 
     res.sendFile(__dirname + '/demo.txt'); 
    }); 

    io.on('connection', function(socket){ 
     console.log('a user connected'); 
    }); 

    http.listen(3000, function(){ 
     console.log('listening on *:3000'); 
    }); 

    var io = require('socket.io')(80); 
    var fs = require('fs'); 

    fs.watchFile('message.text', (curr, prev) => { 
     console.log(`the current mtime is: ${curr.mtime}`); 
     console.log(`the previous mtime was: ${prev.mtime}`); 
     // file changed push this info to client. 
     io.emit('fileChanged', 'yea file has been changed.'); 
    }); 

    index.html 
    <script> 
     var socket = io(); 
    socket.on('fileChanged', function(msg){ 
     alert(msg); 
    });

出典

2017-07-26 Ramu

はどのようにして変更を保存していますか？ – ayxos

'x'が起きたときに、ブラウザでファイルを編集してサーバに送信しますか？ – Luca

.txt形式、上記のコードを使用してファイルを読み込んだ、ブラウザを自動更新する方法。 .txtファイルの内容を変更すると、変更を保存した後にブラウザに表示されるはずです。 – Ramu

-2

Ajaxを使用してファイルをポーリングします。サーバーは{changes: '{timestamp-of-file-modify}'}で応答することができます。最後に表示された変更時間が応答時間と異なるかどうかを確認します。

変更がある場合：window.location.reload

出典

2017-07-26 12:33:33 Justinas

あなたの言っているajax in nodejs – Ramu

WebSocketをを使用しているこれを行うための最善の方法。 WebSocketsで作業するための非常に優れたパッケージはSocket.ioで、chokidarやネイティブ関数fs.watchのようなものを使ってファイルの変更を見て、メッセージを出すことができます。

または、開発目的でのみこれを実行する場合は、これを行うための組み込み関数を持つwebpack、gulpまたは他のタスクランナーをチェックする必要があります。

出典

2017-07-26 12:42:53 gnuns

次の2つのアクションでこれを行うことができますまず第一に：サーバー側で

1.ウォッチファイルの変更。情報をクライアントにプッシュ

node.jsでファイルを見ることができます。

var app = require('express')(); 
var http = require('http').Server(app); 

app.get('/', function(req, res){ 
    res.sendFile(__dirname + '/cluster.json'); 
}); 

const io = require('socket.io')(http); 
io.on('connection',function (client) { 
    console.log("Socket connection is ON!"); 
}); 

http.listen(80, function(){ 
    console.log('listening on *:80'); 
}); 
var fs = require('fs'); 

fs.watchFile('cluster.json', function(curr, prev){ 
    // file changed push this info to client. 
    console.log("file Changed"); 
    io.emit('fileChanged', 'yea file has been changed.'); 
});

2.キャッチ "ファイル変更" 情報とクライアント側でページを更新

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Title</title> 

</head> 
<body> 
    <script type="text/javascript" src="node_modules/socket.io-client/dist/socket.io.js"></script> 
    <script> 
    var socket = io("http://localhost:80"); 
    socket.on('fileChanged', function(msg){ 
     alert(msg); 
    }); 
    </script> 
</body> 
</html>

出典

2017-07-26 12:50:45 hurricane

エラーioは機能しません。私は再びコードを投稿正しいですか？ – Ramu

@ハリケーンは – Luca

という意味でindex.htmlを書いているので、あなたのhtmlにsocket.ioクライアントを含める必要がありますか？ – Ramu

ファイル内容が変更されたときにブラウザが自動的にリロードされ、nodejsに保存されました

答えて

関連する問題