服务器文件上传后,客户端下载-webscoket一对一

喵生初现

已于 2023-08-11 13:35:50 修改

阅读量644

点赞数 1

文章标签： php websocket

于 2023-08-01 14:26:27 首次发布

本文链接：https://blog.csdn.net/u011020900/article/details/132041225

版权

主要端末：小程序云服务器客户端A 客户端B 客户端C

流程：

1.小程序用户将文件通过小程序上传至云服务器，同时发送一个websocket，内部端口

2.云服务器与客户端ABC建立webscoket连接

3.当小程序用户需要上传到指定的客户端A电脑上的时候，我们通过webscoket只针对客户端A发送指令，让客户端A去下载

4.下载完成后，要么在客户端通过ajax+curl更新数据库，要么通过webscoket的回调函数+curl更新数据库。

完毕！

html代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Title</title>
</head>
<body>
<div id="content">

</div>
</body>
<script type="text/javascript" src="/static/jquery.min.js"></script>
<script>
    let lockReconnect = false; //避免ws重复连接
    let ws = null; // 判断当前浏览器是否支持WebSocket
    let wsUrl = "ws://119.3.122.125:1236";
    let printer_id = 25
    createWebSocket(wsUrl); //连接ws
    function contentLog(msg){
        let pLength = $("#content").find("p").length;
        if (pLength>=100){
            $("#content").html("");
        }
        $("#content").prepend("<p>"+msg+"</p>")

    }
    function createWebSocket(url) {
        try {
            if ('WebSocket' in window) {
                ws = new WebSocket(url);
            }
            initEventHandle();
        } catch (e) {
            reconnect(url);
            contentLog(e)
        }
    }

    async function downloadFileCurl(data){
        return new Promise((resolve, reject) => {
            $.ajax({
                url: "{:url('index/downloadFile')}",
                data: data,
                type: "post",
                success: function (ev) {
                    resolve(ev);
                }, error: function (ev) {
                    reject(0);
                }
            });
        });

    }

    function initEventHandle() {
        ws.onclose = function(event) {
            reconnect(wsUrl);
            contentLog(printer_id+"打印机文件连接关闭!" + new Date().toLocaleString())
        };
        ws.onerror = function() {
            reconnect(wsUrl);
            contentLog(printer_id+"打印机文件连接错误!" + new Date().toLocaleString())
        };
        ws.onopen = function() {
            let msg = {'uid':printer_id,'msg':'reg'};
            ws.send(JSON.stringify(msg));
            contentLog(printer_id+"打印机文件连接成功!" + new Date().toLocaleString())
            heartCheck.reset().start(); //心跳检测重置
        };
        ws.onmessage =  function(event) { //如果获取到消息，心跳检测重置
            let message = event.data
            getSeverMsg(message);
        };

    }

    async function getSeverMsg(message){
        if (message != 'heart') {
            contentLog("有下载文件!"+ new Date().toLocaleString())
            let downloadFileCurlResult = await downloadFileCurl(JSON.parse(message))
            if (downloadFileCurlResult===0){
                contentLog("文件下载失败"+ new Date().toLocaleString())
            }else{
                contentLog("文件下载成功"+downloadFileCurlResult+ new Date().toLocaleString())
            }
        }else{
            contentLog("心跳回答"+message+ new Date().toLocaleString())
        }
        heartCheck.reset().start(); //拿到任何消息都说明当前连接是正常的
    }

    // 监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
    window.onbeforeunload = function() {
        ws.close();
    }
    function reconnect(url) {
        if (lockReconnect) return;
        lockReconnect = true;
        setTimeout(function() { //没连接上会一直重连，设置延迟避免请求过多
            createWebSocket(url);
            lockReconnect = false;
        }, 1000);
    }

    //心跳检测,重新更新心跳定时器，如果服务器端发送了一个数据包，下一次发送心跳就会重新计时
    let heartCheck = {
        timeout: 10000, //心跳发送间隔
        timeoutObj: null,
        serverTimeoutObj: null,
        reset: function() { //清除心跳定时器
            clearTimeout(this.timeoutObj);
            clearTimeout(this.serverTimeoutObj);
            return this;
        },
        start: function() {//重新计算心跳
            let self = this;
            this.timeoutObj = setTimeout(function() {
                //这里发送一个心跳，后端收到后，返回一个心跳消息
                //onmessage拿到返回的心跳就说明连接正常
                let msg = {'uid':printer_id,'msg':"heart"};
                ws.send(JSON.stringify(msg));
                contentLog(printer_id+"心跳测试");
                self.serverTimeoutObj = setTimeout(function() { //如果超过一定时间还没重置，说明后端主动断开了
                    ws.close(); //如果onclose会执行reconnect，我们执行ws.close()就行了.如果直接执行reconnect 会触发onclose导致重连两次
                }, self.timeout)
            }, this.timeout)
        }
    }





</script>

</html>

workerman代码：

<?php
use Workerman\Worker;
use Workerman\Connection\TcpConnection;
require_once __DIR__ . '/vendor/autoload.php';

// 初始化一个worker容器，监听1234端口
$worker = new Worker('websocket://0.0.0.0:1236');

/*
 * 注意这里进程数必须设置为1
 */
$worker->count = 1;
// worker进程启动后创建一个text Worker以便打开一个内部通讯端口
$worker->onWorkerStart = function($worker)
{
    // 开启一个内部端口，方便内部系统推送数据，Text协议格式 文本+换行符
    $inner_text_worker = new Worker('text://127.0.0.1:5679');
    $inner_text_worker->onMessage = function(TcpConnection $connection, $buffer)
    {
        var_dump("1.内部有接受");
        // $data数组格式，里面有uid，表示向那个uid的页面推送数据
        $data = json_decode($buffer, true);
        $uid = $data['printer_id'];
        // 通过workerman，向uid的页面推送数据
//        $ret = broadcast($buffer);
        $ret = sendMessageByUid($uid, $buffer);
        // 返回推送结果
        $connection->send($ret ? 'ok' : 'fail');
    };
    // ## 执行监听 ##
    $inner_text_worker->listen();
};
// 新增加一个属性，用来保存uid到connection的映射
$worker->uidConnections = array();
// 当有客户端发来消息时执行的回调函数
$worker->onMessage = function(TcpConnection $connection, $data)
{
    global $worker;
    $post = json_decode($data, true);
    if (isset($post['uid'])&&$post['msg']=='reg') {

        // 判断当前客户端是否已经验证,既是否设置了uid
        if (!isset($worker->uidConnections[$post['uid']])) {

            // 没验证的话把第一个包当做uid（这里为了方便演示，没做真正的验证）
            $connection->uid = $post['uid'];
            /* 保存uid到connection的映射，这样可以方便的通过uid查找connection，
             * 实现针对特定uid推送数据
             */
            $worker->uidConnections[$connection->uid] = $connection;
            return;
        }
    }else if(isset($post['uid'])&&$post['msg']=='heart'){
        $ret = sendMessageByUid($post['uid'], "heart");
    }
};

// 当有客户端连接断开时
$worker->onClose = function(TcpConnection $connection)
{
    global $worker;
    if(isset($connection->uid))
    {
        // 连接断开时删除映射
        unset($worker->uidConnections[$connection->uid]);
    }

};

// 向所有验证的用户推送数据
function broadcast($message)
{
    global $worker;
    foreach($worker->connections as $connection)
    {
        $send = $connection->send($message);
    }
    return true;
}

// 针对uid推送数据
function sendMessageByUid($uid, $message)
{


    global $worker;

    var_dump("接收消息".$uid."数量".count($worker->uidConnections));


    if(isset($worker->uidConnections[$uid]))
    {
        var_dump($message);
        $connection = $worker->uidConnections[$uid];
        $send = $connection->send($message);
        var_dump("2.".$send);
        return true;
    }
    return false;
}

// 运行所有的worker
Worker::runAll();

喵生初现

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
服务器文件上传后,客户端下载-webscoket一对一

3.当小程序用户需要上传到指定的客户端A电脑上的时候，我们通过webscoket只针对客户端A发送指令，让客户端A去下载。4.下载完成后，要么在客户端通过ajax+curl更新数据库，要么通过webscoket的回调函数+curl更新数据库。1.小程序用户将文件通过小程序上传至云服务器，同时发送一个websocket，内部端口。主要端末：小程序云服务器客户端A 客户端B 客户端C。2.云服务器与客户端ABC建立webscoket连接。
复制链接

扫一扫