瀏覽器websocket


使用瀏覽器,PHP 來構建的應用,發現都是每次瀏覽器發送一次http 請求,PHP 回一個響應。

這樣,后端的PHP 在處理多次http請求是,每次都是不同的進程在處理。 這就加大了開銷, 而且,PHP 在處理多次的http請求時,前后多個PHP進程之間的感覺都沒啥聯系,

這些前后PHP進程之間怎么才能共享一些資源呢?比如,和第三方的tcp連接, 數據庫連接, modbus tcp 的連接 能保持長連接, 前后多個PHP進程都可以共享,這樣就不用每次

的PHP進程都要去重新建立tcp連接(太浪費資源了),

基於這些思考? 那有什么好的辦法呢????

------------------------------------------------------

 

 

 哈哈,這樣瀏覽器websocket client 和服務端端PHP的websocket server 就可以通信上了, 測試成功!!nice

下面是具體的代碼和方法步驟!

 

------------------------------------------------

客戶端(瀏覽器), websocket 代碼:

<html>
<head>
    <meta charset="UTF-8">
    <title>Web sockets test</title>
    <script type="text/javascript">
        var ws;
        function ToggleConnectionClicked() {
            try {
                ws = new WebSocket("ws://47.88.215.46:9501");//連接服務器
                ws.onopen = function(event){alert("已經與服務器建立了連接\r\n當前連接狀態:"+this.readyState);};
                ws.onmessage = function(event){alert("接收到服務器發送的數據:\r\n"+event.data);};
                ws.onclose = function(event){alert("已經與服務器斷開連接\r\n當前連接狀態:"+this.readyState);};
                ws.onerror = function(event){alert("WebSocket異常!");};
            } catch (ex) {
                alert(ex.message);
            }
        };

        function SendData() {
            try{
                var content = document.getElementById("content").value;
                if(content){
                    ws.send(content);
                }

            }catch(ex){
                alert(ex.message);
            }
        };

        function seestate(){
            alert(ws.readyState);
        }

    </script>
</head>
<body>
<button id='ToggleConnection' type="button" onclick='ToggleConnectionClicked();'>連接服務器</button><br /><br />
<textarea id="content" ></textarea>
<button id='ToggleConnection' type="button" onclick='SendData();'>發送我的名字:beston</button><br /><br />
<button id='ToggleConnection' type="button" onclick='seestate();'>查看狀態</button><br /><br />

</body>
</html>

 客戶端效果:

 

  

 

服務端PHP創建的websocket server 代碼(使用了 swoole開源庫):

<?php
//創建websocket服務器對象,監聽0.0.0.0:9502端口
$ws = new swoole_websocket_server("127.0.0.1", 9502);

//監聽WebSocket連接打開事件
$ws->on('open', function ($ws, $request) {
    var_dump($request->fd, $request->get, $request->server);
    $ws->push($request->fd, "hello, welcome\n");
});

//監聽WebSocket消息事件
$ws->on('message', function ($ws, $frame) {
    echo "Message: {$frame->data}\n";
    $ws->push($frame->fd, "server: {$frame->data}");
});

//監聽WebSocket連接關閉事件
$ws->on('close', function ($ws, $fd) {
    echo "client-{$fd} is closed\n";
});

$ws->start();

  把websocket server 跑起來:

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM