整合tp5和workerman的小demo,亲测通过

这几天闲暇时刻想做个类似在线聊天室的网页,一开始作为小白的我考虑到的是:

1、单纯用ajax的话,由于浏览器与服务器之间是http协议,属于无状态的,所以用ajax的话,当不同用户打开浏览器(进入在线聊天室)时,每个浏览器都要每秒去查询服务器当前房间人员,然后显示出来,太消耗资源
2、于是考虑到使用socket。而我作为一名phper,使用的是tp5框架,所以我必须得现踏进php的socket的门。所以弄了个小demo,供大家思考


一、你需要准备什么?

1.直接下载tp5的完整版(thinkphp_5.0.24_with_extend.zip),里面包含了workman(tp5目录查看:\vendor\workerman),没有的话你也可以使用composer下载

2.配置好php的环境变量(就是全局可以执行php ***.php)


二、配置项目

这个是目录图:
在这里插入图片描述
1.index模块下index.php文件的代码

<?php
namespace app\index\controller;

use think\Controller;

class Index extends Controller
{
    public function index()
    {
        return $this->fetch();
    }
}

2.index模块下模板文件index.html的代码

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript">
        // 假设服务端ip为127.0.0.1
        ws = new WebSocket("ws://127.0.0.1:2346");
        ws.onopen = function() {
            console.log("连接成功");
            ws.send('tom');
            console.log("给服务端发送一个字符串:tom");
        };
        ws.onmessage = function(e) {
            console.log("收到服务端的消息:" + e.data);
        };
    </script>
</head>
<body>
</body>
</html>

3.socket模块下index.php的代码

<?php
namespace app\socket\controller;
use Workerman\Worker;

class Index
{
    public function index()
    {

        // 创建一个Worker监听2346端口,使用websocket协议通讯
        $ws_worker = new Worker("websocket://0.0.0.0:2346");

        // 启动4个进程对外提供服务
        $ws_worker->count = 4;

        // 当收到客户端发来的数据后返回hello $data给客户端
        $ws_worker->onMessage = function($connection, $data)
        {
            // 向客户端发送hello $data
            $connection->send('hello ' . $data);
        };

        // 运行worker
        Worker::runAll();

    }
}

4.public文件夹下socket.php文件的代码

<?php
// 启动socket,通过cmd启动

// 定义应用目录
define('APP_PATH', __DIR__ . '/../application/');
//绑定到socket所在模块
define('BIND_MODULE','socket/index/index');
// 加载框架引导文件
require __DIR__ . '/../thinkphp/start.php';

三、cmd启动socket服务

1、打开cmd,定位(cd)到当前文件夹,开启服务
在这里插入图片描述2、然后运行自己的tp5项目,运行index下的index.html (其实你直接双击打开这个index.html也可以)
在这里插入图片描述

到这里就成功了!


vue学习提示
传智黑马 elementui 后台电商管理 传智 黑马 vue2.5 后台管理 vue+elementui项目实战 传智黑马最新 vue2.5 2.6后台管理项目 最新 传智 黑马就业班 vue最新基础讲解到实战项目开发视频及源码,带接口文档,带接口,vue从入门到实战,完整pc端后台电商管理项目,包含项目的打包优化及发布到外网服务器完整流程,想学习的抓紧机会了,分享给正好需要的你,抓紧机会了。

本人亲自维护的接口

非常适合vue零基础或者刚入门vue的小白学习。

资源包括源码、视频、接口文档,从入门到实战项目

vue学习项目,线上尝鲜地址:http://129.226.76.172:5325


在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述在这里插入图片描述

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值