宝塔部署websocket服务,后台fastadmin,用户端uniapp

一,项目根目录创建 websocket文件夹

文件夹下创建websocket服务server.php

php 复制代码
<?php
require_once __DIR__ . '/../vendor/autoload.php';

use Workerman\Worker;
use Workerman\Connection\TcpConnection;

// 创建 WebSocket 服务器,监听 2345 端口
$ws_worker = new Worker("websocket://0.0.0.0:2345");

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

// 保存所有客户端连接
$clients = [];

// 当有客户端连接时
$ws_worker->onConnect = function(TcpConnection $connection) use (&$clients) {
    $connection->onWebSocketConnect = function(TcpConnection $connection) use (&$clients) {
        // 保存连接
        $clients[$connection->id] = $connection;
        echo "New connection: {$connection->id}\n";
    };
};

// 当收到客户端消息时
$ws_worker->onMessage = function(TcpConnection $connection, $data) use (&$clients) {
    // 广播消息给所有客户端
    foreach ($clients as $client) {
        $client->send($data);
    }
};

// 当客户端断开连接时
$ws_worker->onClose = function(TcpConnection $connection) use (&$clients) {
    // 移除连接
    unset($clients[$connection->id]);
    echo "Connection closed: {$connection->id}\n";
};

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

二,启动websocket服务

命令行:php websocket/server.php start,提示php版本不对,查看项目虽然是php7.4但是实际上环境变量是7.2

三,修改环境变量

bash 复制代码
#移除现有的
rm -f /usr/bin/php 

#新增php7.4
ln -sf /www/server/php/74/bin/php /usr/bin/php

#查看最新的
php -v

四,运行websocket服务

bash 复制代码
php websocket/server.php start

五,用户端连接

javascript 复制代码
connet_sock(){
	var socketUrl = 'ws://119.91.135.15:2345';
	this.ST = uni.connectSocket({
		url: socketUrl,
		complete: (e) => {
			console.log(e)
		},
		fail: (f) => {
			console.log(f);
		},
		success: (s) => {
			
			uni.onSocketOpen((res) => {
				console.log('连接成功');
			});

			uni.onSocketMessage((res) => {
				console.log(typeof(res.data));
				const data = JSON.parse(res.data);
				console.log(data)
			
				if(res.data.length>0){
					console.log('接收到服务端发送的消息', res);
					console.log(res.data)
				}
				
			})
			uni.onSocketOpen(function(res) {
				console.log('WebSocket连接已打开!');
			});
			uni.onSocketClose((res) => {
				console.log(res);
				if (!this.ST) {
					return;
				}
				uni.showToast({
					title: '与服务器连接中断,请重新刷新页面!',
					icon: 'loading'
				})
				clearInterval(this.t1);
				this.isLogin = false
				this.ST = false;
				this.timer = setTimeout(() => {
					this.open()
				}, 5000)
			});
			uni.onSocketError((res) => {
				uni.showToast({
					title: '与服务器连接错误,请重新刷新页面!',
					icon: 'loading'
				})
				this.timer = setTimeout(() => {
					this.open()
				}, 5000)
			});
		}
	});
},

//发送消息
send_msg(msg) {
	let str = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
	let result = '';
	var len = 10;
	while (len--) {
		let index = Math.floor(Math.random() * str.length);
		result += str[index];
	}
	
	if(this.is_close == 0){
		var data =  {
			type: 'MODEL_TALK',
			text: '请问情人节一般你会送什么礼物',
			messageCode: result,
		}
	}else{
		var data =  {
			type: 'MODEL_TALK',
			text: '如果给你一百万,你会怎么花',
			messageCode: result,
		}
	}
	uni.sendSocketMessage({
		data: JSON.stringify(data),
		success(res) {
			console.log(res);
			console.log('消息发送成功!')
		},
		fail(err) {
			console.log(err);
			console.log('消息发送失败!')
		}
	})
},

写在后面:

1,如果用户端无法连接,确认安全组是否有放行

2,服务端websocket服务地址需要写 0.0.0.0 ,否则外网无法连接

相关推荐
墨着染霜华7 小时前
UniApp 微信小程序分享
微信小程序·uni-app
2501_915921439 小时前
Windows 系统下的 IPA 加密工具实战指南,如何在非 macOS 环境完成 IPA 混淆、加固与工程化处理
android·windows·macos·ios·小程序·uni-app·iphone
iOS阿玮9 小时前
最近苹果审核效率提高了,周末竟然都在审核。
uni-app·app·apple
Lsx-codeShare1 天前
一文读懂 Uniapp 小程序登录流程
前端·javascript·小程序·uni-app
00后程序员张1 天前
接口调试从入门到精通,Fiddler抓包工具、代理配置与HTTPS抓包实战技巧
前端·ios·小程序·https·fiddler·uni-app·webview
酸奶弄死你2 天前
uniapp调用后台接口
uni-app·前后端
游戏开发爱好者82 天前
iOS IPA 上传工具全面解析,从 Transporter 到开心上架(Appuploader)命令行的高效上架实践
android·ios·小程序·https·uni-app·iphone·webview
半开半落2 天前
uniapp通过npm使用第三方库兼容微信小程序
微信小程序·npm·uni-app
随笔记2 天前
HbuilderX载入项目,运行后唤起微信开发者工具,提示:Error: Fail to open IDE,唤醒不起来怎么办
javascript·微信小程序·uni-app