server.php
<?php //連接本地的 Redis 服務 $redis = new Redis(); $redis->connect('127.0.0.1', 6379); $redis->set("fd", "[]"); //每次第一次執行都需要先清空reids里面的標識 $server = new swoole_websocket_server("0.0.0.0", 9502); $server->on('open', function (swoole_websocket_server $server, $request) use($redis) { echo "訪客{$request->fd}進來了\n"; $server->push($request->fd, "{$request->fd}客戶進來了"); $str = json_decode($redis->get("fd"), true); if($str == "") $str = []; if(!in_array($request->fd, $str)){ array_push($str, $request->fd); $str = json_encode($str); $redis->set("fd", $str); echo "目前在線訪客："; print_r($redis->get("fd")); } }); $server->on('message', function (swoole_websocket_server $server, $frame) use($redis) { echo "系統消息說：{$frame->data}\n"; $str = json_decode($redis->get("fd"), true); foreach ($str as $key => $value) { if($frame->fd != $value){ $server->push($value, "系統消息說:".$frame->data); } } }); $server->on('close', function ($ser, $fd) use($redis) { echo "client {$fd} closed\n"; $str = json_decode($redis->get("fd"), true); $point = array_keys($str, $fd, true); //search key array_splice($str, $point['0'],1); //delete array $str = json_encode($str); $redis->set("fd", $str); echo "刪除后在線訪客："; print_r($redis->get("fd")); }); $server->start();
Cli命令行執行：/usr/local/php/bin/php server.php
client.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id="main">
<div class="msgs">
消息通知：<span id="push_content" style="color:red"></span>
</div>
</div>
</body>
<script>
var socket = new WebSocket('ws://23.27.127.32:9502'); //監聽端口
socket.onopen = function () { //監聽是否連接服務器成功觸發
console.log('Connected!');
//socket.send("這條信息會返回給服務器看"); //重要!!客戶端返回服務器
};
socket.onmessage = function (event) { // **接收到服務器數據**觸發
console.log(event.data);
// alert('Received data: ' + event.data);
document.getElementById("push_content").innerHTML = event.data;
// socket.close();
};
socket.onclose = function () { //與服務器連接斷開觸發
console.log('Lost connection!');
};
socket.onerror = function () { //與服務器連接出現錯誤觸發
console.log('Error!');
};
// socket.send('hello, world!');
</script>
</html>
admin.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>后台推送界面</title>
</head>
<body>
<div>
<input type="text" name="content" placeholder="請輸入需要推送的信息">
<button id="push_button">推送</button>
</div>
</body>
<script>
window.onload = function () {
var socket = new WebSocket('ws://23.27.127.32:9502'); //監聽端口
var push_button = document.getElementById("push_button");
var push_content = document.getElementsByName("content");
push_button.onclick = function () {
socket.send(push_content['0'].value);
}
socket.onmessage = function (event) { // **接收到服務器數據**觸發
// alert('Received data: ' + event.data); //這里應該返回發送成功的額標識
};
socket.onopen = function () { //監聽是否連接服務器成功觸發
console.log('Connected!');
// socket.send(push_content['0'].value); //重要!!客戶端返回服務器
};
socket.onclose = function () { //與服務器連接斷開觸發
console.log('Lost connection!');
};
socket.onerror = function () { //與服務器連接出現錯誤觸發
console.log('Error!');
};
};
</script>
</html>
