JavaScript websocket 实例

1实例:
2
3即时通讯聊天室demo可以打开两个页面互相发送消息查看。

websocket.js

1/*  判断浏览器是否内置了websocket */
2    if ('WebSocket' in window) {
3        websocket = new WebSocket('ws://180.76.144.202:19910/websocket');
4    }
5
6
7    websocket->onerror = 'onerror';
8    websocket->onopen = 'onopen';
9    websocket->onmessage = 'onmessage';
10    websocket->onclose = 'onclose';
11    websocket->onbeforeunload = 'onbeforeunload';
12    websocket->closeWebSocket = 'closeWebSocket';
13    weboskcet->send = 'send';
14
15
16    /* 连接失败时触发 */
17    function onerror () {
18        setMessageInnerHTML('websocket connection error');
19    }
20
21
22    /* 连接成功时触发 */
23    function onopen () {
24        setMessageInnerHTML('websocket connect success');
25    }
26
27
28    /* 收到新消息时触发 */
29    function onmessage (event) {
30        setMessageInnerHTML(event);
31    }
32
33
34    /* 连接关闭时触发 */
35    function onclose () {
36        setMessageInnerHTML('websocket connectionn closed');
37    }
38
39
40    /* 当窗口关闭时，主动关闭websocket连接。防止连接还没断开就关闭窗口,server端异常 */
41    function onbeforeunload () {
42        closeWebSocket();
43    }
44
45
46    /* 关闭websocket连接 */
47    function closeWebSocket () {
48        websocket.close();
49    }
50
51
52    /* 发送消息 */
53    function send () {
54        var message = document.getElementById('container').value;
55        websocket.send(message);
56    }

　instance.php:

1<?php
2
3
4require_once "../../MeepoPS/index.php";
5
6$telnet = new \MeepoPS\Api\Websocket("0.0.0.0", 19910);
7
8
9$telnet->instanceName = "MeepoPS-Websocket";
10
11$telnet->callbackStartInstance = "callbackStartInstance";
12$telnet->callbackConnect = "callbackConnect";
13$telnet->callbackNewData = "callbackNewData";
14$telnet->callbackSendBackBufferEmpty = "callbackSendBackBufferEmpty";
15$telnet->callbackInstanceStop = "callbackInstanceStop";
16$telnet->callbackConnectClose = "callbackConnectClose";
17
18
19function callbackStartInstance ($instance)
20{
21    echo "实例" . $instance->instanceName . "启动" . "\n";
22}
23
24
25function callbackConnect ($connect)
26{
27    foreach ($connect->instance->clientList as $client) {
28        if ($connect->id != $client->id) {
29            $client->send("新用户" . $connect->id . "已经上线");
30        }
31    }
32
33    var_dump("收到新链接. UniqueId = " . $connect->id . "\n");
34}
35
36
37function callbackNewData ($connect, $data)
38{
39 //   $connect->send("用户 " . $connect->id . "说:" . $data . "\n");
40     var_dump("UnqiueId = " . $connect->id . "说:" . $data ."\n");
41
42    foreach ($connect->instance->clientList as $client) {
43        if ($connect->id != $client->id) {
44            $client->send("群发:用户" . $connect->id . "说: " . $data . "\n");
45        }
46    }
47
48}
49
50
51function callbackSendBufferEmpty ($connect)
52{
53    var_dump("用户 " . $connect->id . "的发送的消息队列为空\n");
54}
55
56
57function callbackInstanceStop ($instance)
58{
59    foreach ($instance->clientList as $client) {
60        $client->send("Service stop!");
61    }
62}
63
64
65
66\MeepoPS\runMeepoPS();

服务可以用MeepoPS/SWOOLE搭建：

　下面是MeepoPS实例

1// 下载MeepoPSgit clone https://github.com/lixuancn/MeepoPS.git
2
3// 进入目录cd MeepoPS/Example/Chat_Robot// 普通模式启动：sudo php instance.php start // 守护进程模式启动：sudo php instance.php start -d守护进程启动下：ps -aux | grep php 能看到instance.php 说明启动成功了。注意浏览器访问的端口和instance.php 端口一致。例如 centos 7 防护墙查看端口19911 是否开启：// 查看防火墙状态：systemctl status firewalld.service// 开启端口19911firewalld-cmd --permanent --zone=public --add-port=19911/tcp// 重启防火墙查看端口：systemctl restart firewalld.servicefirewall-cmd --query-port=19910/tcp如果出现yes即为开启成功。打开浏览器访问websocket.js，控制台查看log.