• h5中websocket


    ajax的数据传输是单向的,客户端和服务端没有连接-----客户端建立连接发送请求----服务器端沿着建立的连接返回相应----断开连接

    websocket则是可以在客户端和服务器端进行双向的数据接收和发送

    打个比方:小明在客厅看电视,小明的媳妇在卫生间洗衣服,小明的爸爸在书房看报纸,小明的妈妈在厨房做饭;小明的爸爸饿了,问小明:饭做好了么?这时小明只能去询问妈妈:饭做好了么,小明的妈妈回复小明说没做好,小明转而回复爸爸:饭没做好。如果按照ajax的习惯现场状态就变成了这样:小明的爸爸没过一秒钟问小明一次饭做没做好,小明只能一遍一遍的询问妈妈饭做没做好,然后不厌其烦的转达给爸爸;在整个一个过程中小明充当了服务器的角色,客户端(小明的爸爸)发出请求,服务器(小明)接收数据然后从数据库中(小明的妈妈)获取信息,再转达给小明的爸爸,才能达到实时展示信息的过程。然而引入websocket后,现场情况转变成了:小明的爸爸问小明:饭做好了没,小明转告妈妈:饭好了告诉爸爸一生,然后小明的妈妈把饭做好了直接告诉小明的爸爸:饭做好;

    忽略上面我拙劣的例子,下面接着来看websocket

    运行环境:基于node 安装
    安装:npm install socket.io
    工作流程:
    服务器端 接收 connection 接收完了之后进行emit(发送)
    客户端 需要connect

    服务器端使用 nodejs语句编写:

            var http=require('http');
                        var fs=require('fs');
                        var io=require('socket.io');
                        var httpObj=http.createServer(function(req,res){
    
                        });
                        httpObj.listen(8080);
                        var ws=io.listen(httpObj);
                        //服务器端接收数据
                        ws.on('connection',function(socket){
                            setInterval(function(){
                                socket.emit('time',Date.now());
                            },1000);
                            socket.on('khd',function(name,content){
                                console.log(name,content);
                            });
                        });                            

    客户端语句编写:
    客户端处理:
    var ws=io.connect('ws://localhost:8081');
    客户端接收数据:
    ws.on('time',function(result){
    console.log(result);
    });
    客户端向服务器端发送数据:
    ws.emit('kind','','');
    服务器端接收:
    soket.on('kind',function(name,content){
    console.log(name,content);
    });

  • 相关阅读:
    JAVA中的for循环
    Android项目开发全程(三)-- 项目的前期搭建、网络请求封装是怎样实现的
    Android项目开发全程(二)--Afinal用法简单介绍
    Android项目开发全程(一)--创建工程
    Spring中的线程池和定时任务功能
    JVM内存分析
    并发基本概念介绍
    javax顶层接口分析
    HttpServlet源码分析
    SpringMVC创建HelloWorld程序
  • 原文地址:https://www.cnblogs.com/jasonwang2y60/p/6087470.html
Copyright © 2020-2023  润新知