Nodejs不定時接收後端傳送的訊息
阿新 • • 發佈:2019-03-03
場景:
1,在一次微信餐飲開發過,需要及時知道當前流量有多少客戶。這個可以即時知道準備多少食材及座次容量。
2,一般這種情況,我們使用js輪循。js輪循的
setInterval執行時一長,
每秒呼叫一次顯示時間的Function達到動態的效果,但是執行一會瀏覽器卡死。所以考慮使用nodejs的 socketJs 搭建長連線。
開始:
最初想法,原計劃在server端,做一個迴圈
setInterval定時器,讀伺服器端的log.txt檔案。如果此檔案內容修改了,就向客戶端輸出。條件為否就輪循。最初未使用socket.在未使用socket時遇到坑,就是
錯誤程式碼:
response.writeHead(200, { 'Content-type': 'text/html' });
setInterval(function () {
fs.readFile('log.txt', function (err, data) {
var mytime = new Date().toLocaleTimeString(); //獲取當前時間
if (data.toString()) {
console.log('outer success ' + mytime);
console.log(data.toString());
response.write(data.toString());
response.end();
}
});
}, 1000);
報錯:
Cannot set headers after they are sent to the client。。。
就是在response.write(data.toString()); 報錯。網上查好像就說response.write只能執行一次,迴圈就報錯。按百度的修改下調nodejs的版本號和在response.write下行寫上return。都不成功。
後面想到使用
socket.io,在客戶端使用socket輸入問題就解決了。
插入一步:
安裝環境介紹:
npm install express
npm install socket
原始碼:
server.js
var express = require('express');
var app = express();
var http = require('http').Server(app); //將express註冊到http中
var io = require('socket.io')(http);
var fs = require("fs");
app.get('/', function (req, response) {
response.sendFile(__dirname+"/index.html"); //載入index view
// response.writeHead(200, {'Content-Type': 'text/html; charset=utf-8'});
//response.writeHead(200, { 'Content-type': 'text/html' });
// io.on('connection', function (socket) {
// //new addition
// });
var last_msg ;
setInterval(function () {
fs.readFile('log.txt', function (err, data) {
var mytime = new Date().toLocaleTimeString(); //獲取當前時間
new_msg = data.toString();
if (new_msg) {
console.log('outer success ' + mytime);
console.log(new_msg);
if (last_msg != new_msg) {
io.emit("message",mytime+" : "+ new_msg) //將新訊息廣播出去
last_msg = data.toString();
}
}
});
}, 1000);
});
//啟動監聽,監聽3000埠
http.listen(8080, function () {
console.log('listening on *:8080');
return ;
});
index.html
<!doctype html>
<html>
<head>
<title>Socket.IO chat</title>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="/socket.io/socket.io.js"></script>
</head>
<body>
<h1>後端向前端單向傳訊息</h1>
<ul id="messages"></ul>
</body>
<script>
var socket = io();
//傳送暱稱給後端
// socket.emit("join", name)
//接收到伺服器發來的message事件
socket.on("message", function (msg) {
$('#messages').append($('<li>').text(msg));
})
</script>
</html>
說明:
var socket = io();
//傳送暱稱給後端
//socket.emit("join", name)
//只單向接收到伺服器發來的message事件
socket.on("message", function (msg) {
$('#messages').append($('<li>').text(msg));
})
log.txt檔案為伺服器端的檔案,通過手工修改,儲存即可。
演示:
根據上面的文件及演示,可以考慮使用資料庫表變動將資訊通知到前端。省。