开发体育赛事直播系统：实现聊天交友的私聊功能技术实现全方案解析

基于“东莞梦幻网络科技”体育赛事直播系统，展示前后端技术（PHP ThinkPHP + Vue.js + Android Java + iOS OC）实现的“用户与用户之间私聊”完整方案，包括功能描述、界面效果、技术实现、数据结构、接口设计及关键代码示例。

一、私聊聊天功能模块包含：

1、用户与用户之间一对一私聊。
2、显示聊天记录、发送时间。
3、未读消息红点提示。
4、消息免打扰（可切换）。
5、聊天窗口置顶。
6、删除聊天、清空聊天记录。
7、发送消息、图片、表情等。

二、技术实现方案技术栈：

1、后端： PHP (ThinkPHP)
2、数据库： MySQL
3、实时通信： WebSocket + Redis（用于消息推送 & 未读消息计数）
4、前端（H5/PC）： Vue.js
5、移动端： Java (Android)、Objective-C (iOS)

三、数据结构设计（MySQL）

1、用户表 users

CREATE TABLE `users` (`id` INT AUTO_INCREMENT PRIMARY KEY,`username` VARCHAR(50),`avatar` VARCHAR(255),`status` TINYINT DEFAULT 1
);

2、聊天消息表 chat_messages

CREATE TABLE `chat_messages` (`id` INT AUTO_INCREMENT PRIMARY KEY,`sender_id` INT,`receiver_id` INT,`content` TEXT,`send_time` DATETIME,`is_read` TINYINT DEFAULT 0,`is_deleted` TINYINT DEFAULT 0
);

3、聊天设置表 chat_settings

CREATE TABLE `chat_settings` (`id` INT AUTO_INCREMENT PRIMARY KEY,`user_id` INT,`chat_user_id` INT,`is_top` TINYINT DEFAULT 0,`no_disturb` TINYINT DEFAULT 0
);

四、后端接口设计（ThinkPHP）

1、获取聊天列表

public function getChatList($userId)
{$chats = ChatModel::getChatListByUser($userId); // 关联读取chat_settings、last_messagereturn json(['status' => 1, 'data' => $chats]);
}

2、获取聊天记录

public function getMessages(Request $request)
{$userId = $request->param('user_id');$peerId = $request->param('peer_id');$messages = ChatMessageModel::getMessages($userId, $peerId);return json(['status' => 1, 'data' => $messages]);
}

3、发送消息

public function sendMessage(Request $request)
{$data = $request->post();ChatMessageModel::send($data['sender_id'], $data['receiver_id'], $data['content']);// WebSocket推送WebSocketService::pushToUser($data['receiver_id'], $data);return json(['status' => 1, 'msg' => '发送成功']);
}

五、Vue 前端页面实现（关键代码）

1、聊天列表组件

<template><div class="chat-list"><div v-for="chat in chatList" :key="chat.user_id" class="chat-item"><div class="avatar"><img :src="chat.avatar"></div><div class="info"><div class="name">{{ chat.username }}</div><div class="last-msg">{{ chat.last_message }}</div><div class="time">{{ chat.last_time }}</div><div v-if="chat.unread_count > 0" class="red-dot">{{ chat.unread_count }}</div></div><el-dropdown><span class="el-dropdown-link">···</span><el-dropdown-menu slot="dropdown"><el-dropdown-item @click.native="setTop(chat)">置顶聊天</el-dropdown-item><el-dropdown-item @click.native="deleteChat(chat)">删除聊天</el-dropdown-item><el-dropdown-item @click.native="clearMessages(chat)">清空消息</el-dropdown-item></el-dropdown-menu></el-dropdown></div></div>
</template>

2、聊天窗口

<template><div class="chat-window"><div class="header">{{ targetUser.username }}<el-switch v-model="noDisturb" @change="toggleNoDisturb">消息免打扰</el-switch></div><div class="chat-content"><div v-for="msg in messages" :class="{'mine': msg.sender_id === userId}"><div class="message">{{ msg.content }}</div><div class="time">{{ msg.send_time }}</div></div></div><div class="input-area"><el-input v-model="input" @keyup.enter="sendMessage" placeholder="请输入消息..." /></div></div>
</template>

六、Android Java 实现（部分代码）

public class ChatListActivity extends AppCompatActivity {private RecyclerView chatListView;private ChatListAdapter adapter;private List<ChatItem> chatItems = new ArrayList<>();@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_chat_list);chatListView = findViewById(R.id.chat_list_view);chatListView.setLayoutManager(new LinearLayoutManager(this));adapter = new ChatListAdapter(chatItems, new ChatListAdapter.OnItemClickListener() {@Overridepublic void onItemClick(ChatItem item) {openChatWindow(item);}@Overridepublic void onMoreClick(ChatItem item, View view) {showChatMenu(item, view);}});chatListView.setAdapter(adapter);loadChatList();}private void loadChatList() {// 调用API获取聊天列表ApiService.getInstance().getChatList(new ApiCallback<List<ChatItem>>() {@Overridepublic void onSuccess(List<ChatItem> result) {chatItems.clear();chatItems.addAll(result);adapter.notifyDataSetChanged();}@Overridepublic void onFailure(String error) {Toast.makeText(ChatListActivity.this, error, Toast.LENGTH_SHORT).show();}});}private void openChatWindow(ChatItem item) {Intent intent = new Intent(this, ChatActivity.class);intent.putExtra("chat_id", item.getId());intent.putExtra("user_name", item.getUsername());startActivity(intent);}private void showChatMenu(ChatItem item, View anchorView) {PopupMenu popupMenu = new PopupMenu(this, anchorView);popupMenu.getMenuInflater().inflate(R.menu.chat_item_menu, popupMenu.getMenu());// 设置菜单项状态popupMenu.getMenu().findItem(R.id.menu_top).setTitle(item.isTop() ? "取消置顶" : "置顶");popupMenu.getMenu().findItem(R.id.menu_mute).setTitle(item.isMuted() ? "关闭免打扰" : "消息免打扰");popupMenu.setOnMenuItemClickListener(menuItem -> {switch (menuItem.getItemId()) {case R.id.menu_top:toggleTopChat(item, !item.isTop());return true;case R.id.menu_mute:toggleMuteChat(item, !item.isMuted());return true;case R.id.menu_delete:deleteChat(item);return true;case R.id.menu_clear:clearMessages(item);return true;default:return false;}});popupMenu.show();}private void toggleTopChat(ChatItem item, boolean isTop) {ApiService.getInstance().topChat(item.getId(), isTop, new ApiCallback<Void>() {@Overridepublic void onSuccess(Void result) {loadChatList();}@Overridepublic void onFailure(String error) {Toast.makeText(ChatListActivity.this, error, Toast.LENGTH_SHORT).show();}});}private void toggleMuteChat(ChatItem item, boolean isMuted) {ApiService.getInstance().muteChat(item.getId(), isMuted, new ApiCallback<Void>() {@Overridepublic void onSuccess(Void result) {loadChatList();}@Overridepublic void onFailure(String error) {Toast.makeText(ChatListActivity.this, error, Toast.LENGTH_SHORT).show();}});}private void deleteChat(ChatItem item) {new AlertDialog.Builder(this).setTitle("删除聊天").setMessage("确定要删除此聊天记录吗?").setPositiveButton("确定", (dialog, which) -> {ApiService.getInstance().deleteChat(item.getId(), new ApiCallback<Void>() {@Overridepublic void onSuccess(Void result) {loadChatList();}@Overridepublic void onFailure(String error) {Toast.makeText(ChatListActivity.this, error, Toast.LENGTH_SHORT).show();}});}).setNegativeButton("取消", null).show();}private void clearMessages(ChatItem item) {new AlertDialog.Builder(this).setTitle("清空消息").setMessage("确定要清空此聊天中的所有消息吗?").setPositiveButton("确定", (dialog, which) -> {ApiService.getInstance().clearMessages(item.getId(), new ApiCallback<Void>() {@Overridepublic void onSuccess(Void result) {loadChatList();}@Overridepublic void onFailure(String error) {Toast.makeText(ChatListActivity.this, error, Toast.LENGTH_SHORT).show();}});}).setNegativeButton("取消", null).show();}
}

七、iOS Objective-C 实现（部分代码）

#import "ChatListViewController.h"
#import "ChatItem.h"
#import "ChatViewController.h"
#import "ApiService.h"@interface ChatListViewController ()@end@implementation ChatListViewController- (void)viewDidLoad {[super viewDidLoad];self.title = @"私聊";self.chatItems = [NSMutableArray array];// 设置表格视图self.tableView = [[UITableView alloc] initWithFrame:self.view.bounds style:UITableViewStylePlain];self.tableView.delegate = self;self.tableView.dataSource = self;[self.tableView registerClass:[UITableViewCell class] forCellReuseIdentifier:@"ChatCell"];[self.view addSubview:self.tableView];// 加载数据[self loadChatList];
}- (void)loadChatList {[[ApiService sharedInstance] getChatListWithCompletion:^(NSArray *chatItems, NSError *error) {if (error) {NSLog(@"Error loading chat list: %@", error.localizedDescription);return;}[self.chatItems removeAllObjects];[self.chatItems addObjectsFromArray:chatItems];[self.tableView reloadData];}];
}#pragma mark - UITableViewDataSource- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {return self.chatItems.count;
}- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"ChatCell" forIndexPath:indexPath];ChatItem *chatItem = self.chatItems[indexPath.row];// 配置单元格cell.textLabel.text = chatItem.username;cell.detailTextLabel.text = chatItem.lastMessage;cell.imageView.image = [UIImage imageNamed:chatItem.avatar ?: @"default_avatar"];// 显示未读消息数if (chatItem.unreadCount > 0) {UILabel *badge = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 20, 20)];badge.text = [NSString stringWithFormat:@"%ld", (long)chatItem.unreadCount];badge.textColor = [UIColor whiteColor];badge.backgroundColor = [UIColor redColor];badge.textAlignment = NSTextAlignmentCenter;badge.layer.cornerRadius = 10;badge.layer.masksToBounds = YES;cell.accessoryView = badge;} else {cell.accessoryView = nil;}// 置顶聊天背景色if (chatItem.isTop) {cell.backgroundColor = [UIColor colorWithRed:0.9 green:0.95 blue:1.0 alpha:1.0];} else {cell.backgroundColor = [UIColor whiteColor];}return cell;
}#pragma mark - UITableViewDelegate- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {[tableView deselectRowAtIndexPath:indexPath animated:YES];ChatItem *chatItem = self.chatItems[indexPath.row];[self openChatWithChatItem:chatItem];
}- (NSArray<UITableViewRowAction *> *)tableView:(UITableView *)tableView editActionsForRowAtIndexPath:(NSIndexPath *)indexPath {ChatItem *chatItem = self.chatItems[indexPath.row];// 置顶/取消置顶UITableViewRowAction *topAction = [UITableViewRowAction rowActionWithStyle:UITableViewRowActionStyleNormal title:chatItem.isTop ? @"取消置顶" : @"置顶" handler:^(UITableViewRowAction * _Nonnull action, NSIndexPath * _Nonnull indexPath) {[self toggleTopChat:chatItem];}];topAction.backgroundColor = [UIColor blueColor];// 删除UITableViewRowAction *deleteAction = [UITableViewRowAction rowActionWithStyle:UITableViewRowActionStyleDestructive title:@"删除" handler:^(UITableViewRowAction * _Nonnull action, NSIndexPath * _Nonnull indexPath) {[self deleteChat:chatItem];}];return @[deleteAction, topAction];
}- (void)openChatWithChatItem:(ChatItem *)chatItem {ChatViewController *chatVC = [[ChatViewController alloc] init];chatVC.chatId = chatItem.chatId;chatVC.chatTitle = chatItem.username;[self.navigationController pushViewController:chatVC animated:YES];
}- (void)toggleTopChat:(ChatItem *)chatItem {[[ApiService sharedInstance] topChat:chatItem.chatId isTop:!chatItem.isTop completion:^(BOOL success, NSError *error) {if (success) {[self loadChatList];} else {NSLog(@"Error toggling top chat: %@", error.localizedDescription);}}];
}- (void)deleteChat:(ChatItem *)chatItem {UIAlertController *alert = [UIAlertController alertControllerWithTitle:@"删除聊天" message:@"确定要删除此聊天记录吗?" preferredStyle:UIAlertControllerStyleAlert];[alert addAction:[UIAlertAction actionWithTitle:@"取消" style:UIAlertActionStyleCancel handler:nil]];[alert addAction:[UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleDestructive handler:^(UIAlertAction * _Nonnull action) {[[ApiService sharedInstance] deleteChat:chatItem.chatId completion:^(BOOL success, NSError *error) {if (success) {[self loadChatList];} else {NSLog(@"Error deleting chat: %@", error.localizedDescription);}}];}]];[self presentViewController:alert animated:YES completion:nil];
}@end