Hệ thống trò chuyện hoặc ứng dụng Trò chuyện chủ yếu được sử dụng để giao tiếp với những người như bạn bè, khách hàng, đồng nghiệp, v.v. Đây là một phần quan trọng của bất kỳ doanh nghiệp nào vì hầu hết các công ty đều tích hợp hệ thống trò chuyện vào trang web của họ để liên lạc với khách hàng nhằm hỗ trợ họ về các dịch vụ và giải quyết các vấn đề
Ngoài ra, đọc
- Tạo bảng có thể chỉnh sửa trực tiếp với jQuery, PHP và MySQL
- Xây dựng hệ thống hóa đơn với PHP & MySQL
- Trực tiếp Thêm Chỉnh sửa Xóa bản ghi dữ liệu với Ajax, PHP và MySQL
Vì vậy, nếu bạn đang tìm cách phát triển hệ thống trò chuyện của riêng mình thì bạn đang ở đây đúng nơi. Trong hướng dẫn này, bạn sẽ học cách phát triển hệ thống trò chuyện trực tiếp với Ajax, PHP và MySQL. Chúng tôi sẽ trình bày hướng dẫn này theo các bước đơn giản để phát triển bản demo trò chuyện trực tiếp để tạo hệ thống trò chuyện hoàn chỉnh
Vì chúng tôi sẽ giới thiệu hướng dẫn này với ví dụ trực tiếp để xây dựng hệ thống trò chuyện trực tiếp với Ajax, PHP & MySQL, nên các tệp chính cho ví dụ này như sau
- mục lục. php
- đăng nhập. php
- trò chuyện. js
- chat_action. php
- đăng xuất. php
- Trò chuyện. php
Bước 1. Tạo bảng cơ sở dữ liệu
Chúng tôi sẽ tạo các bảng cơ sở dữ liệu MySQL được sử dụng để xây dựng hệ thống trò chuyện. Vì vậy, đầu tiên chúng ta sẽ tạo bảng chat_users để lưu trữ thông tin đăng nhập của người dùng
CREATE TABLE `chat_users` [ `userid` int[11] NOT NULL, `username` varchar[255] NOT NULL, `password` varchar[255] NOT NULL, `avatar` varchar[255] NOT NULL, `current_session` int[11] NOT NULL, `online` int[11] NOT NULL ] ENGINE=InnoDB DEFAULT CHARSET=latin1;
chúng tôi cũng sẽ chèn một vài bản ghi người dùng bằng cách sử dụng truy vấn chèn bên dưới
INSERT INTO `chat_users` [`userid`, `username`, `password`, `avatar`, `current_session`, `online`] VALUES [1, 'Rose', '123', 'user1.jpg', 3, 0], [2, 'Smith', '123', 'user2.jpg', 1, 0], [3, 'adam', '123', 'user3.jpg', 1, 0], [4, 'Merry', '123', 'user4.jpg', 0, 0], [5, 'katrina', '123', 'user5.jpg', 0, 0], [6, 'Rhodes', '123', 'user6.jpg', 0, 0];
Chúng tôi sẽ tạo bảng trò chuyện để lưu trữ chi tiết trò chuyện
CREATE TABLE `chat` [ `chatid` int[11] NOT NULL, `sender_userid` int[11] NOT NULL, `reciever_userid` int[11] NOT NULL, `message` text NOT NULL, `timestamp` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP, `status` int[1] NOT NULL ] ENGINE=InnoDB DEFAULT CHARSET=latin1;
Chúng tôi cũng sẽ tạo bảng chat_login_details để lưu trữ hoạt động trò chuyện đã đăng nhập
CREATE TABLE `chat_login_details` [ `id` int[11] NOT NULL, `userid` int[11] NOT NULL, `last_activity` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP, `is_typing` enum['no','yes'] NOT NULL ] ENGINE=InnoDB DEFAULT CHARSET=latin1;
Bước 2. Đăng nhập người dùng trò chuyện
Đầu tiên chúng ta sẽ tạo giao diện đăng nhập chat trong login. php để đăng nhập vào hệ thống trò chuyện
Chat Login:
User:Password:Login
Chúng tôi sẽ triển khai chức năng đăng nhập trên biểu mẫu gửi trong đăng nhập. php. Chúng tôi sẽ bao gồm Trò chuyện. php để xử lý đăng nhập của người dùng với phương thức loginUsers[]. Chúng tôi sẽ lưu trữ chi tiết đăng nhập của người dùng trong các biến SESSION để sử dụng thêm trong hệ thống
$loginError = ''; if [!empty[$_POST['username']] && !empty[$_POST['pwd']]] { include ['Chat.php']; $chat = new Chat[]; $user = $chat->loginUsers[$_POST['username'], $_POST['pwd']]; if[!empty[$user]] { $_SESSION['username'] = $user[0]['username']; $_SESSION['userid'] = $user[0]['userid']; $lastInsertId = $chat->insertUserLoginDetails[$user[0]['userid']]; $_SESSION['login_details_id'] = $lastInsertId; header["Location:index.php"]; } else { $loginError = "Invalid username or password!"; } }
Bước 3. Tạo HTML hệ thống trò chuyện
trong chỉ mục. php, chúng ta sẽ gộp các file Bootstrap, jQuery và CSS để tạo giao diện hệ thống chat với Bootstrap
Sau khi người dùng đăng nhập, nó sẽ chuyển hướng đến chỉ mục. php nơi chúng tôi sẽ hiển thị hệ thống trò chuyện với danh sách người dùng và chi tiết trò chuyện của người dùng. Vì vậy, bây giờ chúng tôi sẽ tạo HTML hệ thống trò chuyện để tải chi tiết trò chuyện từ bảng cơ sở dữ liệu MySQL sau khi người dùng đăng nhập thành công
Vì vậy, trước tiên, chúng tôi sẽ lấy chi tiết về chi tiết người dùng trò chuyện đã đăng nhập hiện tại từ bảng cơ sở dữ liệu chat_users bằng phương thức trò chuyện getUserDetails[] từ Trò chuyện. php
Bây giờ chúng ta sẽ lấy thông tin chi tiết của tất cả người dùng trò chuyện từ bảng cơ sở dữ liệu chat_users bằng cách sử dụng phương thức trò chuyện chatUsers[] từ Trò chuyện. php và hiển thị danh sách người dùng
________số 8_______
và cuối cùng, chúng ta sẽ nhận được thông tin chi tiết về cuộc trò chuyện của người dùng trò chuyện đang hoạt động hiện tại từ trò chuyện bảng cơ sở dữ liệu bằng cách sử dụng phương thức trò chuyện getUserChat[] từ Trò chuyện. php và hiển thị chi tiết trò chuyện
Bước 4. Xử lý trả lời trò chuyện của người dùng
Chúng tôi sẽ xử lý chức năng gửi tin nhắn trong trò chuyện. js khi nhấp vào nút gửi tin nhắn và gọi hàm sendMessage[]
INSERT INTO `chat_users` [`userid`, `username`, `password`, `avatar`, `current_session`, `online`] VALUES [1, 'Rose', '123', 'user1.jpg', 3, 0], [2, 'Smith', '123', 'user2.jpg', 1, 0], [3, 'adam', '123', 'user3.jpg', 1, 0], [4, 'Merry', '123', 'user4.jpg', 0, 0], [5, 'katrina', '123', 'user5.jpg', 0, 0], [6, 'Rhodes', '123', 'user6.jpg', 0, 0];0
Chúng tôi sẽ tạo một hàm JavaScript sendMessage[] trong trò chuyện. js trong đó chúng tôi sẽ thực hiện yêu cầu Ajax tới chat_action. php với hành động insert_chat để chèn trò chuyện của người dùng vào cơ sở dữ liệu và cập nhật cuộc trò chuyện của người dùng bằng tin nhắn đã trả lời
INSERT INTO `chat_users` [`userid`, `username`, `password`, `avatar`, `current_session`, `online`] VALUES [1, 'Rose', '123', 'user1.jpg', 3, 0], [2, 'Smith', '123', 'user2.jpg', 1, 0], [3, 'adam', '123', 'user3.jpg', 1, 0], [4, 'Merry', '123', 'user4.jpg', 0, 0], [5, 'katrina', '123', 'user5.jpg', 0, 0], [6, 'Rhodes', '123', 'user6.jpg', 0, 0];1
Trong chat_action. php, chúng tôi sẽ gọi phương thức trò chuyện insertChat[] để chèn chi tiết trò chuyện
INSERT INTO `chat_users` [`userid`, `username`, `password`, `avatar`, `current_session`, `online`] VALUES [1, 'Rose', '123', 'user1.jpg', 3, 0], [2, 'Smith', '123', 'user2.jpg', 1, 0], [3, 'adam', '123', 'user3.jpg', 1, 0], [4, 'Merry', '123', 'user4.jpg', 0, 0], [5, 'katrina', '123', 'user5.jpg', 0, 0], [6, 'Rhodes', '123', 'user6.jpg', 0, 0];2
Phương thức insertChat[] từ Chat. chiều để chèn trò chuyện của người dùng
INSERT INTO `chat_users` [`userid`, `username`, `password`, `avatar`, `current_session`, `online`] VALUES [1, 'Rose', '123', 'user1.jpg', 3, 0], [2, 'Smith', '123', 'user2.jpg', 1, 0], [3, 'adam', '123', 'user3.jpg', 1, 0], [4, 'Merry', '123', 'user4.jpg', 0, 0], [5, 'katrina', '123', 'user5.jpg', 0, 0], [6, 'Rhodes', '123', 'user6.jpg', 0, 0];3
Bước5. Cập nhật danh sách người dùng trò chuyện Thông tin
Trong trò chuyện. js, chúng ta sẽ tạo hàm updateUserList[] để cập nhật thông tin danh sách người dùng trò chuyện như trạng thái trực tuyến của người dùng bằng cách thực hiện yêu cầu Ajax tới chat_action. php
INSERT INTO `chat_users` [`userid`, `username`, `password`, `avatar`, `current_session`, `online`] VALUES [1, 'Rose', '123', 'user1.jpg', 3, 0], [2, 'Smith', '123', 'user2.jpg', 1, 0], [3, 'adam', '123', 'user3.jpg', 1, 0], [4, 'Merry', '123', 'user4.jpg', 0, 0], [5, 'katrina', '123', 'user5.jpg', 0, 0], [6, 'Rhodes', '123', 'user6.jpg', 0, 0];4
Trong chat_action. php, chúng tôi sẽ xử lý hành động yêu cầu Ajax để trả về trạng thái nhập của người dùng dưới dạng phản hồi dữ liệu JSON