Xây dựng ứng dụng chatbox là đề tài tôi chọn để làm đồ án tốt nghiệp của mình. Trong bối cảnh thế giới đang chuyển đổi số, mạng xã hội đã trở thành một phần không thể thiếu trong cuộc sống của chúng ta, bên cạnh đó còn xuất hiện các ứng dụng từ trí tuệ nhân tạo(AI) nó giải quyết gần như chính xác các vấn đề của con người đưa ra. Trong đề tài này, tôi tập trung vào việc phát triển một ứng dụng mạng xã hội với việc tích hợp tính năng chat với trí tuệ nhân tạo(AI). Ứng dụng này cho phép người dùng tạo tài khoản, chia sẻ thông tin cá nhân, đăng bài viết, chia sẻ hình ảnh và video với bạn bè, gia đình và những người quan tâm đến mình. Trong khi đó, tính năng chatbox sẽ giúp người dùng tương tác với một trí tuệ nhân tạo thông qua giao diện chat. Trí tuệ nhân tạo này sẽ giúp người dùng trả lời câu hỏi, đưa ra các khuyến nghị và thậm chí có thể đưa ra các lời khuyên về sức khỏe, hướng dẫn về lối sống, thời tiết, tin tức và nhiều nội dung khác. Ngoài ra, ứng dụng còn cung cấp cho phép người dùng có thể tìm kiếm các hình ảnh thông qua đoạn văn do người dùng miêu tả và khi đó AI sẽ đọc và tạo ra bức ảnh gần giống như miểu tả của người dùng. Người dùng cũng có thể chia sẻ ngay cho cộng đồng hoặc lưu về bộ sưu tập cho riêng mình. Trong quá trình phát triển ứng dụng, em đã sử dụng nhiều công nghệ và kỹ thuật như Node.js, React, Redux, MongoDB, Mongoose và các thư viện và công cụ khác để xây dựng các tính năng. Em cũng đã tham khảo các tài liệu và giáo trình để hiểu rõ hơn về các công nghệ này và áp dụng chúng vào thực tế.
PHÂN TÍCH VÀ THIẾT KẾ
Phân tích và thiết kế chức năng
2.1.1 Phân tích nghiệp vụ Đăng ký và đăng nhập: Cung cấp chức năng đăng ký tài khoản mới cho người dùng mới không tồn tại trong hệ thống Có 4 hình thức đăng kí người dùng mới Hình thức đăng ký thứ nhất, khi người dùng đăng ký hệ thống sẽ kiểm tra một số trường quan trọng như email và số điện thoại của người dùng đã đúng định dạng và đã tồn tại trong hệ thống chưa, đối với trường password kiểm tra đã đúng định dạng và khi người dùng đăng ký thì hệ thống sẽ gửi tin nhắn về cho email mà bạn đã đăng kí, khi đó người dùng vào email của mình và click vào đường dẫn để xác thực đăng ký thành công, khi đó người dùng đã có thể đăng nhập trên hệ thống Các hình thức còn lại là đăng ký hoặc đăng nhập dựa bên bên thứ 3 như google, facebook, github và cho phép từ bên thứ 3 để lưu thông tin người dùng để đăng nhập vào trang web
Tin nhắn và chat AI: Cung cấp khả năng gửi tin nhắn và chat với người dùng khác, người dùng cũng có thể tạo nhóm và thêm các người dùng khác vào nhóm và nếu người dùng muốn tích hợp trí tuệ nhân tạo để cung cấp trải nghiệm chat AI thông minh và tương tác, được gọi api từ chatGPT Khi người khác gửi cho người dùng thì thông báo sẽ được gửi về cho người dùng
Chat AI: người dùng cũng có thể hỏi riêng chat AI mà không muốn ảnh hưởng người dùng khác Nếu người dùng ở role là basic thì hệ thống sẽ giới hạn lượt hỏi trong ngày và số lượng lượt hỏi sẽ được reset lại về không vào thời gian 0 giờ của ngày Nếu người dùng không muốn bị giới hạn về lượt hỏi, người dùng có thể nâng cấp tài khoản khi đó role sẽ được cập nhật
Tìm ảnh được miêu tả: khi người dùng nhập một chuỗi miêu tả về bức ảnh mong muốn hoặc người dùng cũng có thể chọn ngẫu nhiên chủ đề hệ thống sẽ ra ngẫu nhiên chủ đề và được gọi đến api của dalle của openAI Số lượng ảnh tìm kiếm sẽ là 1 nhưng nếu tài khoản được nâng cấp thì số lượng ảnh sẽ sẽ được nâng lên Khi tìm ảnh thành công người dùng có thể lưu về cho bộ sưu tập của mình hoặc chia sẻ cho cộng đồng
Quản lý hồ sơ người dùng: Cho phép người dùng tạo và quản lý hồ sơ cá nhân, bao gồm thông tin cá nhân, hình ảnh đại diện, quyền riêng tư, và các thông tin khác như các trường birthday, intro, firstname, lastname, avatar Người dùng không được phép chỉnh sửa trường email
Kết bạn và quản lý danh sách bạn bè: Cho phép người dùng kết bạn, theo dõi với nhau, tìm kiếm và thêm bạn bè, xem và quản lý danh sách bạn bè Người dùng cũng có thể chặn người dùng khác theo các lựa chọn về thời gian Đăng bài và chia sẻ nội dung: Cho phép người dùng đăng bài viết, ảnh và chia sẻ nội dung với cộng đồng, giúp tăng tương tác với mọi người Người dùng cũng có thể chia sẻ bài viết thông ra mã QR code được tạo khi tạo cùng bài viết
Tìm kiếm và khám phá: Cung cấp tính năng tìm kiếm người dùng, bài viết và nội dung khác, và cung cấp khả năng khám phá nội dung phù hợp dựa trên sở thích và quan tâm của người dùng
Quản lý báo cáo: Cung cấp khả năng báo cáo và quản lý vi phạm của bài viết hoặc của người dùng, đảm bảo an ninh và đáng tin cậy cho cộng đồng người dùng
Tương tác và bình luận: Cung cấp khả năng tương tác như thích, bình luận, chia sẻ giữa các người dùng trong hệ thống Người dùng có thể tag username người dùng khác vào đoạn comment mà người dùng mong muốn
Thông báo khi có tương tác: Khi người dùng có tác động đến bài viết của người tạo bài viết hoặc người được nhắc đến trong đó, cũng có thể là các hành động theo dõi người dùng thì người dùng bị tác động sẽ nhận được các thông báo khi đó người dùng thể xem chi tiết thông báo đó
Nâng cấp tài khoản: người dùng nâng cấp tài khoản bằng cách thanh toán online được cung cấp bởi bên thứ 3 là VNPay khi nâng cấp thì quyền của người dùng cũng được nâng lên role pro
Top bài viết: những bài viết này là những bài viết có ảnh được lấy từ hệ thống có lượt tương tác cao như like, comment, share Ở đây thì người dùng không có tài khoản cũng có thể xem được những bài viết này
Người quản trị: Quản lý các bài viết, lịch sử tương tác, quản lý các báo cáo từ người dùng, thực hiện các chức năng quản trị cần thiết Xuất báo cáo thống kê về người dùng, lượt tương tác của chat AI, doanh thu khi người dùng nâng cấp tài khoản
2.1.2 Biểu đồ phân cấp chức năng
Hình 2 1 Sơ đồ phân giã chức năng(BFD) a Quản lý người dùng :
- Chức năng đăng ký cho phép người dùng tạo tài khoản cá nhân mới để truy cập và sử dụng các tính năng của trang web
+ Nhập thông tin cá nhân: Người dùng sẽ được yêu cầu nhập các thông tin cá nhân cần thiết như tên, địa chỉ email, mật khẩu và các thông tin khác
+ Xác thực tài khoản: Sau khi nhập thông tin cá nhân, người dùng cần xác thực tài khoản của mình Hệ thống sẽ gửi một liên kết xác nhận đến địa chỉ email mà người dùng đã đăng ký Người dùng cần kiểm tra email và nhấp vào liên kết xác nhận để hoàn tất quá trình đăng ký
Phân tích và thiết kế dữ liệu
- Đăng ký: Mở form cho người dùng sử dụng đăng ký Tài khoản, điến các thông tin cần thiết của bản thân như họ, tên, ngày sinh, số điện thoại, email, mật khẩu,…
- Đăng nhập: Xác thực vào hệ thống với tư cách một tài khoản bằng email và mật khẩu hoặc người dùng có thể đăng nhập với các bên thứ 3 như google, facebook,…
- Cập nhật tài khoản: cho phép người quản trị viên sửa và xóa thông tin một tài khoản ( trừ tài khoản của quản lý) Người quản lý có quyền gán vai trò cho một tài khoản
Người dùng được cập cập nhật lại một số thông tin như số điện thoại, giới thiệu bản thân…
- Phân quyền người dùng: cấp các quyền cho một vai trò
- Cập nhật thông tin bài viết: khi người dùng thêm, sửa bài viết với các trường nội dung, các hình ảnh, trạng thái bài viết, trạng thái hoạt động,
- Người dùng có thể xoá bài viết nếu người đó là chủ sở hữu bài viết
- Người quản trị có quyền cập nhật trạng thái bài viết có hoạt động hay không, nếu thoả mãn chính sách cộng đồng
- Ảnh của bài viết: Người dùng cũng có thể thêm hoặc xoá bức ảnh của bài viết
• Bình luận bài viết: Người dùng có thể thêm, sửa, xoá thông bình luận gồm nội dung, hình ảnh, mã người dùng bình luận, mã bài viết, …
• Thích bài viết: người dùng có thể thêm, cập nhật trạng thái thích bài viết Khi người dùng thích bài viết thì các trường được tạo như mã người dùng, mã bài viết, trạng thái Người dùng có thể bỏ thích bài viết khi đó trạng thái sẽ được cập nhật
• Following: khi người dùng gửi lời kết bạn thì các trường được tạo như mã người gửi, mã người nhận, trạng thái người nhận, trạng thái người gửi,….Khi người huỷ lời mời, hoặc được chấp nhận thì các trương trạng thái sẽ được cập nhật
• Bộ sưu tập: người dùng lưu thông tin ảnh sưu tập gồm các trường: nội dung mô tả, hình ảnh, mã người dùng tạo ảnh, trạng thái, trạng thái chia sẻ
• Tin nhắn với AI: khi người dùng tạo mới chat thì tiêu đề chat được tạo, và gồm mảng chat bao gồm mã chat, trạng thái người gửi, nội dung,…
• Tin nhắn với người dùng: người dùng tạo mới chat với người dùng các trường được tạo như loại phòng, ảnh đại diện phòng, trạng thái công khai của phòng, trạng thái phòng có thêm AI, và mảng chat của tất cả mọi người trong nhóm và bên trong có các thông tin chat con như người gửi, nội dung chat, ảnh, trạng thái
2.2.2 Các thực thể, mối quan hệ giữa các thực thể và quan hệ dữ liệu
Bảng 2 1 Người dùng STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã người dùng Khoá chính int
2 firstName Họ người dùng Not null varchar(50)
3 lastName Tên người dùng Not null varchar(50)
4 email Email người dùng Not null varchar(52)
5 password Mật khẩu Not null varchar(45)
6 username Tên username Not null varchar(45)
7 intro Giới thiệu Null varchar(200)
8 phone Điện thoại Null char(10)
9 brithday Ngày sinh Null timestamp
10 avatar Ảnh đại diện Null varchar(45)
11 role Quyền người dùng Not Null enum
12 isVeryEmail Trạng thái xác thực email Null boolean
13 refreshToken Mã bí mật Not Null varchar(150)
14 status Trạng thái tài khoản Null Varchar(45)
15 is_active Trạng thái hoạt động Null boolean
16 createAt Thời gian tạo tài khoản Not Null timestamp 17 updateAt Thời gian cập nhật tài khoản Not Null timestamp
18 deleteAt Thời gian xoá tài khoản Null timestamp
Bảng 2 2 Bài viết STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã bài viết Khoá chính int
2 content Nội dung bài viết Null nvarchar(255)
3 userId Mã người dùng Khoá ngoại int
4 qrcode Link qr code Not Null varchar(50)
5 is_active Trạng thái hoạt động bài viết Null boolean
6 status Trạng thái Null varchar(45)
7 createAt Thời gian tạo Not Null timestamp
8 updateAt Thời gian sửa Not Null timestamp
9 deleteAt Thời gian xoá Null timestamp
• Image_post: ảnh bài viết
Bảng 2 3 Ảnh bài viết STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã ảnh bài viết Khoá chính int
2 photo Link ảnh Not Null varchar(50)
3 note Ghi chú ảnh Null nvarchar(255)
4 postId Mã bài viết Khoá Ngoại int
5 is_active Trạng thái hoạt động Null boolean
6 createAt Thời gian tạo Not Null timestamp
7 updateAt Thời gian cập nhật Not Null timestamp
8 deleteAt Thời gian xoá Null timestamp
• Comments: bình luận bài viết
Bảng 2 4 Bình luật bài viết STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã bình luận Khoá chính int
2 content Nội dung bình luận Not Null nvarchar(1000)
3 photo Ảnh bình luận Not Null nvarchar(100)
4 userId Mã người dùng Khoá ngoại int
5 postId Mã bài viết Khoá Ngoại int
6 repCommentId Mã bình luận trả lời Null int
7 status Trạng thái Null varchar(45)
8 is_active Trạng thái hoạt động Null boolean
9 createAt Thời gian tạo Not Null timestamp
10 updateAt Thời gian sửa Not Null timestamp
11 deleteAt Thời gian xoá Null timestamp
• Like_comment: thích bình luận
Bảng 2 5 Like bình luận STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã thích bình luận Khoá chính int
2 userId Mã người dùng Khoá ngoại nvarchar(255)
3 commentId Mã bình luận Khoá ngoại nvarchar(255)
4 status Trạng thái Null varchar(45)
5 is_active Trạng thái hoạt động Null boolean
6 createAt Thời gian tạo Not Null timestamp
7 updateAt Thời gian cập nhật Not Null timestamp
8 deleteAt Thời gian xoá Not Null timestamp
• Like_post: thích bài viết
Bảng 2 6 Like bài viết STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã thích bài viết Khoá chính int
2 postId Mã bài viết Khoá ngoại nvarchar(255)
3 userId Mã người dùng Khoá Ngoại nvarchar(255)
4 createAt Thời gian tạo thích bài viết Not Null timestamp 5 updateAt Thời gian cập nhật thích bài viết Not Null timestamp
6 deleteAt Thời gian xoá thích bài viết Null timestamp
Bảng 2 7 Kết bạn STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã kết bạn Khoá chính int
2 creatorId Mã người dùng tạo Khoá ngoại int
3 receiverId Mã người dùng nhận Khoá ngoại int
4 creatorStatus Trạng thái ngừoi tạo Not Null varchar(50) 5 receiverStatus Trạng thái người nhận Not Null varchar(50) 6 creatorBlock Trạng thái người tạo chặn Null boolean 7 receiverBlock Trạng thái người nhận chặn Null boolean
8 status Trạng thái Null varchar(50)
9 createAt Thời gian tạo Not Null timestamp
10 updateAt Thời gian cập nhật Not Null timestamp
11 deleteAt Thời gian xoá Null timestamp
Bảng 2 8 Sưu tập STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã ảnh sưu tập Khoá chính int
2 prompt Đoạn mô tả hình ảnh Not Null nvarchar(500)
3 photo Link hình ảnh Not Null nvarchar(100)
4 userId Mã ngừoi dùng Khoá ngoại int
5 is_share Trạng thái chia sẻ Null boolean
6 status Trạng thái Null varchar(50)
7 createAt Thời gian tạo Not Null timestamp
8 updateAt Thời gian cập nhật Not Null timestamp
9 deleteAt Thời gian xoá Null timestamp
• Chat_ai: chat với AI
Bảng 2 9 Tin nhắn với AI STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã chat AI Khoá chính int
2 topic Tên chat Not Null nvarchar(100)
3 userId Mã người dùng Khoá ngoại int
4 status Trạng thái Null nvarchar(45)
5 createAt Thời gian tạo Not Null timestamp
6 updateAt Thời gian sửa Not Null timestamp
7 deleteAt Thời gian xoá Null timestamp
• Chat_ai_msg: tin nhắn trong chat với AI
Bảng 2 10 Tin nhắn của chat với AI STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã tin nhắn Khoá chính int
2 chatAIId Mã chat Khoá phụ int
3 userSend Đối tượng gửi Not Null boolean
4 message Nội dung tin nhắn Not Null nvarchar(2000)
5 status Trạng thái Null nvarchar(45)
6 createAt Thời gian tạo Not Null timestamp
7 updateAt Thời gian sửa Not Null timestamp
8 deleteAt Thời gian xoá Null timestamp
• Chat_user: chat với người dùng khác
Bảng 2 11 Tin nhắn với người dùng STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã chat với người dùng Khoá chính int
2 typeRoom Loại chat Not Null nvarchar(45)
3 avatarRoom Ảnh đại diện chat Null nvarchar(100)
4 public Trạng thái công khai Null boolean
5 typeAI Trạng thái thêm AI Null boolena
6 is_active Trạng thái hoạt động Null boolean
7 status Trạng thái Null nvarchar(45)
8 createAt Thời gian tạo Not Null timestamp
9 updateAt Thời gian cập nhật Not Null timestamp
10 deleteAt Thời gian xoá Null timestamp
• Members: thành viên trong chat
Bảng 2 12 Thành viên trong chat STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã thành viên Khoá chính int
2 userId Mã người dùng Khoá ngoại int
3 chatUserId Mã chat Khoá ngoại int
4 status Trạng thái Null nvarchar(45)
5 nickName Tên người dùng trong chat Null nvarchar(55)
6 is_manage Trạng thái người quản lý Null boolean
7 createAt Thời gian tạo Not Null timestamp
8 updateAt Thời gian cập nhật Not Null timestamp
9 deleteAt Thời gian xoá Null timestamp
• Notification_chat: thông báo tin nhắn chat
Bảng 2 13 Thông báo tin nhắn chat STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã thông báo người dùng Khoá chính int
2 chatUserId Mã chat Khoá ngoại int
3 memberId Mã thành viên Khoá ngoại int
4 amount Số lượng thông báo Null int
5 is_avtive Trạng thái hoạt động Null boolean
6 status Trạng thái Null nvarchar(45)
7 createAt Thời gian tạo Not Null timestamp
8 updateAt Thời gian cập nhật Not Null timestamp
9 deleteAt Thời gian xoá Null timestamp
• Messages: tin nhắn trong chat với người dùng
Bảng 2 14 Tin nhắn chat với ngừoi dùng STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã tin nhắn Khoá chính int
2 textChat Nội dung tin nhắn Null nvarchar(2000)
3 memberSendId Mã thành viên Khoá ngoại int
4 chatUserId Mã chat Khoá ngoại int
5 photo Link ảnh Null nvarchar(45)
6 is_active Trạng thái hoạt động Null boolean
7 status Trạng thái Null nvarchar(45)
8 createAt Thời gian tạo Not Null timestamp
9 updateAt Thời gian cập nhật Not Null timestamp
10 deleteAt Thời gian xoá Null timestamp
• deleteBy: trạng thái tin nhắn bị xoá
Bảng 2 15 Trạng thái tin nhắn bị xoá STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã xoá tin nhắn Khoá chính int
2 messageId Mã tin nhắn Khoá ngoại int
3 memberId Mã thành viên xoá Khoá ngoại int
4 status Trạng thái Null nvarchar(45)
5 createAt Thời gian tạo Not Null timestamp
• reading: trạng thái đọc tin nhắn
Bảng 2 16 Trạng thái đọc tin nhắn STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã đọc tin nhắn Khoá chính int
2 messageId Mã tin nhắn Khoá ngoại int
3 memberId Mã thành viên đọc Khoá ngoại int
4 status Trạng thái Null nvarchar(45)
5 createAt Thời gian tạo Not Null timestamp
• payment: thanh toán nâng cấp tài khoản
Bảng 2 17 Thanh toán STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã thanh toán Khoá chính int
2 userId Mã người dùng Khoá ngoại int
3 money Số tiền thanh toán Not Null int
4 note Thông tin ghi chú Null nvarchar(255)
5 tradingCode Mã code thanh toán Not Null nvarchar(255)
6 createAt Thời gian thanh toán Not Null timestamp
• question_ai: số lượng hỏi trong một ngày dành cho tài khoản chưa nâng cấp
Bảng 2 18 Số lượng hỏi STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã câu hỏi Khoá chính int
2 userId Mã người dùng Khoá ngoại int
3 amount Số lương câu đã hỏi Null int
4 createAt Thời gian tạo Not Null timestamp
5 updateAt Thời gian cập nhật Not Null timestamp
• notificationMain: thông báo chung cho tương tác
Bảng 2 19 Thông báo tuơng tác STT Tên thực thể Mô tả Ràng buộc Kiểu dữ liệu – Độ dài
1 _id Mã thông báo Khoá chính int
2 userReceiver Mã người dùng nhận Khoá ngoại int
3 userSend Mã người dùng gửi Khoá ngoại int
4 read Trạng thái đọc Null boolean
5 type Kiểu thông báo Null nvarchar(45)
6 status Trạng thái Not Null nvarchar(55)
7 delete Trạng thái xoá Null boolean
8 createAt Thời gian tạo Not Null timestamp
Hình 2 22 Biểu đồ quan hệ
XÂY DỰNG VÀ CÀI ĐẶT CHƯƠNG TRÌNH
Môi trường cài đặt
- Chương trình được cài đặt trên laptop cấu hình:
+ Laptop Macbook M1 + Hệ điều hành: macOS 13 + Ram: 16 GB
- Trình soạn thảo: vs code - Framework: nestjs, vite - cơ sở dữ liệu: mongo atlas, redis, firebase
Chương trình
3.2.1 Giao diện cho người dùng
Hình 3 1 Giao diện đăng kí
Hình 3 2 Giao diện đăng nhập
Hình 3 3 Giao diện trang chủ
Hình 3 4 Giao diện cá nhân và bài viết
Hình 3 5 Giao diện cá nhân và bộ sưu tập
Hình 3 6 Giao diện tìm kiếm hình ảnh
Hình 3 7 Giao diện tìm kiếm avatar
Hình 3 8 Giao diện chat bot
• Trang tin nhắn với người dùng
Hình 3 9 Giao diện tin nhắn với người dùng
Hình 3 10 Giao diện tạo bài viết
Hình 3 11 Giao diện top bài viết
• Trang nâng cấp tài khoản
Hình 3 12 Giao diện nâng cấp tài khoản 3.2.2 Giao diện cho người quản trị
Hình 3 13 Giao diện quản lý người dùng
Hình 3 14 Giao diện quản lý bài viết
Hình 3 15 Giao diện quản lý giao dịch
