Javascript中数据实时推送

复制代码
数据变化后前端需要更新,有几种方式:(参考http://www.xiaocai.name/post/cf1f9_7b6507)

1.利用setInterval函数,每隔n秒去异步拉取数据。对数据实时性要求不高时可用。

2.Ajax轮询方式推送数据。缺点是服务端需要在死循环中反复查询数据库。(还没有试过这种方式)

3. 利用websocket推送数据,这是HTML5提供的方法,所以只能支持HTML5标准的浏览器。这种方式可以利用socket.io来实现。

简介一个利用Nodejs和socket.io实现的即时通信的例子,亲测可用。

原文地址:http://blog.sina.com.cn/s/blog_68693f9801010xck.html

嘿嘿,费话就不多说了,先来说一个WebSocket的环境配置,用的是node.js和Socket.IO
首先需要安装node.js,很简单
nodejs下载地址
下载完成后双击安装
CMD打开命令窗口,指定到nodejs的安装目录。
安装Socket.IO也很容易,一条语包搞定,
npm install socket.io,等待安装完成就可以
WebSocket实例-nodejs和socket.io
在nodejs安装目录下,新建http.js(文件名任取),代码如下:
var fs = require('fs')
    , http = require('http')
    , socketio = require('socket.io');
 
var server = http.createServer(function(req, res) {
    res.writeHead(200, { 'Content-type': 'text/html'});
    res.end(fs.readFileSync(__dirname + '/index.html'));
}).listen(8888, function() {
    console.log('Listening at: http://localhost:8888');
});
 
socketio.listen(server).on('connection', function (socket) {
    socket.on('message', function (msg) {
        console.log('Message Received: ', msg);
        socket.broadcast.emit('message', msg);
    });
});
再新建一个index.html,代码如下:
<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <script src="/socket.io/socket.io.js"></script>
    <script>
        $(function(){
            var iosocket = io.connect();
 
            iosocket.on('connect', function () {
                $('#incomingChatMessages').append($('<li>Connected</li>'));
 
                iosocket.on('message', function(message) {
                    $('#incomingChatMessages').append($('<li></li>').text(message));
                });
                iosocket.on('disconnect', function() {
                    $('#incomingChatMessages').append('<li>Disconnected</li>');
                });
            });
 
            $('#outgoingChatMessage').keypress(function(event) {
                if(event.which == 13) {
                    event.preventDefault();
                    iosocket.send($('#outgoingChatMessage').val());
                    //$('#incomingChatMessages').append($('<li></li>').text($('#outgoingChatMessage').val()));
     
复制代码

原文链接:https://blog.csdn.net/lycjiayou/article/details/25284205

posted @   大da脸  阅读(2359)  评论(0编辑  收藏  举报
编辑推荐:
· PostgreSQL 和 SQL Server 在统计信息维护中的关键差异
· C++代码改造为UTF-8编码问题的总结
· DeepSeek 解答了困扰我五年的技术问题
· 为什么说在企业级应用开发中,后端往往是效率杀手?
· 用 C# 插值字符串处理器写一个 sscanf
阅读排行:
· [翻译] 为什么 Tracebit 用 C# 开发
· 腾讯ima接入deepseek-r1,借用别人脑子用用成真了~
· Deepseek官网太卡,教你白嫖阿里云的Deepseek-R1满血版
· DeepSeek崛起:程序员“饭碗”被抢,还是职业进化新起点?
· RFID实践——.NET IoT程序读取高频RFID卡/标签
点击右上角即可分享
微信分享提示