web即时通信技术

ajax jsonp polling

　　setInterval定期发送ajax请求。服务器压力大，浪费流量，大部分是无效请求

ajax long polling

　　ajax发起请求，服务器对于这个请求一直等待到了有有效数据（或time out）才进行响应，期间一直维持这个请求，客户端接收到响应后马上发起另一个新的ajax请求，周而复始。

forever iframe

　　在客户端（浏览器）中动态载入一个隐藏的iframe标签，该标签的src属性指向请求的服务器url(实际上向服务器发送了一个http请求),然后客户端创建一个处理数据的函数，在服务器通过iframe与客户端的长连接定时输出数据给客户端，但是返回的数据是一个类似script标签的文本，客户端解析为js代码并执行其中的函数，从而达到通信的目的（和jsonp类似）

　　服务器不停地从链接中想客户端推送类似这样的消息：

　　<script type=\"text/javascript\">parent.process("data from server")</script>

缺点：IE浏览器在iframe请求期间，浏览器title一直处于加载状态，底部状态栏也显示正在加载，用户体验不好

flash socket

　　在页面中内嵌入一个使用了Socket类的Flash程序，JavaScript通过调用此Flash程序提供的Socket接口与服务器端的Socket接口进行通信，JavaScript通过Flash Socket接收到服务器端传送的数据

　　实现真正的即时通信，而不是伪即时。但是客户端必须安装Flash插件；非HTTP协议，无法自动穿越防火墙。

websocket（推荐）

client

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="https://cdn.bootcss.com/socket.io/1.7.2/socket.io.js"></script>
<body>
<script>
    var socket = io.connect('http://127.0.0.1:8080');

    socket.on('connect',function() {
        console.log('Client has connected to the server!');
        sendMessageToServer('hello,now is connected');
    });

    socket.on('message',function(data) {
        console.log('Received a message from the server!',data);
    });

    socket.on('disconnect',function() {
        console.log('The client has disconnected!');
    });

    function sendMessageToServer(message) {
        socket.send(message);
    }
</script>
</body>
</html>

nodeSrv

var http= require('http'),
    io= require('socket.io');

var server= http.createServer(function(req, res){
    res.end('<h1>will see this in http://localhost:8080</h1>');
});
server.listen(8080);

var socket= io.listen(server);

socket.on('connection', function(client){
    var interval= setInterval(function() {
        client.send('This is a message from the server! ' + new Date().getTime());
    },5000);
    client.on('message',function(event){
        console.log('Received message from client!',event);
    });
    client.on('disconnect',function(){
        clearInterval(interval);
        console.log('Server has disconnected');
    });
});

 　　socket.io 是一个为实时应用提供跨平台实时通信的库，名字源于它使用了浏览器支持并采用的 HTML5 WebSocket 标准，因为并不是所有的浏览器都支持 WebSocket ，所以该库支持一系列降级功能：

  1. Websocket
  2. Adobe® Flash® Socket
  3. AJAX long polling
  4. AJAX multipart streaming
  5. Forever Iframe
  6. JSONP Polling

跨平台、兼容性好、具有降级功能、所有传输机制接口对外统一、自带心跳。但是要使用socket.io必须前后端都要用一套框架。

posted @ 2017-10-12 14:21  HelloHello233  阅读(226)  评论(0)  编辑  收藏  举报