学习SWOOLE之Websocket

准备工作:
使用VMware软件安装Centos7 安装php7 和swoole扩展

<?php
//搭建websocket服务器
$ws=new swoole_websocket_server("0.0.0.0",9504);
/**
 * $ws 服务器信息
 * $request 客户端信息
 */
$ws->on("open",function ($ws,$request){
    echo "开始建立连接\n";
  //  $ws->push($request->fd,"终于等到你");
});
/**
 * 当接收信息的时候
 * $ws 服务器信息
 * $request 客户段信息
 */
$ws->on("message",function ($ws,$request){
        echo "message:".$request->data."\n";
        $result=file_get_contents("http://i.itpk.cn/api.php?question=".$request->data);
        $ws->push($request->fd,$result);
});


//关闭连接
$ws->on("close",function ($ws,$request){

    echo "关闭连接\n";
});


//启动服务器
$ws->start();

启动Webscoket服务
php Webscoket.php
在这里插入图片描述
查看服务是否启动
php -ajft
在这里插入图片描述

前端界面

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <title>websocket</title>



</head>
<body>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<div id="sse">
    <input type="text" id="text"/>
    <button onclick="WebSocketTest()">发送</button>
    <div id="answer">

    </div>

</div>

</body>
</html>
<script type="text/javascript">
    function WebSocketTest()
    {
        if ("WebSocket" in window)
        {


            // 打开一个 web socket
            var ws = new WebSocket("ws://192.168.80.128:9504/");

            ws.onopen = function()
            {
                // Web Socket 已连接上,使用 send() 方法发送数据
                $text=$("#text").val();
                ws.send($text);
            };

            ws.onmessage = function (evt)
            {
                var received_msg = evt.data;
                var html="<div>"+received_msg+"</div>";
                $("#answer").append(html);
            };

            ws.onclose = function()
            {
                // 关闭 websocket
                alert("连接已关闭...");
            };
        }

        else
        {
            // 浏览器不支持 WebSocket
            alert("您的浏览器不支持 WebSocket!");
        }
    }
</script>

实现效果:
在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值