• 技术文章 >web前端 >H5教程

    基于 WebSocket 构建跨浏览器的实时应用

    2016-05-17 09:08:22原创732
    Socket.IO 是一个功能非常强大的框架,能够帮助你构建基于 WebSocket 的跨浏览器的实时应用。支持主流浏览器,多种平台,多种传输模式,还可以集合 Exppress 框架构建各种功能复杂的实时应用。


    使用示例


    1、使用 Node HTTP 服务器


    服务端示例代码:


    var app = require('http').createServer(handler)

    , io = require('socket.io').listen(app)

    , fs = require('fs')

    app.listen(80);

    function handler (req, res) {

    fs.readFile(__dirname + '/index.html',

    function (err, data) {

    if (err) {

    res.writeHead(500);

    return res.end('Error loading index.html');

    }

    res.writeHead(200);

    res.end(data);

    });

    }

    io.sockets.on('connection', function (socket) {

    socket.emit('news', { hello: 'world' });

    socket.on('my other event', function (data) {

    console.log(data);

    });

    });

    客户端示例代码:



    2、使用 Express 3 框架


    服务端示例代码:


    var app = require('express')()

    , server = require('http').createServer(app)

    , io = require('socket.io').listen(server);

    server.listen(80);

    app.get('//m.sbmmt.com/m/', function (req, res) {

    res.sendfile(__dirname + '/index.html');

    });

    io.sockets.on('connection', function (socket) {

    socket.emit('news', { hello: 'world' });

    socket.on('my other event', function (data) {

    console.log(data);

    });

    });


    客户端示例代码:

     


    支持的传输


    为了给各个不同的浏览器提供实时连接,Socket.IO 选择在运行时会自动最有能力的运输模式,不影响 API 的使用。


    • WebSocket
    • Adobe Flash Socket
    • AJAX 长轮询
    • AJAX 多重流
    • iframe
    • JSONP 轮询


    支持的浏览器

    桌面端

    • Internet Explorer 5.5+
    • Safari 3+
    • Google Chrome 4+
    • Firefox 3+
    • Opera 10.61+


    移动端

    • iPhone Safari
    • iPad Safari
    • Android WebKit
    • WebOs WebKit

    立即下载   官方主页

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    上一篇:HTML5组件Canvas实现图像灰度化(步骤+实例效果) 下一篇:用于web应用数据管理和应用程序通讯的jQuery组件库
    PHP编程就业班

    相关文章推荐

    • html5离线存储有哪些• 深入解析asp.net中mvc4自定义404页面(分享)• h5新增标签audio与video的使用• 你值得了解的HTTP缓存机制(代码详解)• 使用HTML5 SVG绘制各种雪花图案

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网