6. Điểm: (Bằng chữ: )
4.5.2.19. Màn hình trình quản lý các cuộc hội thoại trực tuyến
Hình 4. 48: Giao diện màn hình trình quản lý các cuộc hội thoại
Bảng 4. 22: Đặc tả chi tiết giao diện màn hình trình quản lý các cuộc hội thoại
STT Tên Bắt buộc Định dạng Chú thích
1 Addition Văn
bản area Có Văn bản
Bao gồm avatar, email của người dùng, tin nhắn mới nhất và ngày của cuộc hội thoại gần nhất.
Khi nhấp, nội dung chat với người dùng sẽ hiện bên phải.
2 Avatar Có Hình ảnh Ảnh của người dùng.
Chương 4: Kiến trúc hệ thống 77
4 Message Có Văn bản Cập nhật liên tục tin nhắn mới nhất từ người dùng.
5 Date Có Văn bản Lưu ngày cuộc hội thoại gần nhất.
6 Avatar Có Hình ảnh Ảnh của người dùng.
7 Email Có Văn bản Email của người dùng.
8 User message Có Văn bản Hiển thị tin nhắn của người dùng.
9 Datetime Có Văn bản Lưu ngày giờ của từng tin nhắn
10 Admin
message Có Văn bản Hiển thị tin nhắn của quản trị viên.
11 Type a
message Có
Văn bản đầu vào
Khi nhấp, quản trị viên nhập câu trả lời những thắc mắc, câu hỏi của người dùng.
12 Icon send Có Icon Khi nhấp, tin nhắn sẽ được gửi và được hiển thị lên khung chat.
Chương 5: Hiện thực dự án 78
Chương 5: HIỆN THỰC DỰ ÁN 5.1. Môi trường phát triển
- Ngôn ngữ lập trình: C#.
- Framework: ASP.NET Core 2.2, ASP.NET Core SignalR. - Hệ quản trị cơ sở dữ liệu: Microsoft SQL Server 2014 và 2017.
- Môi trường tích hợp: Visual Studio 2017 và 2019.
5.2. Hiện thực chức năng thanh toán PayPal 5.2.1. Tạo một tài khoản PayPal Sandbox 5.2.1. Tạo một tài khoản PayPal Sandbox
Truy cập vào đường dẫn https://developer.paypal.com/, để vào môi trường thanh toán PayPal dành cho các nhà phát triển. Tạo một tài khoản để đăng nhập vào môi trường. Khi chúng ta tạo tài khoản đăng nhập vào môi trường phát triển PayPal, thì hệ thống PayPal sẽ tự động tạo cho chúng ta 2 tài khoản PayPal Sandbox mặc định. Chúng ta có thể tạo thêm các tài khoản PayPal Sandbox khác nếu muốn.
Hình 5. 1: Tài khoản PayPal Sandbox
*Loại Personal: Tài khoản tiền ra cá nhân khi thử nghiệm thanh toán sản phẩm bằng PayPal.
*Loại Business: Tài khoản tiền vào của ứng dụng.
Vào mục “My App & Credentials” tạo một ứng dụng để có được thông tin Client ID và Secret ID.
Chương 5: Hiện thực dự án 79
Hình 5. 2: Thông tin của ứng dụng trong môi trường phát triển PayPal *Sandbox account: Tài khoản tiền vào của ứng dụng.
5.2.2. Xây dựng các lớp lưu giá trị cấu hình thanh toán PayPal
- Xây dựng lớp PayPalConfig.cs khởi tạo các biến AuthToken, PostUrl, Business, ReturnUrl với kiểu dữ liệu string để cấu hình phương thức thanh toán PayPal trong appsettings.json.
- Xây dựng lớp PayPalService.cs để lấy dữ liệu các giá trị cấu hình phương thức thanh toán PayPal từ appsettings.json.
5.2.3. Cấu hình thanh toán PayPal cho hệ thống
Cấu hình các giá trị cho phương thức thanh toán PayPal và lưu trong appsettings.json: AuthToken, PostUrl, Business, ReturnUrl.
Chương 5: Hiện thực dự án 80
Hình 5. 3: Cấu hình các giá trị cho phương thức thanh toán PayPal
- AuthToken: Mã Client ID của ứng dụng trong môi trường phát triển PayPal - PostUrl: đường dẫn chuyển hướng đến trang đăng nhập thanh toán hóa đơn
bằng PayPal.
- Business: Tên tài khoản Sandbox loại Business của ứng dụng được tạo mặc định trong môi trường phát triển PayPal.
- ReturnUrl: đường dẫn chuyển hướng đến trang thanh toán thành công của hệ thống trang web.
5.2.3. Xây dựng lớp xử lý dữ liệu
- Xây dựng lớp đặt tên AtomPP xử lý dữ liệu để truyền API. + Khởi tạo các biến thông tin dữ liệu thanh toán PayPal.
+ Khởi tạo phương thức Parse( ): xử lý dữ liệu chuyển từ kiểu json sang kiểu dữ liệu thông thường để dễ dàng thao tác.
+ Khởi tạo phương thức Success( ): xử lý dữ liệu của PayPal truyền về, nếu thành công gọi phương thức Parse( ) trả về dữ liệu với các giá trị có kiểu dữ liệu thông thường.
5.2.4. Kết quả
Chương 5: Hiện thực dự án 81
Hình 5. 5: Thông tin dữ liệu thanh toán bên PayPal
5.3. Áp dụng hệ thống gợi ý
Để tìm hiểu và áp dụng hệ thống gợi ý cho đồ án lần này, nhóm thực hiện báo cáo đã bắt đầu tìm hiểu về cách sử dụng Machine Learning bằng ngôn ngữ C# bằng việc sử dụng thư viện MachineLearning.Net. Công việc được thực hiện qua các bước như sau:
- Tìm hiểu các cơ sở lý thuyết cơ bản về hệ thống gợi ý. - Tìm hiểu và xây dựng một dự án mẫu về hệ thống gợi ý.
Chương 5: Hiện thực dự án 82 - Áp dụng hệ thống gợi ý vào đồ án.
5.3.1. Tìm hiểu cơ sở lý thuyết (xem mục 2.4)
5.3.2. Tìm hiểu và xây dựng dự án mẫu về hệ thống gợi ý 5.3.2.1. Tập dữ liệu mẫu 5.3.2.1. Tập dữ liệu mẫu
Hệ thống mẫu sử dụng tập dữ liệu có chứa: - 30 tag
- 3000 bài báo - 3000 người dùng
- 105,873 hành động của người dùng bao gồm: xem, tải về, bình chọn tốt và bình chọn không tốt.
Hình 5. 6: Một đoạn dữ liệu của tập dữ liệu thử nghiệm
Vì người dùng không cung cấp những đánh giá rõ ràng cho từng sản phẩm và chỉ dựa vào các hành động của người dùng nên việc đầu tiên cần làm là xây dựng một phương thức để chuyển đổi các hành động này của người dùng để trả về một giá trị đại diện cụ thể duy nhất.
5.3.2.2. Cách tiếp cận User-based
Việc train dữ liệu để sử dụng cho phương pháp gợi ý dựa trên người dùng cũng khá đơn giản, chỉ là hành động lấy dữ liệu và trả về một mảng hai chiều chứa các đánh giá của từng người dùng dành cho từng sản phẩm.
Sau khi train dữ liệu thì hệ thống sẽ mã hóa và lưu dữ liệu vào 1 file có tên “recommender.dat”. Để hệ thống thao tác dễ dàng hơn cũng như tăng tốc độ.
Chương 5: Hiện thực dự án 83
Hình 5. 7: Bảng dữ liệu sau khi train dữ liệu (User-based)
Như đã trình bày ở trên thì cách tiếp cận này sẽ tìm ra nhóm người dùng tương tự với người dùng mục tiêu nhất. để tìm ra được danh sách này chúng ta cần so sánh những đánh giá đã được ghi lại của người dùng mục tiêu (ở đây là các hành động của người dùng) với những đánh giá của tất cả người dùng khác trong hệ thống.
Có nhiều cách để tính được mức độ tương quan của người dùng mục tiêu với những người dùng khác. Chúng ta sẽ sử dụng hệ số tương quan Pearson (số liệu thống kê kiểm tra đo lường mối quan hệ thống kê hoặc liên kết giữa các biến phụ thuộc với các biến liên tục) để sử dụng cho việc so sánh.
Hình 5. 8: Công thức hệ số tương quan Pearson
Chúng ta sẽ thực hiện việc so sánh mức độ tương quan của các người dùng bằng cách xây dựng một hàm với tham số chuyền vào là danh sách hành động của người dùng a và người dùng b và kết quả trả ra là hệ số tương quan Pearson. Và sau đó chạy hàm so sánh người dùng mục tiêu với tất cả người dùng còn lại trong hệ thống rồi sau đó chỉ cần sắp xếp lại danh sách người dùng theo chiều giảm dần của kết quả trả ra của hàm so sánh và lấy ra số lượng người dùng cần thiết để phục vụ cho việc gợi ý.
Chương 5: Hiện thực dự án 84 Sau khi chúng ta đã có danh sách những người dùng có độ tương quan cao nhất so với người dùng mục tiêu, chúng ta có thể lặp qua tất cả sản phẩm và xem xét đánh giá của họ đối với từng bài báo. Nếu như những đánh giá này đủ tốt thì sẽ gợi ý bài báo đó cho người dùng mục tiêu.
5.3.2.3. Cách tiếp cận Item-based
Việc train dữ liệu cho hệ thống gợi ý dựa trên sản phẩm này cũng tương tự như việc train dữ liệu sử dụng cho cách tiếp cận User-base vừa trình bày ở trên, tuy nhiên chúng ta sẽ cần thêm một đoạn dữ liệu là Id của những tag mà từng bài báo có:
Hình 5. 9: Bảng dữ liệu sau khi train dữ liệu (Item-based)
Việc đầu tiên chúng ta cần làm đối với hệ thống gợi ý dựa trên sản phẩm là tìm và lấy ra một số bài báo mà người dùng mục tiêu đã có đánh giá tốt nhất trước đây.
Sau khi đã lấy được danh sách những bài báo có đánh giá tốt nhất, thì chúng ta bắt đầu tìm những bài báo tương tự với từng bài báo đã tìm được sử dụng phương thức so sánh tương tự như như phương thức so sánh của User-base tuy nhiên thay vì dữ liệu truyền vào là bảng dữ liệu sau khi train dữ liệu thì chúng ta sẽ đảo chiều dữ liệu để danh sách người dùng và tag trở thành hàng và danh sách bài báo trở thành cột của mảng.
Sau đó thì chúng ta sẽ nhận được kết quả là danh sách các sản phẩm tương tự với những sản phẩm đã được người dùng đánh giá tốt để gợi ý cho người dùng.
Vì hệ thống gợi ý dựa trên sản phẩm này phải tìm hàng xóm cho nhiều sản phẩm khác nhau nên giải thuật sẽ chạy chậm hơn một chút so với thống gợi ý dựa trên người dùng.
Chương 5: Hiện thực dự án 85
5.3.2.4. Kết quả
Sau khi xây dựng và chạy thử nghiệm với tập dữ liệu mẫu với việc chia tỉ lệ train- test là 90-10 và chạy cả 2 model với việc lấy ra 30 gợi ý một lần ta được kết quả như sau:
Hình 5. 10: Kết quả gợi ý của 2 cách tiếp cận
Hình 5. 11: Kết quả đánh giá giải thuật
Như hình trên ta có thể thấy độ chính xác cũng như tốc độ của hệ thống gợi ý dựa trên người dùng cao hơn một chút so với hệ thống gợi ý dựa trên sản phẩm. Chính vì vậy mà nhóm thực hiện báo cáo đã áp dụng hệ thống gợi ý dựa trên người dùng vào đồ án.
5.3.3. Áp dụng hệ thống gợi ý vào đồ án 5.3.3.1. Dữ liệu đầu vào 5.3.3.1. Dữ liệu đầu vào
Để áp dụng hệ thống gợi ý vào đồ án chúng ta cần danh sách sản phẩm, người dùng, ProductTag, và các hành động của người dùng. Tuy nhiên các dữ liệu này được lưu trong cở sở dữ liệu. Vì vậy chúng ta chỉ cần lấy dữ liệu ra và tổng hợp lại để thuận tiện cho việc training cũng như gợi ý. Chúng ta sẽ sử dụng dữ liệu từ các bảng:
Chương 5: Hiện thực dự án 86 - Người dùng - Tag - Các sản phẩm đã xem - Danh sách yêu thích - Danh sách mua hàng - Phản hồi về sản phẩm
5.3.3.2. Xây dựng các phương thức để lấy gợi ý
Sau khi đã thực hiện các bước như mục 5.3.2.2, chúng ta chỉ cần xây dựng thêm phương thức để lấy ra danh sách sản phẩm từ danh sách mã sản phẩm trả ra từ hệ thống gợi ý. Và cuối cùng là hiển thị lên trang chủ của website đối với những người dùng đã đăng nhập vào hệ thống.
5.3.3.3. Kết quả
Hệ thống hiển thị một danh sách các sản phẩm gợi ý khác nhau đối với từng người dùng.
Hình 5. 12: Kết quả hệ thống gợi ý trên giao diện trang web
5.4. Tìm hiểu công nghệ ASP.NET SignalR và xây dựng chức năng trò truyện thời gian thực gian thực
5.4.1. Tìm hiểu công nghệ SignalR (xem mục 2.2)
5.4.2. Xây dựng chức năng trò chuyện thời gian thực
Đầu tiên nhóm xây dựng tính năng trò chuyện theo kiểu trung tâm trò chuyện nghĩa là tất cả người dùng sẽ cùng trò chuyện với nhau qua một trung tâm và tin nhắn sẽ được hiển thị cho tất cả người dùng khác trong hệ thống. Công việc được thực hiện qua các bước như sau:
Chương 5: Hiện thực dự án 87 - Tạo cơ sở dữ liệu.
- Thêm giao diện và xử lý các sự kiện phía người trò chuyện. - Tạo ra trung tâm xử lý trò chuyện cho hệ thống.
Tạo các phương thức để truy xuất và lưu dữ liệu vào cơ sở dữ liệu.
5.4.2.1. Tạo cơ sở dữ liệu
Tạo thêm một bảng có tên “Message” để lưu trữ các tin nhắn bao gồm các thuộc tính: Id, Text, UserId, When.
5.4.2.2. Tạo phần giao diện cho người dùng
Đầu tiên thêm thư viện “jquery.signalR.js”.
Thêm 1 tập tin JavaScript có tên “SignalrRepuestHandler.js” chịu trách nhiệm khởi tạo kết nối và bắt các sự kiện nhận tin nhắn và gửi tin nhắn của người dùng.
Tiếp tục tạo thêm một tập tin chứa các phương thức xử lý các sự kiện nhận tin nhắn và gửi có tên là “chat.js”.
Sau đó nhúng tất cả 3 tập tin này vào giao diện của chức năng trò chuyện.
Chương 5: Hiện thực dự án 88
5.4.2.3. Tạo trung tâm xử lý trò chuyện (ChatHub) cho hệ thống
Tạo một lớp có thêm “ChatHub” kế thừ từ lớp Hub từ thư viện AspNetCore.SignalR và tạo ra một phương thức chạy ở dạng bất đồng bộ có tên SendMessage với tham số truyền vào là dữ liêu của một tin nhắn. phương thức này sẽ khởi động sự kiện “recieveMessage” của những người dùng khác khi có một người dùng gửi 1 tin nhắn bất kì. Đây chính là yếu tố tạo nên việc trò chuyện trên thời gian thực của hệ thống.
5.4.2.4. Tạo phương thức để truy xuất và lưu trữ vào cơ sở dữ liệu
Sau đó chúng ta cần một số phương thức để có thể lưu trữ cũng như truy xuất các tin nhắn của người dùng từ cơ sở dữ liệu. để làm được điều này chũng ta sẽ sử dụng web API để thực hiện. việc sử dụng web API sẽ giúp việc trò chuyện của người dùng mượt mà hơn.
Sau bước này thì chúng ta đã có thể trò chuyện trực tiếp với các người dùng khác trên thời gian thực. Tuy nhiên việc trò chuyện này là theo kiểu trò chuyện theo nhóm vì thế không phù hợp với đồ án mà nhóm thực hiện báo cáo đang thực hiện là trò chuyện giữa người mua hàng và quản trị viên của cửa hàng. Vì thế chúng ta cần phải điều chỉnh lại hệ thống bằng cách:
- Thêm trường mã người nhận (ReceiverId) vào cơ sở dữ liệu.
- Xử lý việc chỉ thực hiện sự kiện “receiverMessage” đối với người dùng có cùng mã với trường “ReceiverId”. Chuyển đổi hệ thống trò chuyện thành người dùng với người dùng (Peer-to-peer).
5.4.3. Kết quả
Khi thực hiện cuộc hội thoại giữa khách hàng và quản trị viên thì các tin nhắn được hiển thị ngay lập tức.
Chương 5: Hiện thực dự án 89
Hình 5. 14: Kết quả xây dựng tính năng trò chuyện thời gian thực
5.5. Triển khai ứng dụng trong môi trường thực tế
Trong đồ án lần này người thực hiện báo cáo sử dụng trang web SmarterAsp.net, một trang web cung cấp dịch vụ hosting hỗ trợ asp.net, asp.net core và php tương đối uy tín và khi là thành viên mới sử dụng dịch vụ sẽ được sử dụng thử nghiệm trong vòng 60 ngày nhưng bị giới hạn chỉ có thể tạo 1 website và 1 cơ sở dữ liệu.
Sau khi đã tạo tài khoản thì website sẽ cho phép tạo ra một ứng dụng web. Chúng ta chỉ cần đặt tên và hệ thống sẽ tự tạo ra ứng dụng với tên miền mặc định vd:
atomstorevn-001-site1.etempurl.com
Tiếp theo chúng ta sẽ cần tạo một cơ sở dữ liệu, cơ sở dữ liệu được sử dụng trong đồ án là Microsoft SQL Server 2019. Chúng ta chỉ cần tạo ra cơ sở dữ liệu tương ứng trên trên trang quản lý website:
Chương 5: Hiện thực dự án 90
Hình 5. 15: Tạo cơ sở dữ liệu trên SmarterASP.NET
Sau khi tạo thành công thì chúng ta có thể tìm thấy Connection String ở ngay phía dưới trong trang này:
Hình 5. 16: Chuỗi kết nối (connection string) Sau khi đã có cơ sở dữ liệu chúng ta sẽ bắt đầu triển khai ứng dụng lên.
Trong giao diện của Visual studio, cửa số solution explorer, bấm chuột phải vào dự án webApp ở đây có tên là Atomstore và chọn publish