1
私の目標は、Webページをいくつかのファイルで更新することです。ファイルを編集して保存すると、すぐにそのコンテンツがページに更新されて表示されます。ブラウザで常に更新されたファイルを表示するには？
私はsocket.ioを使用してこの問題を処理しています。しかし。私はそれにアプローチするためにコードを変更する必要があります。
::マイサーバー側のコード：
var PORT = 8001;
var io = require("socket.io").listen(PORT);
var fs = require("fs");
io.sockets.on('connection', function(socket) {
console.log("Connected!");
socket.emit('connected', { accept: true});
console.log("Trying to send a content file to client...");
fs.readFile("file.txt","UTF-8", function(err, data) {
if (err) throw err;
socket.emit("requestFile", data);
console.log("Conteúdo:", data);
})
});
console.log("Application has started! Port: " + PORT);
::マイページは
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://localhost:8001/socket.io/socket.io.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
.arquivo {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
width: 900px;
border: 2px solid black;
-moz-border-radius: 3px;
}
</style>
<script type="text/javascript">
console.log("Try to logon...");
var socket = io.connect("localhost", {"port" : "8001"});
socket.on("connected", function(data) {
console.log("Connected User?", data.accept);
});
//recebe o arquivo indefinidamente
var requestFile = socket.on("requestFile", function(data) {
$("#arquivoSaida").html(data + "<br/>");
console.log(data);
});
setInterval(requestFile, 200);
</script>
</head>
<body>
<h3 style="font: Arial, Verdana; font-size: 14px; font-weight: bold;">
File updated:
</h3>
<div id="arquivoSaida">
</div>
</body>
</html>
私は、サーバーにファイルを要求するために、200ミリ秒で火災にしたsetIntervalを使用していました。どのキューも大歓迎です。
ありがとうございます！
- ソリューションを使用して更新：
::私は私の元のコードからいくつかの変更を行いました。このソリューションはPuerkitoBioによって提供されました。ありがとう！更新
コード：
var PORT = 8001;
var io = require("socket.io").listen(PORT);
var fs = require("fs");
io.sockets.on('connection', function(socket) {
console.log("Connected!");
socket.emit('connected', { accept: true});
console.log("Trying to send the content to a client...");
console.log("dir", __dirname);
fs.watch(__dirname + "/arquivo.txt", function(event, filename) {
console.log("Event:", event);
if (event == "change") {
fs.readFile("arquivo.txt","UTF-8", function(err, data) {
if (err) throw err;
socket.emit("receiveFile", data);
console.log("Content:", data);
})
}
});
});
console.log("Application has started! Port: " + PORT);
ありがとう、PuerkitoBio。私はあなたに話をしてコードを修正しました。私はfs.watchFileの代わりにfs.watchを使っています。 – Ito
私にはうまく見えますが、それに応じてクライアント側を調整したと思います。ファイルの内容が大きい場合は、ストリーミングを検討することをお勧めします（ノードの外観を見てください）。ストリームクラス）。これ以外、これは正常に動作するはずです。 – mna