用JavaScript绘制流数据图表
我在node.js中编写了一个小代码，用于运行web服务器，并向客户端浏览的html文件发送一个由10个数字组成的序列。下面您可以找到node.js代码和html代码 index.js：用JavaScript绘制流数据图表,javascript,html,node.js,charts,Javascript,Html,Node.js,Charts,我在node.js中编写了一个小代码，用于运行web服务器，并向客户端浏览的html文件发送一个由10个数字组成的序列。下面您可以找到node.js代码和html代码 index.js： var app = require('express')(); var http = require('http').Server(app); var io = require('socket.io')(http); // // load the html file app.get('/', function(
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
//
// load the html file
app.get('/', function(req, res){
res.sendFile(__dirname + '/index.html');
console.log(__dirname);
});
//
// 1st attempt of socket
io.on('connection', function(socket){
// print message to the server
console.log('Yay, connection was recorded');
var i = 0;
var text = "";
while (i < 10) {
text = "The number is " + i + "\r\n";
console.log(text);
//emit message to all front-end clients
io.emit('chat message', text);
i++;
}
//handling disconnects
socket.on('disconnect', function() {
io.emit('chat message', 'some user disconnected');
});
});
http.listen(3000, function(){
console.log('listening on *:3000');
});
var-app=require（'express'）（）；
var http=require（'http'）。服务器（应用程序）；
var io=require（'socket.io'）（http）；
//
//加载html文件
app.get（'/'，函数（req，res）{
res.sendFile（uu dirname+'/index.html'）；
console.log（uu dirname）；
});
//
//第一次尝试插座
io.on（'连接'，函数（套接字）{
//将邮件打印到服务器
log（'是的，连接被记录了'）；
var i=0；
var text=“”；
而（i<10）{
text=“编号为“+i+”\r\n”；
console.log（文本）；
//向所有前端客户端发出消息
io.emit（'聊天信息'，文本）；
i++；
}
//处理断开连接
socket.on（'disconnect'，function（））{
io.emit（'chat message'，'some user disconnected'）；
});
});
http.listen（3000，函数（）{
console.log（'监听*：3000'）；
});
<!doctype html>
<html>
<head>
<title>Socket.IO chat</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font: 13px Helvetica, Arial; }
form { background: #000; padding: 3px; position: fixed; bottom: 0; width: 100%; }
form input { border: 0; padding: 10px; width: 90%; margin-right: .5%; }
form button { width: 9%; background: rgb(130, 224, 255); border: none; padding: 10px; }
#messages { list-style-type: none; margin: 0; padding: 0; }
#messages li { padding: 5px 10px; }
#messages li:nth-child(odd) { background: #eee; }
</style>
</head>
<script src="/socket.io/socket.io.js"></script>
<script src="https://code.jquery.com/jquery-1.11.1.js"></script>
<script type="text/javascript" src="/smoothie.js"></script>
<script>
$(function () {
var socket = io();
$('form').submit(function(){
socket.emit('chat message', $('#m').val());
$('#m').val('');
return false;
});
socket.on('chat message', function(msg){
$('#messages').append($('<li>').text(msg));
});
});
</script>
<body>
<ul id="messages"></ul>
</body>
</html>
Socket.IO聊天
*{边距：0；填充：0；框大小：边框框；}
正文{字体：13px Helvetica，Arial；}
表单{background:#000；填充：3px；位置：固定；底部：0；宽度：100%；}
表单输入{边框：0；填充：10px；宽度：90%；右边距：5%；}
窗体按钮{宽度：9%；背景：rgb（130224255）；边框：无；填充：10px；}
#消息{列表样式类型：无；边距：0；填充：0；}
#消息li{padding:5px 10px；}
#留言李：第n个孩子（奇数）{背景：#eee；}
$（函数（）{
var socket=io（）；
$（'form'）。提交（函数（）{
emit（'chat message'，$（'#m'）.val（））；
$（'m'）.val（''）；
返回false；
});
socket.on（'chat message'，函数（msg）{
$（“#消息”）.append（$（“”）.text（msg））；
});
});
您有什么建议吗？既然您可以加载页面，您的Web服务器配置应该可以。但请尝试检查smoothie.js文件权限。确保Web服务器可以访问它。如果不起作用，请显示您的Web服务器日志。如果它与index.html位于同一目录中，则需要删除正斜杠-->