HTML5技术

nodejs+websocket实时聊天系统 - 苏黎世宝贝(2)

字号+ 作者:H5之家 来源:H5之家 2017-05-18 14:00 我要评论( )

mess.innerHTML+=time.toUTCString()+":"+e.data+"br"; document.getElementById("send").onclick=function(e){ ws.send(input.value+"说:"+value1.value); value1.value=""; } document.onkeydown=function(e){ e=

                    mess.innerHTML += time.toUTCString() + ":" + e.data + "<br>";

                    document.getElementById("send").onclick = function (e) {

                        ws.send(input.value + "说:" + value1.value);

                        value1.value = " ";

                    }

                    document.onkeydown = function (e) {

                        e = e || window.event;

                        if (e.keyCode == 13) {

                            document.getElementById("send").onclick();

                            return false;

                        }

                    }

                }

                ws.onclose = function (e) {

                    console.log("服务器关闭");

                }

                ws.onerror = function () {

                    console.log("连接出错");

                }

                /**

                       * 客户端主动断开连接

                       * 

                       * **/

                close.onclick = function () {

                    ws.onclose();

                    ws.send(input.value + 'close' + "了连接");

                    input.removeAttribute("readOnly");

                    conn.disabled = false;

                    close.disabled = true;

                }


            }



        }

    </script>

</body>


</html>

 

只能说界面丑陋忽略它。

server.js:

var ws = require("nodejs-websocket");

console.log("开始建立连接...");

var str1 = null, str2 = null, clientReady = false, serverReady = false;

var a = [];

var server = ws.createServer(function (conn) {

    conn.on('text', function (str) {

        a.push(str);

        if (!clientReady) {

            if (a[0] === str) {

                str1 = conn;

                clientReady = true;

                str1.sendText("欢迎你" + str);


            }

        } else if (!serverReady) {

            if (str.indexOf('close') >= 0) {

                a.splice(2, 1);

                clientReady = false;

                str1 = null;

                return;

            }

            if (a[1] === str) {

                str2 = conn;

                serverReady = true;

                str2.sendText("欢迎你" + str);

                str1.sendText(str + "在线啦,你们可以聊天啦");

                return;

            }

        } else if (clientReady && serverReady) {

            str2.sendText(str);

            str1.sendText(str);

            if (str.indexOf('close') >= 0) {

                a.splice(2, a.length);

                var len = a.length;

                for (var i = 0; i < len; i++) {

                    // 定位该元素位置

                    if (str.indexOf(a[i]) >= 0) {

                        a.splice(i, 1);

                        if (i == 0) {

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 调取百度地图接口,实现取自己的实时位置,然后可以在百度地图上添加信息标注 - QISHUANG

    调取百度地图接口,实现取自己的实时位置,然后可以在百度地图上添加

    2017-04-18 10:02

  • 微信小程序正式上线 可置于聊天窗口顶部 - iyifei

    微信小程序正式上线 可置于聊天窗口顶部 - iyifei

    2017-01-10 12:10

  • Ionic 的 ng-class 在聊天功能上面的巧妙运用 - 小月博客

    Ionic 的 ng-class 在聊天功能上面的巧妙运用 - 小月博客

    2016-10-02 15:00

  • asp.net mvc signalr 简单聊天室 - liuhz

    asp.net mvc signalr 简单聊天室 - liuhz

    2016-09-25 17:02

网友点评