宝塔部署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 ,否则外网无法连接

相关推荐
2501_9159214315 小时前
uni-app 上架 iOS 的完整流程(无需依赖 Mac)
android·macos·ios·小程序·uni-app·iphone·webview
于先生吖1 天前
前后端分离二手商城开发,质检登记、回收回款整套业务源码部署教程
java·开发语言·uni-app
Geek_Vison2 天前
政务一网通APP如何引入AI能力,通过一个AI助手就能够调用所有的功能,实现对话即办事
人工智能·ai·小程序·uni-app·小程序容器
狗凯之家源码网3 天前
UniApp 数藏系统源码部署与定制开发全指南
uni-app
RuoyiOffice4 天前
2026 企业定制开发选型:从零开发、低代码、SaaS 与 RuoYi Office 怎么选?
spring boot·uni-app·开源·saas·oa·定制化·ruoyioffice
三天不学习4 天前
【超详细】Vue3+UniApp+.NET8集成腾讯云IM即时通信全攻略
uni-app·.net·腾讯云·im·即时通信
于先生吖4 天前
前后端分离人事招聘项目,校招宣讲预约+社招双向撮合功能架构设计教程
java·开发语言·uni-app
QQ_5110082854 天前
uniapp微信小程序网上饰品商城售卖系统php python物流
微信小程序·uni-app·php
2501_915909064 天前
深入解析Mock.js:功能、应用及实战案例,提升前端开发效率
android·ios·小程序·https·uni-app·iphone·webview
于先生吖4 天前
前后端分离体育服务项目,场馆计费+线下赛事排行小程序部署开发教程
java·小程序·uni-app