Tải bản đầy đủ (.docx) (98 trang)

đồ án 2 phát triển ứng dụng chat

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (3.65 MB, 98 trang )

<span class="text_page_counter">Trang 1</span><div class="page_container" data-page="1">

<b>ĐẠI HỌC QUỐC GIA TP. HỒ CHÍ MINHTRƯỜNG ĐẠI HỌC CƠNG NGHỆ THƠNG TIN</b>

<b>KHOA CƠNG NGHỆ PHẦN MỀM</b>

<b>BÁO CÁO ĐỒ ÁN 2</b>

<b>PHÁT TRIỂN ỨNG DỤNG CHATNGÀNH KỸ THUẬT PHẦN MỀM</b>

<b>SINH VIÊN THỰC HIỆN</b>

<b>NGUYỄN ĐÌNH NHẬT QUANG - 20520719TRẦN ĐÌNH LỘC – 20520236</b>

<b>GIẢNG VIÊN HƯỚNG DẪNTHS. TRẦN THỊ HỒNG YẾN</b>

</div><span class="text_page_counter">Trang 2</span><div class="page_container" data-page="2">

<b>SINH VIÊN THỰC HIỆN</b>

<b>NGUYỄN ĐÌNH NHẬT QUANG - 20520719TRẦN ĐÌNH LỘC – 20520236</b>

<b>GIẢNG VIÊN HƯỚNG DẪNTHS. TRẦN THỊ HỒNG YẾN</b>

</div><span class="text_page_counter">Trang 3</span><div class="page_container" data-page="3">

<b>TP. HỒ CHÍ MINH, 2023</b>

</div><span class="text_page_counter">Trang 4</span><div class="page_container" data-page="4">

<b>NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN</b>

</div><span class="text_page_counter">Trang 5</span><div class="page_container" data-page="5">

<b>LỜI CẢM ƠN</b>

Đồ án “Phát triển ứng dụng Chat” là đồ án tiếp tục phát triển từ Đồ án 1 với mụctiêu là xây dựng một ứng dụng Chat, đáp ứng được việc trao đổi thơng tin củangười dùng hiện nay. Để có thể hoàn thành Đồ án 2 lần này, chúng em xin dành lờicảm ơn sâu sắc đến:

Ths.Trần Thị Hồng Yến đã tận tình hướng dẫn, cho lời khuyên cũng như đưa ranhững định hướng thiết thực cho chúng em. Những góp ý, bài học mà chúng emhọc được trong suốt quá trình thực hiện Đồ án 2 sẽ là hành trang q báu khơng chỉhiện tại mà cịn ở trong tương lai.

Các quý thầy cô trường Đại học Công nghệ Thơng tin đã truyền đạt những bàihọc hữu ích, khơng chỉ về kiến thức chuyên ngành mà còn những kĩ năng trongcuộc sống, cơng việc sau này.

Trong q trình thực hiện đồ án, nhóm có thể khơng tránh khỏi được sai sót,chúng em kính mong nhận được sự góp ý, hướng dẫn của cơ để có thể hồn thiệnđồ án hơn nữa, không chỉ dừng lại ở Đồ án 2 mà có thể phát triển lên làm khố luậntốt nghiệp.

Chúng em xin gửi lời cảm ơn chân thành nhất đến cơ.

TP.HCM, ngày 30 tháng 12 năm 2023Nhóm sinh viên thực hiện

Nguyễn Đình Nhật Quang - Trần Đình Lộc

</div><span class="text_page_counter">Trang 6</span><div class="page_container" data-page="6">

<b>MỤC LỤC</b>

<b>CHƯƠNG 1: GIỚI THIỆU CHUNG...1</b>

1.1. Lý do chọn đề tài...1

1.2. Phạm vi nghiên cứu...1

1.3. Đối tượng nghiên cứu...2

1.4. Phương pháp nghiên cứu...2

3.1.3. Kiến trúc hệ thống Microservices Backend...14

3.1.4. Mô tả các thành phần trong hệ thống Microservices Backend...14

3.2. Phân tích yêu cầu...15

</div><span class="text_page_counter">Trang 7</span><div class="page_container" data-page="7">

3.2.1. Đăng ký...15

3.2.2. Đăng nhập...16

3.2.3. Xem danh sách phòng Chat...16

3.2.4. Nhắn tin trong phịng Chat...16

3.2.5. Xem thơng tin phịng Chat...17

3.3.3. Danh sách Use Case...21

3.3.4. Danh sách đặc tả Use Case...23

</div><span class="text_page_counter">Trang 8</span><div class="page_container" data-page="8">

4.2.14. Màn hình “Thơng tin người dùng”...72

4.2.15. Màn hình “Danh sách lời mời kết bạn”...73

4.2.16. Màn hình “Danh sách nhóm”...74

4.2.17. Màn hình “Tạo nhóm mới”...75

4.2.18. Màn hình “Danh sách lời mời nhóm”...76

4.2.19. Màn hình “Cài đặt”...77

4.2.20. Màn hình “Chỉnh sửa thơng tin cá nhân”...78

4.2.21. Màn hình “Thay đổi mật khẩu”...79

4.2.22. Màn hình “Cài đặt thơng báo”...80

</div><span class="text_page_counter">Trang 9</span><div class="page_container" data-page="9">

Hình 3.2 Kiến trúc hệ thống Microservices Backend...14

Hình 3.3 Sơ đồ Use Case đối với người dùng chưa đăng nhập...18

Hình 3.4 Sơ đồ Use Case đối với người dùng đã đăng nhập...19

Hình 3.5 Sơ đồ Use Case với Chat Room...20

Hình 4.9 Màn hình "Chat" khi người dùng chọn các loại tin nhắn khác...65

Hình 4.10 Màn hình "Chat" khi người dùng chọn xem Hình ảnh, Video...66

Hình 4.11 Màn hình "Thơng tin phịng Chat"...67

Hình 4.12 Màn hình "Danh sách thành viên nhóm"...68

Hình 4.13 Màn hình "Thơng tin nhóm"...69

</div><span class="text_page_counter">Trang 10</span><div class="page_container" data-page="10">

Hình 4.14 Màn hình "Danh sách cách loại tệp trong phịng Chat"...70

Hình 4.15 Màn hình "Danh sách bạn bè"...71

Hình 4.16 Màn hình "Thơng tin người dùng"...72

Hình 4.17 Màn hình "Danh sách lời mời kết bạn đã nhận"...73

Hình 4.18 Màn hình "Danh sách nhóm"...74

Hình 4.19 Màn hình "Tạo nhóm mới"...75

Hình 4.20 Màn hình "Danh sách lời mời nhóm đã nhận"...76

Hình 4.21 Màn hình "Cài đặt"...77

Hình 4.22 Màn hình "Chỉnh sửa thơng tin cá nhân"...78

Hình 4.23 Màn hình "Thay đổi mật khẩu"...79

Hình 4.24 Màn hình "Cài đặt thơng báo"...80

</div><span class="text_page_counter">Trang 11</span><div class="page_container" data-page="11">

<b>DANH MỤC BẢNG</b>

Bảng 3.1 Mô tả các thành phần hệ thống di động...13

Bảng 3.2 Mô tả các thành phần trong hệ thống Microservices Backend...14

Bảng 3.3 Danh sách Actor...20

Bảng 3.4 Danh sách Use Case...21

Bảng 3.5 Use Case Đăng nhập...23

Bảng 3.6 Use Case Đăng ký...24

Bảng 3.7 Use Case Quên mật khẩu...25

Bảng 3.8 Use Case Xác thực Email...27

Bảng 3.9 Use Case Xem danh sách bạn bè...28

Bảng 3.10 Quản lý danh sách lời mời kết bạn...29

Bảng 3.11 Use Case Thêm bạn bè...30

Bảng 3.12 Use Case Tạo nhóm...31

Bảng 3.13 Use Case Quản lý nhóm...32

Bảng 3.14 Quản lý danh sách lời mời nhóm...33

Bảng 3.15 Use Case Xem danh sách phịng Chat...35

Bảng 3.16 Use Case Chỉnh sửa thơng tin cá nhân...36

Bảng 3.17 Use Case Nhận thông báo...37

Bảng 3.18 Use Case Xem danh sách thông báo...38

Bảng 3.19 Use Case Cài đặt thơng báo...39

Bảng 3.20 Use Case Tìm kiếm...40

Bảng 3.21 Use Case Đăng xuất...41

Bảng 3.22 Use Case Quản lý thiết bị...42

Bảng 3.23 Quản lý chủ đề và ngôn ngữ...43

Bảng 3.24 Use Case Quản lý chặn người dùng...44

Bảng 3.25 Use Case Cập nhập mật khẩu...45

Bảng 3.26 Use Case Thực hiện Chat...46

Bảng 3.27 Use Case Xem thơng tin phịng Chat nhóm...47

</div><span class="text_page_counter">Trang 12</span><div class="page_container" data-page="12">

Bảng 3.28 Use Case Thực hiện Video Call...49

Bảng 3.29 Bảng diễn giải các thành phần trong sơ đồ Logic...50

</div><span class="text_page_counter">Trang 13</span><div class="page_container" data-page="13">

<small>CHƯƠNG 1: GIỚI THIỆU CHUNG</small>

<b>1.1. Lý do chọn đề tài.</b>

Hiện nay, Internet đã trở thành một phần không thể thiếu trong cuộc sống củachúng ta. Internet hiện hữu ở mọi mặt trong xã hội, ảnh hưởng hoàn toàn đến cáchchúng ta sống, bao gồm việc mua sắm, tìm hiểu thơng tin, phương pháp học tập, làmviệc,… và đặc biệt là cách chúng ta giao tiếp. Trước thời kỳ Internet, chúng ta thôngthường cần phải gặp trực tiếp, gọi điện thoại hoặc gửi thư để có thể trao đổi thơng tincho nhau. Mỗi cách trong ba cách trên đều có điểm lợi và hại, tỉ như việc gặp trực tiếpcần phải sắp xếp thời gian phù hợp cho cả hai, hay là gửi thư sẽ tốn rất nhiều thờigian,... Sau khi Internet phổ biến, Chat và Video call trở thành phương tiện giao tiếpchính trong cuộc sống của chúng ta, chúng ta có thể Chat mọi lúc và mọi nơi, chỉ cầncó một chiếc điện thoại và Internet, chúng ta cũng có thể lưu trữ thơng tin bởi vì mọinội dung Chat của chúng ta sẽ được lưu lại, hơn nữa, chúng ta có thể trao đổi thơng tinvới nhiều người hơn, thơng qua tính năng Group Chat. Khi chúng ta cần trao đổi trựctiếp, chúng ta có thể Video call mà khơng cần phải sắp xếp thời gian. Những lý do nàylà lý do khiến cho việc giao tiếp ngày càng dễ dàng và nhanh chóng hơn.

Bên cạnh đó, chúng ta đã trải qua một đại dịch COVID-19. Trong quá trình chốnglại đại dịch, việc phong tỏa, làm việc Online tại nhà đã trở nên phổ biến và thay đổinhận thức của chúng ta về cách giao tiếp trong công việc và cuộc sống. Nhu cầu traođổi thông tin qua Internet ngày càng trở nên thiết yếu. Đó là lý do nhóm quyết định tiếptục phát triển phần mềm Chat nhằm giúp việc trao đổi thông tin qua Chat và Video calltrở nên dễ dàng, thuận tiện hơn.

</div><span class="text_page_counter">Trang 14</span><div class="page_container" data-page="14">

- Các bài toán về Push Notification trên thiết bị Mobile.

- Các bài toán về Pagination trong hệ thống và ứng dụng Mobile App.

- Chức năng Video call được nhóm tự xây dựng hồn tồn dựa trên cơng nghệ tựdo và mã nguồn mở WebRTC.

- Chức năng Realtime Chat được nhóm tự xây dựng hoàn toàn dựa trên thư việnSocket IO.

<b>1.3. Đối tượng nghiên cứu.</b>

- Người dùng có nhu cầu trao đổi thông tin, thực hiện Video call qua phần mềm.

<b>1.4. Phương pháp nghiên cứu.</b>

- Nghiên cứu từ các ứng dụng hiện có trên thị trường, quan sát và rút ra nhữngưu, nhược điểm của các ứng dụng đó (Messenger, Zalo, Telegram,…).

- Tìm hiểu các cơng nghệ liên quan đến Chat, thử nghiệm và chọn ra nhữngcông nghệ phù hợp nhất với khả năng của nhóm.

- Tham khảo ý kiến của giảng viên hướng dẫn để đạt được kết quả tốt nhất chođề tài.

</div><span class="text_page_counter">Trang 15</span><div class="page_container" data-page="15">

<small>CHƯƠNG 2: CƠNG NGHỆ SỬ DỤNG</small>

<b>2.1. Flutter2.1.1. Giới thiệu</b>

<i>Hình 2.1 Logo Flutter</i>

Flutter là một UI Framework di động mã nguồn mở và hồn tồn miễn phí doGoogle phát triển, và được công bố vào năm 2015 nhưng đến tháng 5 năm 2017 mớichính thức phát hành. Flutter cho phép các nhà phát triển có thể tạo ra các bộ giao diệnnative chất lượng cao trong thời gian rất ngắn. Ngoài ra, việc sử dụng Flutter cho phépcác nhà phát triển với một Codebase có thể phát triển ứng dụng có trải nghiệm tốt trênđa nền tảng bao gồm: Mobile (Android và IOS), Web, Desktop App, Linux,... giúp chocác Team phát triển có thể tiết kiệm nhân lực và chi phí.

</div><span class="text_page_counter">Trang 16</span><div class="page_container" data-page="16">

<b>2.2. OneSignal</b>

<i>Hình 2.2 Logo OneSignal</i>

Đối với các ứng dụng Mobile, tính năng Notification được xem là tính năng cực kỳquan trọng trong ứng dụng, nó đóng vai trò quan trọng trong việc tương tác và giữ chânngười dùng trong một ứng dụng. Có rất nhiều cách để thực hiện được tính năng nàytrên một ứng dụng di động tuy nhiên cách phổ biến đang được áp dụng hiện nay là sửdụng dịch vụ Firebase Cloud Messaging (FCM) của Google,… Trong thời gian triểnkhai dịch vụ FCM ở Đồ án 1, nhóm nhận ra những bất cập tồn đọng khi triển khai dịchvụ này với một ứng dụng Flutter nói riêng và ứng dụng di động nói chung, một trongnhững vấn đề có thể kể đến như: q trình cài đặt phức tạp, khơng thể tùy chỉnh thơngbáo theo nhu cầu, hạn chế về tính năng được hỗ trợ, khó kiểm sốt số lượng thơng báođã đến thiết bị người dùng. Sau thời gian tìm hiểu các cách có thể cải tiến vấn đề trên,thì nhóm đã tiến hành đánh giá và khảo sát một dịch vụ khá nổi tiếng hiện nay đó làOneSignal.

OneSignal là một dịch vụ tạo Push Notifications được sử dụng rộng rãi và ưachuộng bởi các công ty lớn như: . Với việc sử dụng cơng nghệ này, chúng ta có thể dễdàng tạo thông báo đẩy không chỉ ứng dụng di động mà cịn có thể trên Website. Tất cảnhững số liệu như người dùng tương tác với thông báo đẩy đều sẽ được dịch vụ ghi lạivà phân tích, từ đó có thể giúp nhà phát triển đưa ra các chiến lược phù hợp hơn chokhách hàng của mình. Các dịch vụ mà hiện nay OneSignal đang cung cấp như: Thôngbáo đẩy trên Web, thông báo đẩy trên điện thoại, thông báo trong ứng dụng, hỗ trợtương tác bằng Email, hỗ trợ tương tác bằng SMS.

</div><span class="text_page_counter">Trang 17</span><div class="page_container" data-page="17">

<b>2.3. NodeJS2.3.1. Giới thiệu</b>

<b>2.3.2. Lý do sử dụng</b>

- NodeJS tương thích tốt với Socket.IO, có cộng đồng lớn, vì thế phù hợp đểxây dựng một service Chat.

</div><span class="text_page_counter">Trang 18</span><div class="page_container" data-page="18">

<b>2.4. Golang2.4.1. Giới thiệu</b>

<i>Hình 2.4 Logo GoLang</i>

Golang, hay cịn được gọi là Go, là một ngơn ngữ lập trình hiện đại được pháttriển bởi Google và được giới thiệu lần đầu tiên vào năm 2009. Với sự đơn giản, hiệusuất cao, và khả năng mở rộng, Golang nhanh chóng trở thành một lựa chọn phổ biếncho việc phát triển ứng dụng web, hệ thống và các dự án công nghiệp khác.

<b>2.4.2. Lý do sử dụng</b>

- Hiệu suất cao và đồng thời xử lý: Golang được thiết kế với mục tiêu tốiưu hiệu suất và khả năng đồng thời xử lý. Cơ chế xử lý đồng thời(concurrency) tích hợp sẵn và có cú pháp rõ ràng giúp các nhà phát triểndễ dàng tận dụng tối đa sức mạnh của hệ thống.

- Cú pháp đơn giản: Cú pháp của Golang đơn giản và dễ đọc, giúp giảmbớt lỗi trong quá trình phát triển và bảo trì mã nguồn. Điều này làm choGolang trở thành một lựa chọn tốt cho những dự án lớn và phức tạp. - Bảo trì dễ dàng: Thiết kế của Golang với sự tập trung vào đơn giản và rõ

ràng giúp ích cho việc bảo trì mã nguồn. Việc theo dõi, sửa lỗi, và mởrộng hệ thống trở nên thuận tiện và tiết kiệm thời gian.

</div><span class="text_page_counter">Trang 19</span><div class="page_container" data-page="19">

- Hệ sinh thái mạnh mẽ: Golang có một hệ sinh thái mạnh mẽ với nhiềuthư viện và công cụ hỗ trợ. Điều này giúp nhà phát triển nhanh chóngtriển khai ứng dụng mà khơng cần phải xây dựng lại nhiều từ đầu.

- Phát triển ứng dụng đám mây: Golang được sử dụng rộng rãi cho pháttriển các ứng dụng đám mây, đặc biệt là khi cần tận dụng tính năng đồngthời xử lý và hiệu suất cao.

<b>2.5. PostgreSQL2.5.1. Giới thiệu</b>

<i>Hình 2.5 Logo PostgreSQL</i>

PostgreSQL, hay Postgres, là hệ quản trị cơ sở dữ liệu mã nguồn mở phổ biến.Với tính mở rộng linh hoạt, tính ACID-compliant, và khả năng tùy chỉnh cao, nó là lựachọn ưa thích cho ứng dụng yêu cầu hiệu suất và độ ổn định. PostgreSQL hỗ trợ nhiềungôn ngữ và nền tảng, cung cấp indexing mạnh mẽ và có cộng đồng người dùng rộnglớn. Được sử dụng rộng rãi trong phát triển web, quản lý doanh nghiệp, GIS và các ứngdụng nghiên cứu, PostgreSQL đóng vai trị quan trọng trong thế giới cơng nghệ thôngtin.

</div><span class="text_page_counter">Trang 21</span><div class="page_container" data-page="21">

Firebase cung cấp cho người sử dụng một cơ sở dữ liệu hoạt động trên nền tảng đámmây với hệ thống máy chủ của Google.

Các dịch vụ của Firebase có những tính năng là miễn phí, tuy nhiên khi có nhucầu hơn, một số tính năng sẽ yêu cầu trả phí.

Các chức năng của Firebase đã được áp dụng trong đồ án:

- Firebase Authentication: Firebase Authentication giúp người sử dụng cóthể dễ dàng, nhanh chóng trong việc triển khai các tính năng xác thựcngười dùng với Google, Facebook, Apple,...

- Firebase Storage: Firebase storage dùng để lưu trữ được nhiều dạng dữliệu bao gồm tập tin, hình ảnh, Video. Google cịn tích hợp Googlesecurity vào Firebase storage giúp tải lên hoặc tải về các ứng dụng, phầnmềm một cách tiện lợi, đơn giản.

<b>2.6.2. Lý do sử dụng</b>

- Xây dựng các tính năng xác thực người dùng, lưu trữ hình ảnh, … một cách dễdàng, nhanh chóng, giúp nhóm có thể tiết kiệm thời gian, đảm bảo tiến độ.- Các tính năng lớn trong đồ án như Firebase Authentication trong lượng người

dùng khơng q lớn sẽ khơng phát sinh thêm chi phí trong quá trình triển khaivà sử dụng.

<b>2.7. Socket.IO</b>

<i>Hình 2.7 Logo Socket.IO</i>

</div><span class="text_page_counter">Trang 22</span><div class="page_container" data-page="22">

<b>2.7.1. Giới thiệu</b>

- Khi làm việc về vấn đề giao tiếp giữa Server và Client, đặc biệt là vấn đềServer, Client có thể nhận biết sự thay đổi của đối phương, những nhàphát triển thường sử dụng rất nhiều phương pháp mà có thể kể đến như:AJAX, HTML5 server-sent events,.. Tuy nhiên các phương pháp này đềutồn tại nhiều nhược điểm như chậm, tốn tài nguyên. Do đó, Socket.IO đãđược phát triển để giải quyết vấn đề này, đặc biệt là các ứng dụng có yêucầu tính thời gian thực.

- Socket.IO là 1 module trong NodeJS, được phát triển vào năm 2010. Mụcđích lớn nhất để Socket.io ra đời là việc giao tiếp ngay tức khắc giữaClient và Server.

<b>2.7.2. Lý do sử dụng</b>

- Đồ án của nhóm là việc xây dựng phần mềm Chat nên yêu cầu quan trọng nhấtcủa phần mềm là Real-time, do đó Socket.IO là lựa chọn hợp lý vì đây là cơngnghệ mã nguồn mở do đó sẽ khơng bị các vấn đề liên quan đến chi phí như cácbên cung cấp ở bên thứ 3 như Firebase,...

- Bảo mật cao: SocketIO được xây dựng dựa trên Engine.IO, nó sẽ khởi chạyphương thức Long-polling đầu tiên, sau đó sẽ tới những phương thức kết nối tốthơn. Bên cạnh việc thiết lập chặt chẽ đó, Socket.IO cịn tự tạo các kết nối bảomật như: Proxy,...

</div><span class="text_page_counter">Trang 23</span><div class="page_container" data-page="23">

<b>- Mã nguồn mở miễn phí: WebRTC là dự án mã nguồn mở hồn tồn miễn phí và</b>

có sẵn trên mọi nền tảng. Vì nó là mã nguồn mở miễn phí, do đó khi nhóm triểnkhai tính năng Video call giữa 2 người với nhau sẽ khơng bị giới hạn thời gian,chi phí như các bên cung cấp bên thứ 3 khác.

<b>- Bảo mật: Giao thức SRTP (Secure Real-time Transport Protocol) được dùng để</b>

mã hoá các dữ liệu, chống lại các việc nghe trộm khi thực hiện Call.

<b>- Không cần cài thêm plugin: Đây chính là một điểm nổi bật của WebRTC mang</b>

lại, vì khơng cần phải cài thêm plugin do đó nó mang lại sự tiện lợi cũng nhưtiết kiệm chi phí, tối ưu tốc độ,...

</div><span class="text_page_counter">Trang 24</span><div class="page_container" data-page="24">

<small>CHƯƠNG 3: THIẾT KẾ HỆ THỐNG</small>

<b>3.1. Xây dựng hệ thống</b>

<b>3.1.1. Kiến trúc hệ thống ứng dụng di động</b>

<i>Hình 3.9 Kiến trúc hệ thống ứng dụng di động</i>

</div><span class="text_page_counter">Trang 25</span><div class="page_container" data-page="25">

<b>3.1.2. Mô tả các thành phần trong hệ thống ứng dụng di động</b>

<i>Bảng 3.1 Mô tả các thành phần hệ thống di động</i>

STT Tầng Thành phần Diễn giải1

Widgets/ Screens

Hiển thị các thành phần giao diện của ứng dụng.

Presentation Logic/ Bloc

- Nơi xử lý Logic, quản lý State của tầng giao diện. Sẽ tiếp nhận Event từ các thành phần giao diện và tiến hành cập nhật State.

- Làm việc với UseCases của tầng Domain.

Domain <sup>Usecases</sup>

- Khai báo các quy tắc Business Logic của ứng dụng- Tiếp nhận các yêu cầu từ tầng Presentation và gọi đến các Repository phù hợp để thực hiện yêu cầu vàtrả kết quả lại cho tầng Presentation.

4 Repositories - Khai báo các Busniess Logic của ứng dụng.

8 Local Nguồn dữ liệu từ Local Storage của thiết bị.9

External Serivce

Nguồn dữ liệu từ các dịch vụ bên thứ 3 được sử dụng trong ứng dụng như Firebase,...

10 <sup>Socket.IO</sup>

Nơi lắng nghe các thông báo sự kiện, nguồn dữ liệu Realtime trong ứng dụng.

</div><span class="text_page_counter">Trang 26</span><div class="page_container" data-page="26">

<b>3.1.3. Kiến trúc hệ thống Microservices Backend</b>

<i>Hình 3.10 Kiến trúc hệ thống Microservices Backend</i>

<b>3.1.4. Mô tả các thành phần trong hệ thống Microservices Backend</b>

<i>Bảng 3.2 Mô tả các thành phần trong hệ thống Microservices Backend</i>

1 BFF Service

Backend For Frontend (BFF) là một service cung cấp Restful API cho hệ thống bên ngoài. Nơi này chịu trách nhiệm xử lý Business Logic và kết nối giữa các Service. Service được viết bằng Golang.

2 BFF Cache <sup>Redis database cho BFF nhằm cache dữ liệu, tăng hiệu </sup>năng xử lý.

3 IAM Service

Identity and Access Management (IAM) là một servicequản lý thông tin người dùng và dữ liệu đăng nhập của họ. Service được viết bằng Golang.

4 IAM Cache Redis database cho IAM nhằm cache dữ liệu, tăng hiệu

</div><span class="text_page_counter">Trang 27</span><div class="page_container" data-page="27">

7 Connection DB <sup>Database cho Connection Service sử dụng </sup>PostgreSQL.

8 Message Service <sup>Message Service là service quản lý thông tin tin nhắn, </sup>Chatroom,… Service được viết bằng Golang.

9 Message DB Database cho Message Service sử dụng PostgreSQL.10 Realtime Service

Realtime Service chịu trách nhiệm quản lý kết nối Socket đến người dùng và xử lý các thông tin được gửiđến. Service được viết bằng NodeJS.

<b>3.2. Phân tích u cầu.3.2.1. Đăng ký</b>

Người dùng có 2 cách để tạo mới một tài khoản trên App:

<b>- Đăng ký thông qua Email và Password. Với phương thức này sau khi hoàn</b>

thành Form điền Email và Password, Confirm Password, người dùng sẽ đượcchuyển đến trang “Xác thực Email”, đồng thời sẽ có một Email gửi đến Gmailcủa người dùng để xác thực. Người dùng có thể yêu cầu gửi lại “Xác thứcEmail” tuy nhiên mỗi lần sẽ cách nhau 30s để tránh tình trạng Spam.

<b>- Đăng ký qua tài khoản Google.3.2.2. Đăng nhập</b>

<b>- Để có thể vào trong ứng dụng, người dùng cần phải tiến hành đăng nhập. Người</b>

dùng cũng sẽ có 2 cách để đăng nhập là thơng qua Email và Password hoặcđăng nhập với Google.

</div><span class="text_page_counter">Trang 28</span><div class="page_container" data-page="28">

<b>- Đối với phương thức Đăng nhập thông qua Email và Password, nếu người dùng</b>

chưa xác nhận Email trước đó, hệ thống sẽ tiến hành chuyển người dùng đếntrang Verify Email, sau khi q trình Verify Email hồn tất, người dùng sẽ đượcchuyển đến trang chủ và có thể sử dụng ứng dụng như bình thường.

<b>3.2.3. Xem danh sách phịng Chat</b>

Người dùng sau khi đăng nhập có thể thấy được danh sách phịng Chat mà mìnhđang tham gia bao gồm phịng Chat cá nhân và phịng Chat nhóm. Đồng thời có thểxem khái qt thơng tin của phịng Chat như ảnh phịng Chat (ảnh của bạn bè nếu đó làphịng Chat cá nhân, ảnh nhóm nếu đó là phịng Chat nhóm), tên phịng Chat, tin nhắnmới nhất, thời gian mới nhất. Khi có tin nhắn mới ở một phịng Chat, phòng Chat nàysẽ được đẩy lên đầu danh sách tin nhắn của người dùng theo thời gian thực. Nếu cónhững sự kiện trong phịng Chat đó như tin nhắn mới, đang có cuộc gọi cũng sẽ đượchiển thị nổi bật như dấu chấm tròn xanh, Button tham gia cuộc gọi cho người dùngnhanh chóng phân biệt.

<b>3.2.4. Nhắn tin trong phịng Chat</b>

Người dùng chọn phịng Chat và có thể thực hiện nhắn tin với nhiều loại tinnhắn như Text, hình ảnh, Video , Emoji, Sticker, Gif, ghi âm giọng nói và chia sẻ vị tríhiện tại. Để tối ưu hiệu năng và tiết kiệm thời gian Load tin nhắn, danh sách tin nhắn sẽđược hỗ trợ Lazy load theo kiểu Offset, người dùng kéo tới đâu thì mới Load những tinnhắn tiếp theo thay vì Load hết từ đầu. Khi người dùng kéo lên để xem các tin nhắn cũ,giao diện sẽ xuất hiện một nút để giúp người dùng có thể kéo đến tin nhắn mới nhấtnhanh chóng.

<b>3.2.5. Xem thơng tin phịng Chat</b>

Người dùng có thể xem thơng tin phịng Chat bao gồm hình ảnh, tên phịngChat. Ngồi ra, người dùng có thể xem nhanh những hình ảnh, Video, File đã gửi trongphịng Chat đó và có thể lựa chọn các thao tác như rời nhóm, sửa đổi thơng tin nhómđối với phịng Chat nhóm,…

</div><span class="text_page_counter">Trang 29</span><div class="page_container" data-page="29">

<b>3.2.6. Quản lý nhóm</b>

Người dùng có thể tạo những nhóm Chat và mời bạn bè tham gia nhóm. Sau khinhóm được tạo, người dùng có thể cập nhật tên, hình ảnh nhóm, mời thêm bạn bè vàonhóm, rời nhóm.

<b>3.2.7. Quản lý bạn bè</b>

Người dùng có thể xem danh sách, thêm, xố bạn bè. Sau khi kết bạn sẽ tự độngtạo phòng Chat cá nhân bao gồm bản thân người dùng và bạn bè. Sau khi xố kết bạnsẽ xố tồn bộ dữ liệu phịng Chat.

<b>3.2.8. Quản lý chặn người dùng</b>

Người dùng có thể tiến hành chặn bạn bè và người lạ nếu họ có nhu cầu. Sau khichặn, người bị chặn sẽ khơng thể tìm kiếm người đã chặn mình. Người dùng có thểxem lại danh sách người dùng đã chặn và có thể gỡ chặn.

<b>3.2.9. Tìm kiếm</b>

<b>Người dùng có thể tìm kiếm tin nhắn, bạn bè, tên phòng Chat trên thanh tìm</b>

kiếm. Để có thể tìm người lạ để gửi lời mời kết bạn, người dùng chỉ cần nhập chínhxác địa chỉ Email của người đó trên thanh tìm kiếm, nếu hệ thống tìm thấy sẽ hiển thịthơng tin người dùng ấy và người dùng có thể gửi lời mời tới người đó.

<b>3.2.10. Thơng báo</b>

Người dùng sẽ nhận được thơng báo khi có u cầu kết bạn, lời mời tham gianhóm Chat, cuộc gọi mới và có thể xem các thông báo này.

<b>3.2.11. Quản lý thông tin cá nhân</b>

Người dùng có thể cập nhật thơng tin cá nhân của mình bao gồm thay đổiAvatar, các thơng tin như họ tên, hình đại diện, số điện thoại và giới thiệu bản thân.

<b>3.2.12. Video call</b>

Người dùng có thể thực hiện Call Video với bạn bè của mình. Khi thực hiện cuộcgọi, người bên kia sẽ nhận được thông báo có người gọi tới. Nếu người bên kia từ chối,cuộc gọi sẽ bị huỷ. Nếu người bên kia chấp nhận, cả hai sẽ tiến hành Video call với

</div><span class="text_page_counter">Trang 30</span><div class="page_container" data-page="30">

nhau, ngồi ra cịn có một số chức năng như ngắt Camera, đổi Camera trước hoặc sau,tắt âm thanh của đối phương, tắt Mic.

<b>3.3. Thiết kế hệ thống:3.3.1. Sơ đồ Use Case:</b>

<i>Hình 3.11 Sơ đồ Use Case đối với người dùng chưa đăng nhập</i>

</div><span class="text_page_counter">Trang 31</span><div class="page_container" data-page="31">

<i>Hình 3.12 Sơ đồ Use Case đối với người dùng đã đăng nhập</i>

</div><span class="text_page_counter">Trang 32</span><div class="page_container" data-page="32">

<i>Hình 3.13 Sơ đồ Use Case với Chat Room</i>

<b>3.3.2. Danh sách Actor</b>

<i>Bảng 3.3 Danh sách Actor</i>

<b>STTTên ActorMô tả ngắn/ Ghi chú</b>

1 Người dùng chưa đăng nhập <sup>Người dùng sử dụng phần mềm nhưng chưa đăng </sup>nhập

2 Người dùng đăng nhập Người dùng sử dụng phần mềm đã đăng nhập3 Thành viên phòng Chat Người dùng tham gia phòng Chat

</div><span class="text_page_counter">Trang 33</span><div class="page_container" data-page="33">

<b>3.3.3. Danh sách Use Case</b>

<i>Bảng 3.4 Danh sách Use Case</i>

<b>Tên của Use Case ActorMô tả/ Ghi chú</b>

1 Đăng nhập Người dùng chưa

đăng nhập <sup>Đăng nhập bằng tài khoản đã đăng ký</sup>2 Đăng ký Người dùng chưa

đăng nhập <sup>Tạo tài khoản mới để sử dụng App</sup>3 Quên mật khẩu Người dùng chưa

đăng nhập <sup>Cấp lại mật khẩu mứi cho người dùng</sup>4 Xác thực Email Người dùng chưa

đăng nhập <sup>Xác thực Email của tài khoản mới</sup>5 Xem danh sách bạn

Người dùng đã đăng nhập

Xem danh sách bạn bè của người dùng hiện tại

Xem danh sách phòng Chat của người dùng hiện tại

12 Chỉnh sửa thông tin

cá nhân <sup>Người dùng đã </sup>đăng nhập <sup>Sửa đổi thông tin người dùng.</sup>13 Nhận thông báo Người dùng đã

</div><span class="text_page_counter">Trang 34</span><div class="page_container" data-page="34">

18 Quản lý thiết bị Người dùng đã

đăng nhập <sup>Quản lý các thiết bị đã đăng nhập vào </sup>ứng dụng19 Quản lý chủ đề và

ngôn ngữ

Người dùng đã đăng nhập

Quản lý chủ đề và ngôn ngữ của ứng dụng

Người dùng muốn xem thơng tin của phịng Chat.

24 Thực hiện Video

Call <sup>Thành viên phòng</sup>Chat <sup>Người dùng muốn thực hiện Video Call</sup>trong phòng Chat

</div><span class="text_page_counter">Trang 35</span><div class="page_container" data-page="35">

<b>3.3.4. Danh sách đặc tả Use Case3.3.4.1. Use Case Đăng nhập</b>

<i>Bảng 3.5 Use Case Đăng nhập</i>

Tên Use Case Đăng nhập

Mục đích Đăng nhập bằng tài khoản đã đăng kýNgười dùng Người dùng chưa đăng nhập

Điều kiện kích hoạt <sup>Người dùng ấn nút đăng nhập với Email hoặc đăng nhập với </sup>Google ở màn hình “Chào mừng người dùng”

Tiền điều kiện Người dùng chưa đăng nhập trước đó hoặc đã đăng xuấtHậu điều kiện Người dùng đăng nhập ứng dụng thành cơng

Luồng sự kiện chính

1. Người dùng truy cập vào ứng dụng và hệ thống chuyển người dùng đến màn hình “Chào mừng người dùng”.2. Người dùng chọn lệnh đăng nhập với Email.

4. Ứng dụng chuyển người dùng đến trang “Đăng nhập”.5. Người dùng nhập Email, mật khẩu và bấm nút đăng nhập.6. Hệ thống xác thực thông tin đăng nhập thành công và chuyển người dùng đến trang chủ của ứng dụng.

Luồng sự kiện phụ

2.a Người dùng chọn lệnh đăng nhập với Google

3.a. Người dùng lựa chọn tài khoản liên kết với Google và bắt đầu thực hiện xác thực

Tiếp tục Use Case 01.6

Mở rộng - Hệ thống xác thực thông tin đăng nhập không thành công và hiển thị thông báo.

+ TH1: Người dùng hủy đăng nhập.Use Case dừng lại.

- Người dùng chưa hoàn thành việc xác thực Email.

</div><span class="text_page_counter">Trang 36</span><div class="page_container" data-page="36">

+ TH1: Người dùng chưa hoàn thành việc xác thực EmailUse Case quay lại 02.4.

<b>3.3.4.2. Use Case Đăng ký</b>

<i>Bảng 3.6 Use Case Đăng ký</i>

Tên Use Case Đăng ký

Mục đích Tạo tài khoản mới để sử dụng ứng dụngNgười dùng Người dùng chưa đăng nhập

Điều kiện kích hoạt <sup>Người dùng nhấn vào nút “Đăng ký” ở màn hình “Chào </sup>mừng người dùng”

Tiền điều kiện Người dùng chưa có tài khoản

Hậu điều kiện <sup>- Người dùng đăng ký tài khoản mới thành công.</sup>- Hệ thống lưu thông tin tài khoản mới vào dữ liệu.

Luồng sự kiện chính

1. Người dùng truy cập vào ứng dụng và hệ thống chuyển người dùng đến màn hình “Chào mừng người dùng”.2. Người dùng chọn lệnh đăng ký tài khoản bằng Email.3. Ứng dụng chuyển người dùng đến trang “Đăng ký”

4. Người dùng nhập Email, mật khẩu, xác nhận mật khẩu và chọn lệnh đăng ký.

5. Sau khi nhấn lệnh đăng ký, hệ thống tự động chuyển người dùng đến trang “Xác thực Email”.

6. Hệ thống tiến hành xác thực Email và gửi một Email xác nhận đến người dùng.

7. Sau khi người dùng xác nhận Email thành công, hệ thống tự động chuyển người dùng vào trang chủ của ứng dụng.Luồng sự kiện phụ 2.a Người dùng chọn đăng nhập vào Google nhưng tài khoản

</div><span class="text_page_counter">Trang 37</span><div class="page_container" data-page="37">

Google này chưa đăng ký trước với hệ thống.3.a Tiếp tục Use Case 02.7

Mở rộng

- Người dùng đăng ký tạo tài khoản và thốt App nhưng chưa hồn thành bước xác thực Email. Người dùng truy cập lại vào App ở lần sau:

+ TH1: Người dùng chưa xác thực Email.Tiếp tục Use Case 02.5.

<b>3.3.4.3. Use Case Quên mật khẩu</b>

<i>Bảng 3.7 Use Case Quên mật khẩu</i>

Tên Use Case Quên mật khẩu

Mục đích Cấp lại mật khẩu mới cho người dùng.Người dùng Người dùng chưa đăng nhập

Điều kiện kích hoạt <sup>Người dùng nhấn vào nút quên mật khẩu ở trang “Quên mật </sup>khẩu”.

Tiền điều kiện Người dùng chưa đăng nhập.

Hậu điều kiện <sup>- Người dùng đổi mật khẩu cho tài khoản thành công.</sup>- Hệ thống lưu thông tin mật khẩu mới vào dữ liệu.

Luồng sự kiện chính 1. Người dùng chọn lệnh quên mật khẩu ở trang “Đăng nhập”2. Ứng dụng chuyển người dùng đến trang “Quên mật khẩu” .3. Người dùng nhập Email tài khoản và chọn lệnh cấp lại mật khẩu.

4. Hệ thống kiểm tra tính hợp lệ của Email, đảm bảo Email này đã được đăng ký tài khoản trước đó, sau đó hệ thống tiến hành gửi tới Email đó tới địa chỉ đã được đăng ký.

5. Người dùng bấm vào đường dẫn trong Email và dẫn đến

</div><span class="text_page_counter">Trang 38</span><div class="page_container" data-page="38">

trang Web thay đổi mật khẩu.6. Người dùng thay đổi mật khẩu.

7. Trang Web thông báo thay đổi mật khẩu thành công.Luồng sự kiện phụ Không

<b>3.3.4.4. Use Case Xác thực Email</b>

<i>Bảng 3.8 Use Case Xác thực Email</i>

Tên Use Case Xác thực Email

Mục đích Xác thực Email của tài khoản mớiNgười dùng Người dùng chưa đăng nhập

Điều kiện kích hoạt <sup>Người dùng đang đăng nhập bằng tài khoản chưa xác thực </sup>Email

Tiền điều kiện Tài khoản chưa xác thực EmailHậu điều kiện Tài khoản đã được xác thực Email

Luồng sự kiện chính 1. Người dùng đăng nhập vào hệ thống bằng tài khoản chưa xác thực Email.

2. Hệ thống thông báo tài khoản chưa xác thực và ứng dụng chuyển người dùng đến trang “Xác thực Email”.

</div><span class="text_page_counter">Trang 39</span><div class="page_container" data-page="39">

3. Hệ thống kiểm tra tính hợp lệ của Email, đảm bảo Email này đã được đăng ký tài khoản trước đó và hiện tại chưa xác thực, sau đó hệ thống gửi một Email xác thực chứa đường Link xác thực đến Email của người dùng.

4. Người dùng bấm vào đường dẫn trong Email và dẫn đến trang Web xác thực Email.

5. Trang Web thông báo thay đổi mật khẩu thành công.6. Hệ thống ghi nhận tài khoản đã xác thực và chuyển người dùng đến trang chủ của ứng dụng.

Luồng sự kiện phụ Không

<b>3.3.4.5. Use Case Xem danh sách bạn bè</b>

<i>Bảng 3.9 Use Case Xem danh sách bạn bè</i>

Tên Use Case Xem danh sách bạn bè

Mục đích Xem danh sách bạn bè của người dùng hiện tại.Người dùng Người dùng đã đăng nhập

Điều kiện kích hoạt Người dùng muốn xem danh sách bạn bè của mìnhTiền điều kiện Người dùng đã đăng nhập thành công.

Hậu điều kiện Danh sách bạn bè hiển thị trên màn hình người dùng.Luồng sự kiện chính 1. Người dùng chọn tab “Friends” (Bạn bè).

</div><span class="text_page_counter">Trang 40</span><div class="page_container" data-page="40">

2. Hệ thống trả về danh sách bạn bè của người dùng và thể hiện số lượng bạn bè hiện tại.

Luồng sự kiện phụ 2.a Người dùng có thể chọn lệnh xóa kết bạn để xóa kết bạn.

Mở rộng

- Ứng dụng ghi nhận kết nối với hệ thống thất bại và thông báo

+ TH1: Người dùng chọn lệnh thử lại.Use Case quay lại 05.2.

<b>3.3.4.6. Use Case Quản lý danh sách lời mời kết bạn</b>

<i>Bảng 3.10 Quản lý danh sách lời mời kết bạn</i>

Tên Use Case Quản lý danh sách lời mời kết bạn

Mục đích Quản lý danh sách lời mời kết bạn của người dùngNgười dùng Người dùng đã đăng nhập

Điều kiện kích hoạt Người dùng muốn xem danh sách lời mời kết bạnTiền điều kiện <sup>- Người dùng đã đăng nhập thành công.</sup>

- Người dùng đang ở trong trang “Danh sách lời mời kết bạn”.Hậu điều kiện <sup>Màn hình hiển thị danh sách lời mời người dùng đã nhận bao </sup>

4. Hệ thống trả về danh sách lời mời kết bạn theo lệnh người dùng đã chọn trước đó.

Luồng sự kiện phụ 4.a. Người dùng nhấn lệnh thu hồi lời mời đã gửi. Hệ thống

</div>

×