php自學中心 2019-11-08 10:25:30

文章來自：laravel學院WebSocket 概述
在此之前，有必要對 WebSocket 的原理做簡單的說明，WebSocket 復用了 HTTP 協議來實現握手，然后通過請求報文中的 Upgrade 字段將 HTTP 協議升級到 WebSocket 協議來建立 WebSocket 通信連接，一旦 WebSocket 連接建立之后，就可以在這個長連接上通過 WebSocket 數據幀進行雙向通信，客戶端和服務端可以在任何時候向對方發送報文，而不是 HTTP 協議那種服務端只有在客戶端發起請求后才能響應，從而解決了在 Web 頁面實時顯示最新資源的問題。
與 HTTP 類似，WebSocket 協議對應的 scheme 是 ws，如果是加密的 WebSocket 對應的 scheme 是 wss。
在這篇教程中，我們將在服務端基于 Swoole 實現簡單的 WebSocket 服務器，然后在客戶端基于 JavaScript 實現 WebSocket 客戶端。WebSocket 服務器
PHP 異步網絡通信引擎 Swoole 內置了對 WebSocket 的支持，通過幾行 PHP 代碼就可以寫出一個異步非阻塞多進程的 WebSocket 服務器：
on('open', function (SwooleWebSocketServer $server, $request) {
echo "server: handshake success with fd{$request->fd}n";
});
// 收到消息時觸發推送
$server->on('message', function (SwooleWebSocketServer $server, $frame) {
echo "receive from {$frame->fd}:{$frame->data},opcode:{$frame->opcode},fin:{$frame->finish}n";
$server->push($frame->fd, "this is server");
});
// 關閉 WebSocket 連接時觸發
$server->on('close', function ($ser, $fd) {
echo "client {$fd} closedn";
});
// 啟動 WebSocket 服務器
$server->start();
編寫完成后，將這段 PHP 代碼保存到本地 websocket_server.php 文件。WebSocket 客戶端
在客戶端，可以通過 JavaScript 調用瀏覽器內置的 WebSocket API 實現 WebSocket 客戶端，實現代碼和服務端差不多，無論服務端還是客戶端 WebSocket 都是通過事件驅動的，我們在一個 HTML 文檔中引入相應的 JavaScript 代碼：
Chat Client
將這個 HTML 文檔命名為 websocket_client.html。
WebSocket 通信演示
接下來，我們在命令行啟動 WebSocket 服務器：
php websocket.php
然后在瀏覽器中訪問 websocket_client.html，首先會提示我們輸入昵稱：

輸入之后點擊確定，JavaScript 代碼會繼續往下執行，讓輸入框獲取焦點，然后初始化 WebSocket 客戶端并連接到服務器，這個時候通過開發者工具可以看到 Console 標簽頁已經輸出了連接已建立日志：

在 Network 里面也可以看到 WebSocket 握手請求和響應：

這個時候我們在輸入框中輸入「你好，WebSocket！」并回車，即可觸發客戶端發送該數據到服務器，服務器接收到消息后會將其顯示出來：

同時將「This is server」消息推送給客戶端，客戶端通過 onmessage 回調函數將獲取到的數據顯示出來。在開發者工具的 Network->WS 標簽頁可以查看 WebSocket 通信細節：

看起來，這個過程還是客戶端觸發服務器執行推送操作，但實際上，在建立連接并獲取到這個客戶端的唯一標識后，后續服務端資源有更新的情況下，仍然可以通過這個標識主動將更新推送給客戶端，而不需要客戶端發起拉取請求。WebSocket 服務器和客戶端在實際項目中的實現可能會更加復雜，但是基本原理是一致的。

總結

以上是生活随笔為你收集整理的websocket 更新点位 浏览器卡顿_我们来看看Swoole是如何实现WebSocket服务器及客户端的...的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。