Learn how to build a chat room program using swoole in one article-Swoole-php.cn

Learn how to build a chat room program using swoole in one article

爱喝马黛茶的安东尼

Release： 2019-11-22 17:15:13

forward

2510 people have browsed it

1. Create a websocket server

swoole has built-in websocket server function since version 1.7.9. We With just a few lines of simple PHP code, you can create an asynchronous non-blocking multi-process WebSocket server.

First, we create a new project in the apache workspace, named swoole, and then create a new ws-server.php file in it. This php file mainly creates a websocket server and responds to user requests. , the content is as follows:

<?php 
 
//创建websocket服务器对象，监听0.0.0.0:9502端口
$ws_server = new swoole_websocket_server(&#39;192.168.1.169&#39;, 9502);
 
//设置server运行时的各项参数
$ws_server->set(array(
&#39;daemonize&#39; => true, //是否作为守护进程
));
 
//监听WebSocket连接打开事件
$ws_server->on(&#39;open&#39;, function ($ws, $request) {
file_put_contents( __DIR__ .&#39;/log.txt&#39; , $request->fd);
//$ws->push($request->fd, "Hello, Welcome\n");
});
 
//监听WebSocket消息事件
$ws_server->on(&#39;message&#39;, function ($ws, $frame) {
pushMessage($ws,$frame);
});
 
//监听WebSocket连接关闭事件
$ws_server->on(&#39;close&#39;, function ($ws, $fd) {
echo "client-{$fd} is closed\n";
});
 
$ws_server->start();
 
//消息推送
function pushMessage($ws,$frame){
$data = $frame->data;
$msg = file_get_contents( __DIR__ .&#39;/log.txt&#39;);
for ($i=1 ; $i<= $msg ; $i++) {
$ws->push($i, $frame->fd.&#39; : &#39;.$data);
}
}

Copy after login

The above code creates a WebSocket server, its IP address is 192.168.1.169, and the port is 9502. This information can be adjusted according to the actual situation.

2. Create a chat interactive page

Similarly, in the swoole directory, we create a new chat.html file, which is a purely static html5 page. The function is to interact with the websocket server through the WebSocket protocol of html5. Its content is as follows:

<!DOCTYPE html>
<html>
<head>
  <title></title>
  <meta charset="UTF-8">
  <script type="text/javascript">
  if(window.WebSocket){
  var webSocket = new WebSocket("ws://192.168.1.169:9502");
  webSocket.onopen = function (event) {
  //webSocket.send("Hello,WebSocket!"); 
  };
  webSocket.onmessage = function (event) {
    var content = document.getElementById(&#39;content&#39;);
    content.innerHTML = content.innerHTML.concat(&#39;<p style="margin-left:20px;height:20px;line-height:20px;">
    用户id-&#39;+event.data+&#39;</p>&#39;);
  }
 
  var sendMessage = function(){
  var data = document.getElementById(&#39;message&#39;).value;
  webSocket.send(data);
  }
  }else{
  console.log("您的浏览器不支持WebSocket");
  }
  </script>
</head>
<body>
<div style="width:600px;margin:0 auto;border:1px solid #ccc;">
<div id="content" style="overflow-y:auto;height:300px;"></div>
<hr/>
<div style="height:40px">
<input type="text" id="message" style="margin-left:10px;height:25px;width:450px;">
<button οnclick="sendMessage()" style="height:28px;width:75px;">发送</button>
</div>
</div>
</body>
</html>

Copy after login

3. Test

So far, the two files we need are It has been created, let's test whether it works as expected.

3.1 Start the WebSocket server

Switch to the root directory of the project, and then execute the ws-server.php script through the php command line to start the WebSocket server. The entire command is as follows:

cd /var/www/html/swoole
php ws-server.php

Copy after login

As shown in the picture:

Learn how to build a chat room program using swoole in one article

##3.2 Check whether the WebSocket server started successfully

Enter the command: netstat -tunlp|grep 9502, if it can be seen When you reach the following interface, it means that the WebSocket server is started successfully.

Learn how to build a chat room program using swoole in one article

3.3 Start chatting

Prepare a few more browsers, and then enter http://192.168.1.169/swoole/ in each browser chat.html, each browser is equivalent to a user, and then a group chat can be simulated.

In the chat window of Chrome browser, enter "Hello everyone, I am Chrome". At this time, you will see this message in the chat window of UC and Firefox browsers. In the same way, when you enter information in the chat window of UC and Firefox browsers, the other two windows can also be seen. The following is a screenshot of one of the chat windows, as follows:

Learn how to build a chat room program using swoole in one article

The chat interface is a bit ugly, but the function is achieved, and the interface can beautify the UI front-end. Next, you can chat happily. Isn’t it very simple?

PHP Chinese website, a large number of free

swoole introductory tutorials, welcome to learn online!

This article is reproduced from: https://blog.csdn.net/tdcqfyl/article/details/52370804

The above is the detailed content of Learn how to build a chat room program using swoole in one article. For more information, please follow other related articles on the PHP Chinese website!