Xây dựng website nghe nhạc kết hợp nhận diện nhạc qua giai điệu và đề xuất (khóa luận tốt nghiệp)

Đề xuất bài hát dựa trên bài hát đang nghe của người dùng .... TÓM TẮT KHÓA LUẬN Trong đề tài này, chúng em tập trung nghiên cứu các mô hình nhận diện âm nhạc và các loại mô hình phân lo

ĐẠI HỌC QUỐC GIA TP HỒ CHÍ MINH TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN

KHOA CÔNG NGHỆ PHẦN MỀM

TRẦN DUY KHÁNH NGUYỄN HỮU TRÍ

KHÓA LUẬN TỐT NGHIỆP

Xây dựng Website Nghe Nhạc Kết Hợp Nhận Diện Nhạc

Music Website With Music Recognition by Melody And

Recommendation

KỸ SƯ NGÀNH KỸ THUẬT PHẦN MỀM

TP HỒ CHÍ MINH, 2022

ĐẠI HỌC QUỐC GIA TP HỒ CHÍ MINH TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN

KHOA CÔNG NGHỆ PHẦN MỀM

TRẦN DUY KHÁNH - 18520075 NGUYỄN HỮU TRÍ - 18521528

KHÓA LUẬN TỐT NGHIỆP

Xây dựng Website Nghe Nhạc Kết Hợp Nhận Diện Nhạc

Music Website With Music Recognition by Melody And

THÔNG TIN HỘI ĐỒNG CHẤM KHÓA LUẬN TỐT NGHIỆP

Hội đồng chấm khóa luận tốt nghiệp, thành lập theo Quyết định số……… ngày ……… của Hiệu trưởng Trường Đại học Công nghệ Thông tin

Để hoàn thành đề tài này, chúng em xin gửi lời cảm ơn chân thành đến:

Ban Giám hiệu trường Đại học Công nghệ Thông tin – ĐHQG TP.HCM vì đã tạo điều kiện về cơ sở vật chất với hệ thống thư viện hiện đại, đa dạng các loại sách, tài liệu thuận lợi cho việc tìm kiếm, nghiên cứu thông tin

Chúng em xin gửi lời cảm ơn chân thành đến thầy Trần Anh Dũng đã tận tình giúp đỡ, định hướng cách tư duy và cách làm việc khoa học Đó là những góp ý hết sức quý báu không chỉ trong quá trình thực hiện đề tài này mà còn là hành trang tiếp bước cho chúng

em trong quá trình học tập và lập nghiệp sau này

Và cuối cùng, chúng em xin gửi lời cảm ơn đến gia đình, tất cả thầy cô trong khoa, bạn

bè, tập thể lớp KTPM2018 là những người luôn sẵn sàng sẻ chia và giúp đỡ trong học tập và cuộc sống Mong rằng, chúng ta sẽ mãi mãi gắn bó với nhau

Trong quá trình làm đề này này chúng em không tránh khỏi được những sai sót, chúng

em kính mong nhận được sự chỉ dẫn và góp ý của quý thầy cô để đề tài được hoàn thiện hơn

Chúng em xin chân thành cảm ơn Xin chúc những điều tốt đẹp nhất sẽ luôn đồng hành cùng mọi người

Thành phố Hồ Chí Minh, … tháng … năm 2022

Sinh viên

TRẦN DUY KHÁNH NGUYỄN HỮU TRÍ

MỤC LỤC

Chương 1 GIỚI THIỆU CHUNG 1

1.1 Thực trạng nhu cầu nghe nhạc hiện nay 1

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

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

1.4 Phạm vi nghiên cứu 2

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

Chương 2 KIẾN THỨC NỀN TẢNG 3

2.1 Tổng quan về mô hình MVC 3

2.1.1 Khái niệm 3

2.1.2 Cấu trúc mô hình MVC 3

2.1.3 Mô hình MVC trong ứng dụng Web 4

2.2 Tổng quan về NET 5

2.2.1 Giới thiệu 5

2.2.2 Tạo sao chọn NET core để phát triển server 6

2.3 Angular 7

2.3.1 Giới thiệu 7

2.3.2 Ưu điểm của Angular 7

2.4 Hệ quản trị cơ sở dữ liệu MongoDB 8

2.4.1 Giới thiệu 8

2.4.2 Ưu điểm của MongoDB 9

2.5 Flask 9

2.5.1 Giới thiệu về Flask 9

2.5.2 Tại sao sử dụng Flask 9

2.6 Keras 9

2.6.1 Giới thiệu về Keras 9

2.6.2 Tại sao sử dụng Keras 10

Chương 3 PHÂN TÍCH 11

3.1 Tìm hiểu công nghệ 11

3.1.1 Tổng quan về quá trình 11

3.1.2 Xử lý thu âm 11

3.1.3 Time-Domain và Frequency-Domain 12

3.2 Xây dựng hệ thống 15

3.2.1 Xây dựng kiến trúc hệ thống 15

3.2.2 Thiết kế hệ thống 16

3.3 Phân tích 31

3.3.1 Recognizer Server 31

3.3.2 Music Server 34

Chương 4 THIẾT KẾ GIAO DIỆN 39

4.1 Giao diện trang chủ 39

4.1.1 Giao diện trang chủ 39

4.1.2 Giao diện chức năng Songs For You 40

4.1.3 Giao diện chức năng Genre Songs 41

4.2 Giao diện Player 42

4.2.1 Chức năng Lyric 42

4.2.2 Chức năng Karaoke 43

4.3 Giao diện trang admin 44

4.3.1 Trang admin 44

4.4 Giao diện chức năng quản lý bài hát 45

4.4.1 Danh sách bài hát 45

4.4.2 Thêm bài hát 46

4.4.3 Chức năng Sửa Thông Tin Bài Hát 47

4.4.4 Chức năng Chi tiết bài hát 48

4.5 Giao diện chức năng Quản Lý Nghệ Sĩ 49

4.5.1 Chức năng Danh sách Nghệ Sĩ 49

4.5.2 Chức năng Chi Tiết Nghệ Sĩ 50

4.5.3 Chức năng Thêm Nghệ Sĩ 51

4.5.4 Chức năng Sửa Thông Tin Nghệ Sĩ 52

4.6 Chức năng đề xuất nhạc 53

4.6.1 Chức năng Đề Xuất Nhạc Theo Bài Hát Hiện Tại 53

4.6.2 Chức năng Đề Xuất Nhạc Cho Người Dùng 54

4.6.3 Chức năng Đề Xuất Nhạc Theo Thể Loại Yêu Thích Của Người Dùng 55 4.7 Chức năng Nhận Diện Bài Hát 56

4.7.1 Giao diện trang nhận diện 56

4.7.2 Giao diện trang ghi âm 57

4.7.3 Giao diện trang Kết Quả Nhận Diện 60

4.8 Chức năng Playlist 61

Chương 5 HIỆN THỰC HÓA CHỨC NĂNG NHẬN DIỆN 62

5.1 Quá trình thu thập dữ liệu 62

5.1.1 Xác định các API cần thiết: 63

5.1.2 Cách tạo Signature cho request: 64

5.1.3 Gọi API để crawl dữ liệu: 65

5.2 Kết quả thu được 66

5.3 Xử lý lưu trữ và chuyển đổi âm thanh 67

5.3.1 Tính chất của thanh âm 67

5.3.2 Chuyển đổi và tìm kiếm bài hát 68

5.4 Hiện thực hóa công nghệ 71

5.4.1 Chuyển đổi và lưu trữ âm thanh 71

5.4.2 Tìm kiếm bài hát 73

5.4.3 Kiểm thử độ chính xác 73

Chương 6 HIỆN THỰC HÓA CHỨC NĂNG ĐỀ XUẤT NHẠC 78

6.1 Xây dựng hệ thống đề xuất 78

6.2 Hệ thống phân loại 79

6.2.1 Thu thập dữ liệu 79

6.2.2 Lọc dữ liệu 79

6.2.3 Audio Preprocessing 82

6.2.4 Mô hình mạng 83

6.3 Huấn luyện mô hình 86

6.4 Đánh giá mô hình 87

6.4.1 Các thông số để đánh giá mô hình CNN 87

6.4.2 Mô hình Resnet50 88

6.5 Hệ thống Đề Xuất 90

6.6 Xây dựng API cho hệ thống đề xuất 91

6.6.1 Đề xuất bài hát dựa trên bài hát đang nghe của người dùng 91

6.6.2 Đề xuất dựa trên bài hát người dùng nghe nhiều 92

6.6.3 Đề xuất dựa trên thể loại người dùng nghe nhiều 93

Chương 7 KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN 94

7.1 Ưu điểm 94

7.2 Nhược điểm 94

7.3 Kết quả đạt được 94

7.3.1 Về mặt nghiên cứu: 94

7.3.2 Về mặt sản phẩm: 95

7.4 Hướng phát triển 95

TÀI LIỆU THAM KHẢO 96

DANH MỤC HÌNH

Hình 2.1.1 Mô hình MVC 3

Hình 2.1.2 Mô hình MVC trong ứng dụng Web 4

Hình 2.2.1 Net core và Net framework 5

Hình 2.3.1 Angular 7

Hình 2.4.1 So sánh mức độ phổ biến của MongoDB 8

Hình 3.1.1 Mô tả Processing Pipeline 11

Hình 3.1.2 Xử lý thu âm 12

Hình 3.1.3-1 Analog và Digital Signal 12

Hình 3.2.3.2.1 Kiến trúc hệ thống của website 15

Hình 3.2.2 Sơ đồ Usecase 16

Hình 3.3.1 Sơ đồ lớp hệ thống nhận diện 31

Hình 3.3.2 Sơ đồ lớp Music Server 34

Hình 4.1.1 Giao diện trang chủ của Trang Web 39

Hình 4.1.2 Giao diện Songs For You 40

Hình 4.1.3 Giao diện chức năng Genre Songs 41

Hình 4.2.1 Giao diện chức năng Lyric 42

Hình 4.2.2 Giao diện chức năng Karaoke 43

Hình 4.3.1 Giao diện trang Admin 44

Hình 4.4.1 Giao diện chức năng danh sách bài hát 45

Hình 4.4.2 Giao diện chức năng Thêm Bài Hát 46

Hình 4.4.3 Giao diện chức năng Sửa Thông Tin Bài Hát 47

Hình 4.4.4 Giao diện chức năng Chi Tiết Bài Hát 48

Hình 4.5.1 Giao diện chức năng Danh sách Nghệ Sĩ 49

Hình 4.5.2 Giao diện chức năng Chi Tiết Nghệ Sĩ 50

Hình 4.5.3 Giao diện chức năng Thêm Nghệ Sĩ 51

Hình 4.5.4 Giao diện chức năng Sửa Thông Tin Nghệ Sĩ 52

Hình 4.6.1 Giao diện chức năng Đề Xuất Theo Bài Hát Hiện Tại 53

Hình 4.6.2 Giao diện chức năng Đề Xuất Nhạc Cho Người Dùng 54

Hình 4.6.3 Giao diện chức năng Đề Xuất Nhạc Theo Thể Loại Yêu Thích 55

Hình 4.7.1 Giao diện chức năng nhận diện 56

Hình 4.7.2 Giao diện chức năng Ghi Âm Bài Hát 57

Hình 4.7.3 Giao diện chức năng Dừng Ghi Âm 58

Hình 4.7.4 Giao diện chức năng Preview bản Record 59

Hình 4.7.5 Giao diện trang Kết Quả 60

Hình 4.8.1 Giao diện trang Playlist 61

Hình 5.1.1 Tool để xác định API 63

Hình 5.1.2 Minh họa bước để xác định API 64

Hình 5.1.3 Minh họa bước để crawl dữ liệu 65

Hình 5.2.1 Thống kê dữ liệu thu được 66

Hình 5.2.2 Data thu được trên Google Drive 66

Hình 5.3.1 Minh họa tính chất của âm thanh 67

Hình 5.3.2 Spectrogram 68

Hình 5.3.3 Constellation Map 69

Hình 5.3.4 Combinatorial Hash Generation 69

Hình 5.3.5 Time-Invariant Hashes 70

Hình 5.3.6 Part of Time-Invariant Hashes 70

Hình 5.3.7 Minh hoạ cách tìm kiếm 71

Hình 5.4.1 Quá trình chuyển đổi file Audio 72

Hình 5.4.2 Quá trình tìm kiếm 1 file nhạc 73

Hình 5.4.3 Kết quả kiểm thử bằng file 74

Hình 5.4.4 Kết quả kiểm thử bằng thu âm 76

Hình 6.1.1 Các bước xây dựng hệ thống đề xuất dựa trên CNN 78

Hình 6.2.1 Thống kê các file wav ở các thể loại 80

Hình 6.2.2 Thống kê các file wav ở các thể loại sau khi lọc 81

Hình 6.2.3 Thống kê các file wav ở các thể loại sau khi lọc 82

Hình 6.2.4 Sử dụng thư viện Librosa để trích xuất đặc trưng của Audio 83

Hình 6.2.5 Cấu trúc chung của Resnet50 84

Hình 6.2.6 Cấu trúc từng layer của Resnet50 84

Hình 6.2.7 Cấu trúc của Identity Block 85

Hình 6.2.8 Cấu trúc của Identity Block 85

Hình 6.4.1 Các định nghĩa trong đánh giá 87

Hình 6.4.2 Confusion Matrix của mô hình Resnet50 89 Hình 6.5.1 Minh họa Cosine Distance/Similarity 90 Hình 6.6.1 Minh hoạ quá trình đề xuất bài hát tương ứng với bài hát hiện tại 91 Hình 6.6.2 Minh họa quá trình đề xuất bài hát tương ứng với bài hát hiện tại 92 Hình 6.6.3 Minh họa quá trình đề xuất thể loại tương ứng với lịch sử nghe nhạc của người dùng 93

DANH MỤC BẢNG

Bảng 3.2.1 Đặc tả Usecase Đăng ký 17

Bảng 3.2.2 Đặc tả Usecase Đăng nhập 18

Bảng 3.2.3 Đặc tả Usecase Đăng Xuất 18

Bảng 3.2.4 Đặc tả Usecase Bảng xếp hạng 19

Bảng 3.2.5 Đặc tả Usecase Nghe nhạc 20

Bảng 3.2.6 Đặc tả Usecase Xem Lyrics 20

Bảng 3.2.7 Đặc tả Usecase Karaoke 21

Bảng 3.2.8 Đặc tả Usecase Tương tác với bài nhạc 22

Bảng 3.2.9 Đặc tả Usecase Playlist cá nhân 22

Bảng 3.2.10 Đặc tả Usecase Gợi ý âm nhạc 23

Bảng 3.2.11 Đặc tả Usecase Tìm kiếm bài hát 24

Bảng 3.2.12 Đặc tả Usecase Nhận diện nhạc qua giai điệu 24

Bảng 3.2.13 Đặc tả Usecase Quản lý Profile 25

Bảng 3.2.14 Đặc tả Usecase Thêm bài hát 26

Bảng 3.2.15 Đặc tả Usecase Sửa bài hát 26

Bảng 3.2.16 Đặc tả Usecase Xóa bài hát 27

Bảng 3.2.17 Đặc tả Usecase Thêm nghệ sĩ 28

Bảng 3.2.18 Đặc tả Usecase Sửa nghệ sĩ 28

Bảng 3.2.19 Đặc tả Usecase Xóa nghệ sĩ 29

Bảng 3.2.20 Đặc tả Usecase Thêm người dùng 30

Bảng 3.2.21 Đặc tả Usecase Sửa người dùng 30

Bảng 3.2.22 Đặc tả Usecase Xóa người dùng 31

Bảng 3.3.1 Danh sách lớp hệ thống nhận diện 32

Bảng 3.3.2 Danh sách thuộc tính của Song 32

Bảng 3.3.3 Danh sách phương thức của Song 32

Bảng 3.3.4 Danh sách thuộc tính của Fingerprint 33

Bảng 3.3.5 Danh sách phương thức của Fingerprint 33

Bảng 3.3.6 Danh sách thuộc tính của TimeFrequency 33

Bảng 3.3.7 Danh sách phương thức của TimeFrequency 33

Bảng 3.3.8 Danh sách lớp Music Server 35

Bảng 3.3.9 Danh sách thuộc tính của Song 35

Bảng 3.3.10 Danh sách phương thức của Song 36

Bảng 3.3.11 Danh sách thuộc tính của Artist 36

Bảng 3.3.12 Danh sách phương thức của Artist 36

Bảng 3.3.13 Danh sách thuộc tính của Genre 37

Bảng 3.3.14 Danh sách phương thức của Genre 37

Bảng 3.3.15 Danh sách thuộc tính của Playlist 37

Bảng 3.3.16 Danh sách phương thức của Playlist 38

Bảng 3.3.17 Danh sách thuộc tính của User 38

Bảng 3.3.18 Danh sách phương thức của User 38

Bảng 4.1.1 Mô tả thành phần của Songs For You 40

Bảng 4.1.2 Mô tả thành phần của Genre Songs 41

Bảng 4.2.1 Mô tả thành phần chức năng Lyric 42

Bảng 4.2.2 Mô tả thành phần chức năng Karaoke 43

Bảng 4.3.1 Mô tả thành phần trang Admin 44

Bảng 4.4.1 Mô tả thành phần chức năng Danh sách bài hát 45

Bảng 4.4.2 Mô tả thành phần chức năng Thêm Bài Hát 46

Bảng 4.4.3 Mô tả thành phần chức năng Sửa Thông Tin Bài Hát 47

Bảng 4.4.4 Mô tả thành phần chức năng Chi Tiết Bài Hát 48

Bảng 4.5.1 Mô tả thành phần chức năng Danh sách Nghệ Sĩ 49

Bảng 4.5.2 Mô tả thành phần chức năng Chi Tiết Nghệ Sĩ 50

Bảng 4.5.3 Mô tả thành phần chức năng Thêm Nghệ Sĩ 51

Bảng 4.5.4 Mô tả thành phần chức năng Sửa Thông Tin Nghệ Sĩ 52

Bảng 4.6.1 Mô tả thành phần chức năng Đề Xuất Theo Bài Hát Hiện Tại 54

Bảng 4.6.2 Mô tả thành phần chức năng Đề Xuất Nhạc Cho Người Dùng 54

Bảng 4.6.3 Mô tả thành phần chức năng Đề Xuất Nhạc Theo Thể Loại Yêu Thích 55

Bảng 4.7.1 Giao diện chức năng nhận diện 56

Bảng 4.7.2 Mô tả thành phần chức năng Ghi Âm Bài Hát 57

Bảng 4.7.3 Mô tả giao diện dừng ghi âm 58

Bảng 4.7.4 Mô tả giao diện Preview bản Record 59

Bảng 4.7.5 Mô tả giao diện trang kết quả 60 Bảng 4.8.1 Mô tả giao diện trang Playlist 61

DANH MỤC TỪ VIẾT TẮT

mềm sẵn sàng cho sử dụng

Transform

Phép biến đổi fourier rời rạc

một bộ khung và các thư viện lập trình được đóng gói Cung cấp các tính năng có sẵn như mô hình, API và các yếu tố khác để tối giản cho việc phát triển các ứng dụng web

Cofficients

Các hệ số mã hóa sóng âm dựa trên phương trình biến đổi chuỗi Fourier Transformer

TÓM TẮT KHÓA LUẬN

Trong đề tài này, chúng em tập trung nghiên cứu các mô hình nhận diện âm nhạc và các loại mô hình phân loại nhạc, từ đó áp dụng vào hệ thống tìm kiếm cho ứng dụng nghe nhạc và đề xuất nhạc cho người dùng Trong quá trình xây dựng hệ thống, nhóm được tìm hiểu và sử dụng các công nghệ như ASP.Net core, Angular, Docker, các hệ quản trị CSDL như MongoDB và SQL,

Bố cục của khóa luận:

Chương 1: Giới thiệu về đề tài, đưa ra các vấn đề gặp phải và hướng giải quyết cho

những vấn đề này

Chương 2: Trình bày các kiến thức, công nghệ nền tảng để xây dựng nên hệ thống Chương 3: Phân tích

Chương 4: Thiết kế giao diện

Chương 5: Hiện thức hóa chức năng nhận diện

Chương 6: Hiện thực hóa chức năng đề xuất nhạc

Chương 7: Kết luận và hướng phát triển

Tài Liệu Tham Khảo

1

Chương 1 GIỚI THIỆU CHUNG

1.1 Thực trạng nhu cầu nghe nhạc hiện nay

Hiện nay, dưới sự phát triển của xã hội, nhu cầu giải trí của con người ngày càng tăng mạnh Theo thống kê ở Việt Nam hằng ngày có 68.17 triệu người dùng Internet

và mỗi người dành khoảng 1 giờ 1 phút mỗi ngày để nghe nhạc

Dưới nhu cầu khổng lồ ấy, thị trường âm nhạc ngày càng phát triển, liên tục ra mắt nhiều bài hát đến với người dùng Và từ đây phát sinh ra nhiều vấn đề như: Nếu một ngày bạn nghe thấy một bản nhạc hay ở nhà hàng hoặc một nơi bất kỳ nào đó hoặc bạn nhớ một bài hát tuổi thơ nhưng mãi không nhớ nỗi tên bài hát, bạn làm thế nào để tìm kiếm bài hát đó? Làm thế nào để gợi ý sản phẩm âm nhạc sao cho phù hợp với sở thích của từng người dùng ?

1.2 Lý do chọn đề tài

Nhờ vào sự phát triển của công nghệ thông tin hiện nay, sự bùng nổ của Machine Learning giúp cho việc giải bài toán trên ngày càng khả thi hơn Nhằm áp dụng những kiến thức đã được trang bị trong quá trình học tập, tìm hiều các công nghệ hiện đại về xử lý âm thanh, Deep Learning và hiện thực hóa các công nghệ đó, áp dụng các công nghệ để tạo ra các sản phẩm mang lại lợi ích cho cả người dùng và nhà phát hành nhạc, chúng em quyết định lựa chọn “Xây dựng Website Nghe Nhạc Kết Hợp Nhận Diện Nhạc Qua Giai Điệu Và Đề Xuất” làm đề tài nghiên cứu cho khóa luận tốt nghiệp

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

Khoá luận này hướng đến nghiên cứu các đối tượng sau:

- Phạm vi địa lý: Trong lãnh thổ Việt Nam

- Phạm vi người sử dụng: Người Việt Nam

- Phạm vi nội dung bài hát: Nhạc Việt, Âu Mỹ và Hàn Quốc

- Phạm vi công nghệ:

● Frontend: Angular

● Backend (Recognize): ASP NET

● Backend (Music Service): ASP NET

● Backend (Recommender System): Flask

1.5 Phương pháp nghiên cứu

Nhóm đã sử dụng các phương pháp:

- Phương pháp đọc tài liệu

- Phân tích các app tương tự

- Phương pháp thực nghiệm

Hình 2.1.1 Mô hình MVC

2.1.2 Cấu trúc mô hình MVC

- Tầng xử lý – Controller :

Xử lí logic của ứng dụng, là cầu nối giữa tầng View và Model Hay nói một cách

cụ thể, Controller sẽ nhận yêu cầu được gửi từ View và thực hiện xử lí yêu cầu, truy

vấn hoặc thao tác dữ liệu lên tầng Model Sau khi xử lý xong, kết quả sẽ được trả về lại cho tầng View

- Tầng logic dữ liệu – Model:

4

Tầng Model là trung gian giữa ứng dụng và hệ quản trị cơ sở dữ liệu để cung cấp và quản lí mô hình và các thao tác lên dữ liệu Thông thường, tầng Model sẽ kết nối với một hoặc nhiều cơ sở dữ liệu để thực hiện các thao tác lên dữ liệu

- Tầng giao diện – View:

Thể hiện giao diện người dùng, là thành phần giao tiếp giữa người dùng (user)

và ứng dụng (application)

2.1.3 Mô hình MVC trong ứng dụng Web

Với sự phát triển của các công nghệ xây dựng web ở cả Frontend và Backend, các nhà phát triển có thể xây dựng và phát triển ứng dụng web một cách độc lập nhưng vẫn đảm bảo được tính kiến trúc của ứng dụng

5

− Tầng giao diện người dùng (View) sẽ được phát triển độc lập ở phía client sử dụng

các công nghệ Frontend như VueJS, ReactJS, AngularJS … Nói cách khác, client sẽ được chạy trên 1 server độc lập và có thể tương tác với phía server của backend

− Tầng xử lí (Controller) và logic dữ liệu (Model) sẽ được phát triển độc lập ở phía

server sử dụng các công nghệ Backend như ExpressJS, DotNetCore, Flank, …

− Sau khi hoàn thành việc phát triển, client sẽ cung cấp 1 bản build hoàn chỉnh để thêm vào phía Server Người dùng sẽ yêu cầu thành phần giao diện thông qua request gửi đến Server

6

nhanh chóng, linh hoạt và chạy trên được nhiều nền tảng khác nhau như Windows, Linux, Mac

Đặc trưng của NodeJS

Mỗi ứng dụng NodeJS chạy trên một process đơn và không tạo thêm luồng mới cho mỗi request Đây cũng là điểm khác biệt của NodeJS so với các môi trường thực

thi khác như DotNetCore, … Thay vào đó, NodeJS sử dụng cơ chế bất đồng bộ I/O (non-blocking I/O) để quản lí các request thay vì block chúng nhằm giảm thiểu việc

tốn tài nguyên xử lí Nhờ vào cơ chế này, NodeJS có thể xử lý hàng ngàn kết nối đồng thời với 1 server duy nhất mà không cần nhà phát triển phải bỏ công sức và thời gian

để quản lí các luồng

2.2.2 Tạo sao chọn NET core để phát triển server

− Hợp nhất việc xây dựng web UI và web APIs

− Tích hợp những client-side frameworks hiện đại và những luồng phát triển

− Dependency injection được xây dựng sẵn

− HTTP request được tối ưu nhẹ hơn

− Có thể host trên IIS hoặc self-host trong process của riêng bạn

− Được xây dựng trên NET Core, hỗ trợ thực sự app versioning

− Chuyển các thực thể, thành phần, module như những NuGet packages

− Những công cụ mới để đơn giản hóa quá trình phát triển web hiện đại

− Xây dựng và chạy đa nền tảng (Windows, Mac và Linux)

− Mã nguồn mở và tập trung vào cộng đồng

7

2.3 Angular

2.3.1 Giới thiệu

Hình 2.3.1 Angular

2.3.2 Ưu điểm của Angular

− Dễ dàng tạo ra các Single Page Application

− Mang lại cảm giác linh hoạt, thân thiện khi cung cấp khả năng data binding tới HTML

− Dễ dàng Unit test

− Tái sử dụng component một cách dễ dàng

− Tiết kiệm thời gian viết code và tích hợp nhiều chức năng hơn

− Chạy được trên nhiều loại trình duyệt

Đặc điểm của MongoDB:

● Khác với SQL, MongoDB không cần định nghĩa sẵn các schema, các trường có thể được thêm vào trực tiếp

9

2.4.2 Ưu điểm của MongoDB

− MongoDB lưu trữ dữ liệu dễ dàng, linh hoạt và dễ dàng mở rộng vì dữ liệu trong MongoDB không có sự ràng buộc lẫn nhau

− MongoDB có tốc độ truy vấn nhanh hơn so với các cơ sở dữ liệu quan hệ

− MongoDB có khả năng mở rộng tốt thông qua các cluster

2.5 Flask

2.5.1 Giới thiệu về Flask

Bên cạnh Dijango thì Flask là một Web Framework cực kỳ phổ biến, nhẹ và dễ

dàng sử dụng cho người mới bắt đầu hoặc những Data Scientist, muốn xây dựng API

để hỗ trợ xây dựng mô hình máy hình máy học

2.5.2 Tại sao sử dụng Flask

Flask rất dễ dàng sử dụng với syntax đơn giản Flask giảm thời gian bỏ ra để xây dựng hệ thống Backend của hệ thống và cho phép lập trình viên xây dựng nhanh hơn

và thông minh hơn Với một cộng đồng hỗ trợ tương đối rộng Bên cạnh đó Flask cung cấp nhiều tài liệu từ cài đặt đến thực hiện và triển khai

2.6 Keras

2.6.1 Giới thiệu về Keras

Keras là một open source cho Neural Network được viết bằng Python Keras được dựa trên cấu trúc tối thiểu cho phép người dùng tạo ra model Deep Learning với nhiều tính năng như:

● API đơn giản và dễ dàng mở rộng

● Hỗ trợ nhiều nền tảng và backends

● Là một framework thân thiện với người dùng có thể chạy trên cả CPU và GPU

10

2.6.2 Tại sao sử dụng Keras

Keras có một cộng đồng hỗ trợ lớn và hỗ trợ tài liệu chi tiết dễ dàng cho việc nghiên cứu Keras hỗ trợ sẵn các model giúp cho việc xây dựng mô hình máy học đơn

giản hơn chỉ qua các bước như:

● Chuẩn bị data cho việc training model

● Thực hiện Data Preprocessing

● Xây dựng mô hình máy học

● Train mô hình dựa trên phương thức fit() của Keras

● Đánh giá mô hình dựa trên dữ liệu test

Ngoài ra Chúng ta có thể tăng tốc tốc độ huấn luyện mô hình bằng cách sử dụng nhiều

GPU

11

Chương 3 PHÂN TÍCH

3.1 Tìm hiểu công nghệ

3.1.1 Tổng quan về quá trình

Việc chuyển đổi có thể xuất hiện lỗi Do đó, thay vì chỉ chuyển một lần duy nhất,

bộ chuyển đổi này thực hiện nhiều lần chuyển đổi, quá trình này được gọi là Lấy Mẫu (Sampling)

Hình 3.1.1 Mô tả Processing Pipeline

12

Để thu được hết tất cả các âm thì chúng ta sẽ âm với tần số gấp đôi dải tần mà con người có thể có nghe được ( 20Hz – 20,000Hz) Do đó, hầu hết các máy thu âm hiện nay sử dụng tần số 44,100 Hz

Nói cách khác, có thể biểu diễn bất kỳ Time-Domain nào bằng cách thể hiện tập

hợp tần số, biên độ và pha tương ứng của mỗi hình sin tạo nên tín hiệu Sự thể hiện này

được gọi là Frequency Domain Có thể coi Frequency Domain là một fingerprint hoặc một signature của Tín hiệu Time-Domain

Hình 3.1.3-2 Analog và Digital Signal

14

Chúng ta sử dụng Discrete Fourier Transform (DFT) để chuyển tín hiệu từ Time Domain ra Frequency Domain DFT là một lý thuyết toán học để biểu diễn Fourier Analysis trên một mẫu tín hiệu rời rạc (Sample Signal)

Một trong những thuật toán nổi tiếng nhất cho việc tính toán của DFT là The Fast Fourier transform (FFT).Cho đến nay, biến thể được sử dụng phổ biến nhất của FFT

là thuật toán Cooley – Tokey Với việc sử dụng đệ quy thì thay vì tính toán với DFT đơn thuần với độ phức tạp là O(n2), ta chỉ mất O(n log n )

Ngoài ra còn một số cách xử lý âm thanh như kích tín hiệu tần số, trượt window sau

đó sử dụng DFT và FFT, mel filterbank

Hình 3.1.3-3 Chuyển đổi từ TimeDomain sang FrequencyDomain

Hình 3.1.3-4 Công thức biến đổi cho hàm liên tục

15

3.2 Xây dựng hệ thống

3.2.1 Xây dựng kiến trúc hệ thống

Hệ thống bao gồm các thành phần sau:

⎼ Web (client): thể hiện giao diện nơi người dùng tương tác với hệ thống Client

giao tiếp với Server thông qua Request/Response để yêu cầu xử lý thông tin và nhận kết quả hiển thị lên cho người dùng Web (client) được hiện thực hóa sử

dụng Angular

Hình 3.1.3-5 Công thức biến đổi cho hàm rời rạc

Hình 3.22.3.2.1 Kiến trúc hệ thống của website

16

⎼ Server (.NET Core): Nhận và xử lý các request về tính năng nghe nhạc từ Client

Có thể tương tác với Database để tương tác dữ liệu và trả kết quả về cho Client thông qua Response Server được hiện thực hóa sử dụng NET Core và Python

⎼ Database: Lưu trữ toàn bộ dữ liệu của hệ thống

⎼ Storage: Lưu trữ các file BLOB quá nặng mà Database không thể lưu trữ tốt 3.2.2 Thiết kế hệ thống

Hình 3.2.2 Sơ đồ Usecase

17

3.2.2.1 Đặc tả Usecase Đăng ký

Tóm tắt Chức năng đăng ký vào hệ thống

Dòng sự kiện chính 1 Hệ thống hiển thị biểu mẫu đăng ký

2 Người dung nhập các trường thông tin đăng ký và nhấn “Đăng ký”

3 Hệ thống kiểm tra thông tin đăng ký và thực hiện đăng

ký

(Dòng sự kiện khác: Đăng ký không thành công)

4 Hệ thống hiển thị đăng ký thành công và chuyển qua trang đăng nhập

Dòng sự kiện khác 1 Đăng ký không thành công:

Hệ thống hiển thị thông báo tài khoản đăng ký không hợp lệ hoặc lỗi

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống

trước khi thực thiện

use case

Actor: Anonymous Điều kiện: không có

Tóm tắt Chức năng đăng nhập vào hệ thống

Dòng sự kiện chính 1 Hệ thống hiển thị biểu mẫu đăng nhập

2 Người dùng nhập tên và tài khoản (cả 2 trường này đều bắt buộc nhập) và nhấn “Đăng nhập”

3 Hệ thống kiểm tra thông tin đăng nhập

18

(Dòng sự kiện khác: Thông tin đăng nhập sai)

4 Hệ thống hiển thị form chính

Dòng sự kiện khác 1 Thông tin đăng nhập sai:

Hệ thống hiển thị thông báo tài khoản đăng nhập không hợp lệ

Các yêu cầu đặc biệt Không có

Trạng thái hệ thống

trước khi thực thiện

use case

Actor: Admin Điều kiện: không có

3.2.2.3 Đặc tả Usecase Đăng Xuất

Tóm tắt Chức năng đăng xuất ra hệ thống

Dòng sự kiện chính 1 Người dùng nhấn vào Đăng xuất

19

3.2.2.4 Đặc tả Usecase Bảng xếp hạng

Tóm tắt Người dùng xem bảng xếp hạng các nghệ sĩ và bài hát

dựa trên lượt nghe, thích

Dòng sự kiện chính 1 Người dùng truy cập vào trang chủ

Tóm tắt Người dùng lựa chọn và phát bài nhạc mong muốn

Dòng sự kiện chính 1 Người dùng truy cập vào trang chủ

2 Người dùng nhấn vào nút Play trên bài nhạc

3.2.2.6 Đặc tả Usecase Xem Lyrics

Tóm tắt Người dùng lựa chọn bài nhạc và xem lời bài hát

Dòng sự kiện chính 1 Người dùng truy cập vào trang chủ

2 Người dùng nhấn vào nút Play trên bài nhạc

Tóm tắt Người dùng lựa chọn bài nhạc và hát Karaoke

21

Dòng sự kiện chính 1 Người dùng truy cập vào trang chủ

2 Người dùng nhấn vào nút Play trên bài nhạc

3 Hệ thống phát nhạc

4 Người dùng chọn nút Player trên thang Sidenav để chuyển đến giao diện phát nhạc lớn

5 Hệ thống hiển thị lời bài hát khớp với thời gian

6 Người dùng chọn nút Karaoke để chuyển qua Karaoke Mode

7 Hệ thống thu âm lại đoạn Karaoke

3.2.2.8 Đặc tả Usecase Tương tác với bài nhạc

Tóm tắt Người dùng lựa chọn bài nhạc và tương tác với bài hát

Dòng sự kiện chính 1 Người dùng truy cập vào trang chủ

2 Người dùng nhấn vào nút Like/Download trên bài nhạc

3 Hệ thống ghi nhận các hoạt động của người dùng

Dòng sự kiện khác Không có

Các yêu cầu đặc biệt Không có

Bảng 3.2.8 Đặc tả Usecase Tương tác với bài nhạc

3.2.2.9 Đặc tả Usecase Playlist cá nhân

Tóm tắt Người dùng lựa chọn bài nhạc và thêm vào playlist

Dòng sự kiện chính 1 Người dùng truy cập vào trang chủ

2 Người dùng nhấn vào nút Add to playlist trên bài nhạc

3 Hệ thống hiển thị danh sách Playlist

4 Người dùng thêm bài nhạc vào Playlist

Bảng 3.2.9 Đặc tả Usecase Playlist cá nhân

3.2.2.10 Đặc tả Usecase Gợi ý âm nhạc

23

Tóm tắt Người dùng được gợi ý các bài hát phù hợp với bản thân

Dòng sự kiện chính 1 Người dùng truy cập vào trang chủ

2 Người dùng nhấn vào nút Play trên bài nhạc

Bảng 3.2.10 Đặc tả Usecase Gợi ý âm nhạc

3.2.2.11 Đặc tả Usecase Tìm kiếm bài hát

Tóm tắt Người dùng tìm kiếm bài hát mong muốn

Dòng sự kiện chính 1 Người dùng truy cập vào trang chủ

2 Người dùng nhấn vào nút Search trên Side Nav

3 Hệ thống hiển thị ra khung search

4 Người dùng nhập nội dung tìm kiếm

5 Hệ thống hiển thị danh sách kết quả tìm kiếm

Dòng sự kiện khác Không có

Các yêu cầu đặc biệt Không có