美文网首页PHP开发PHP经验分享
workerman实现简单弹幕的方法

workerman实现简单弹幕的方法

作者: 八重樱勿忘 | 来源:发表于2020-03-17 15:19 被阅读0次

弹幕[dàn mù] (barrage),中文流行词语,指的是在网络上观看视频时弹出的评论性字幕。下面我们就来看一下使用workerman实现简单弹幕的方法。

怎么从一名码农成为架构师的必看知识点:目录大全(持续更新)50W年薪挑战!

php代码:

<?php 

use Workerman\Worker; 

require_once '../Autoloader.php';//注意 这里要看你的workerman里的这个文件在哪 然后在进行修改 

$global_uid = 0; 

// 当客户端连上来时分配uid,并保存连接,并通知所有客户端 

function handle_connection($connection) { 

    global $text_worker, $global_uid; 

    // 为这个链接分配一个uid 

    $connection->uid = ++$global_uid; 

    foreach ($text_worker->connections as $conn) { 

        $conn->send("user[{$connection->uid}] online"); 

    } 

// 当客户端发送消息过来时,转发给所有人 

function handle_message($connection, $data) { 

    global $text_worker; 

    foreach ($text_worker->connections as $conn) { 

        $conn->send("user[{$connection->uid}] said: $data"); 

    } 

// 当客户端断开时,广播给所有客户端 

function handle_close($connection) { 

    global $text_worker; 

    foreach ($text_worker->connections as $conn) { 

        $conn->send("user[{$connection->uid}] logout"); 

    } 

$text_worker = new Worker("websocket://0.0.0.0:2347"); 

$text_worker->count = 1; 

$text_worker->onConnect = 'handle_connection'; 

$text_worker->onMessage = 'handle_message'; 

$text_worker->onClose = 'handle_close'; 

Worker::runAll();

HTML代码:

<!DOCTYPE html> 

<html> 

<head> 

    <meta charset="UTF-8"> 

    <title>Simple Chat</title> 

</head> 

<body> 

    <center>

<h1>Simple Chat</h1> 

<input type="text" id="msg"> 

<button type="button" id="send">send</button>

<div id="content" style="width:200px;height:200px;border:1px solid red">

    假装在播放视频

    <marquee behavior="" direction=""></marquee>

</div> 

</center>

</body> 

<script type="text/javascript"> 

    window.onload = function () { 

        var ws = new WebSocket("ws://127.0.0.1:2347"); 

        document.getElementById("send").onclick = function () { 

            var msg = document.getElementById("msg").value; 

            ws.send(msg); 

        }; 

        ws.onopen = function () { 

            console.log("连接成功"); 

//            ws.send('raid'); 

        }; 

        ws.onmessage = function (e) { 

            document.getElementById("content").innerHTML += '<marquee behavior="" direction="">' + e.data + '</marquee>'; 

        }; 

    }; 

</script> 

</html>

以上就是workerman实现简单弹幕的方法的详细内容

更多内容请访问

八重樱:怎么从一名码农成为架构师的必看知识点:目录大全(持续更新)50W年薪挑战!​zhuanlan.zhihu.com

以上内容希望帮助到大家,很多PHPer在进阶的时候总会遇到一些问题和瓶颈,业务代码写多了没有方向感,不知道该从那里入手去提升,对此我整理了一些资料,包括但不限于:分布式架构、高可扩展、高性能、高并发、服务器性能调优、TP6,laravel,YII2,Redis,Swoole、Swoft、Kafka、Mysql优化、shell脚本、Docker、微服务、Nginx等多个知识点高级进阶干货需要的可以免费分享给大家,需要的可以加入我的官方群点击此处

相关文章

  • workerman实现简单弹幕的方法

    弹幕[dàn mù] (barrage),中文流行词语,指的是在网络上观看视频时弹出的评论性字幕。下面我们就来看一...

  • 使用canvas实现和HTML5 video交互的弹幕效果

    一、canvas实现弹幕性能较好 从技术实现成本角度讲,要实现弹幕效果,最简单的方法就是DOM+CSS3控制,如果...

  • 实现弹幕效果的简单方法

    昨天出去玩了一天,没有写博客,总结一下之前所学的东西。今天一下午,就静下心来写几篇,首先来看看类似喜马拉雅和电影中...

  • 弹幕的简单实现

    弹幕是即时出现大量评论的形式,因数量极多很像炮弹形成的幕布而得名。下面简单的实现一个弹幕。 弹幕的简单实现以及循环

  • 实现简单的弹幕

    第一步,首先要在Android的build.gradle文件中引入B站的项目: repositories { ...

  • ubuntu16.04下workerman-gateway实现长

    弹幕系统聊天室 gateway介绍 GatewayWorker基于Workerman开发的一个项目框架,用于快速开...

  • 使用transition实现弹幕滚动效果

    想要实现比较理想的弹幕滚动效果还是有一定难度的。这里以vue为基础,讲一种实现弹幕滚动的方法,不考虑重叠,弹幕过长...

  • Flutter 实现虎牙/斗鱼 弹幕效果

    先来一张效果图: 实现原理 弹幕的实现原理非常简单,即将一条弹幕从左侧平移到右侧,当然我们要计算弹幕垂直方向上的偏...

  • 学习记录:基于jQuery的简单弹幕墙

    一个非常简单的弹幕墙,仅实现了弹幕显示,没有数据存储和后续播放。实现原理是从输入框获得弹幕内容,经过修饰包装后以添...

  • qt设置透明窗体的方法

    在实现弹幕应用程序的时候,需要让窗体的背景透明,但是其上的弹幕(基于QLable实现)则不是透明的。具体的方法如下...

网友评论

    本文标题:workerman实现简单弹幕的方法

    本文链接:https://www.haomeiwen.com/subject/liutyhtx.html