đề tài xây dựng hệ thống quản lý thông tin hoạt động của lớp học

Với các tiến bộ trong lĩnh vực nhận dạng, thị giác máytính, các thông tin phản hồi đó có thể được đánh giá một cách tự động thông qua dữliệu hình ảnh, video thu thập từ lớp học.. Trong đ

CƠ SỞ LÝ THUYẾT

Tổng quan về phân tích/nhận dạng tự động hoạt động của người học

Nhận dạng hoạt động của người là một lĩnh vực nghiên cứu trong khoa học máy tính nhằm xây dựng các phương pháp cho phép xác định kiểu hoạt động (ví dụ: đi bộ, chạy, ngã, bắt tay, v.v.) trên dữ liệu thu được từ các cảm biến khác nhau Hoạt động của con người được chia thành 4 mức độ cơ bản: cử chỉ (gesture), hành động (action), tương tác (interaction) và hoạt động nhóm (group activity) Cử chỉ là chuyển động cơ bản nhất của một phần cơ thể người và thường được xem là đơn vị để diễn đạt một chuyển động của người Ví dụ cử chỉ "kéo căng tay" Hành động có thể được tạo thành từ một tập các cử chỉ theo thời gian như hành động đi lại Tương tác là hoạt động liên quan đến 2 người trở lên hoặc liên quan giữa người và đối tượng ví dụ "hai người đang đánh nhau", "một người bỏ lại vali trong sân bay" Hoạt động của nhóm là hoạt động tạo ra bởi một nhóm gồm nhiều người và/hoặc nhiều đối tượng ví dụ “một nhóm người đang biểu tình”

Bài toán nhận dạng cử chỉ và hành động được phân chia theo yếu tố không gian và thời gian Theo cách phân chia này, các cử chỉ/hành động có thể chia làm hai loại:

• Hoạt động/cử chỉ tĩnh hay còn gọi là hình trạng là loại cử chỉ sử dụng ảnh đơn lẻ Do đó, các thông tin về cử chỉ và hành động chỉ có yếu tố không gian không có yếu tố thời gian

• Hoạt động/cử chỉ động: là các hoạt động/cử chỉ được thực hiện trong một khoảng thời gian Do đó, các cử chỉ hoạt động này được biểu diễn theo cả không gian và thời gian.

Dựa trên phân loại này, các phương pháp nhận dạng hoạt động có thể phân chia thành nhận dạng cử chỉ tĩnh (hình trạng) và nhận dạng cử chỉ động Ngoài cách phân chia này dựa trên các thông tin sử dụng trong các phương pháp nhận dạng cử chỉ, các phương pháp có thể phân chia thành nhận dạng dựa trên ảnh màu, ảnh độ sâu, khung xương hay phương pháp nhận dạng dựa trên đa phương thức.

1.1.2 Các hoạt động quan tâm trong khuôn khổ của đề tài

Theo các định nghĩa trong phần 1.1.1, đề tài hướng đến các cử chỉ và hành động của người học trong lớp học trong đó tập trung vào một số cử chỉ sau: ngồi học, giơ tay, sử dụng điện thoại, ngủ/gục xuống bàn, và đứng lên phát biểu Đây là các hoạt động quan trọng, việc nhận dạng và xác định được số lượng các hoạt động này trong một buổi học là một thông số quan trọng cho phép đánh giá định lượng chất lượng và không khí của lớp học Hình sau minh họa vùng chứa các hoạt động quan tâm được thu nhận trong một lớp học thực tế

(c) Hoạt động đứng lên phát biểu

(d) Hoạt động sử dụng điện thoại

(e) Hoạt động ngủ/gục xuống bàn

Hình 1-1 Các hoạt động được quan tâm trong đề tài

1.1.3 Một số nghiên cứu về nhận dạng hoạt động của người học trong lớp học

Nhận dạng tự động các hoạt động của sinh viên/người học trong lớp học đang thu hút được sự quan tâm của cộng đồng nghiên cứu trong các năm gần đây Một số hoạt động thường quan tâm trong lớp học bao gồm: giơ tay, đứng lên phát biểu, ngủ …

Liên quan đến nhận dạng hoạt động giơ tay, một số nghiên cứu đã được đề xuất để nhận dạng hoạt động giơ tay tuy nhiên đây vẫn là một bài toán thách thức do môi trường lớp học thường là môi trường không kiểm soát do có sự biến đổi về số lượng sinh viên/người học trong lớp, vị trí, sự che khuất và kích thước nhỏ của bàn tay và sự đa dạng trong việc thực hiện các hoạt động

Hình 1-2 Sự đa dạng trong hoạt động giơ tay

Các tác giả trong [CITATION WACV2002 \l 1033 ] đề xuất phương pháp phát hiện cử chỉ của tay thông qua phương pháp trừ nền để xác định chuyển động và thực hiện tính toán các đặc trưng để đưa ra quyết định về sự tồn tại của cử chỉ tay trong ảnh. Tuy nhiên, phương pháp trừ nền không hiệu quả trong điều kiện lớp học do sự thay đổi nhanh của nền

Trong [CITATION Nya11 \l 1033 ] các tác giả đề xuất phương pháp phát hiện hành động giơ tay trong điều kiện phòng họp và lớp học Phương pháp được đề xuất thực hiện phát hiện mặt trong từng khung hình để xác định vùng quan tâm (ROI) Sau đó phương pháp xác định vị trí của tay trong vùng quan tâm dựa trên việc phân tích tính chất hình học của các biên của tay Vị trí và hướng của tay so với mặt sẽ được sử dụng để xác định hành động giơ tay Ngoài ra để giảm lỗi phát hiện nhầm, hệ thống sử dụng tần suất của hoạt động giơ tay trong các khung hình trước đó

Phương pháp đề xuất trong [CITATION Che13 \l 1033 ] tự động xác định vùng ứng với học sinh dựa trên trừ nền Sau đó đặc trưng SIFT và bộ phân lớp SVM được sử dụng cho bài toán nhận dạng hoạt động giơ tay trong lớp học Các tác giả trong [CITATION Pon13 \l 1033 ], đề xuất ứng dụng các đặc trưng Lienhart-Maydt cho phát hiện mặt và tay trên ảnh Sau đó dựa trên quan hệ của mặt và tay, hoạt động giơ tay được nhận dạng

Nhóm nghiên cứu ở trường ĐH Khoa học tự nhiên – ĐH Quốc gia Thành phố HồChí Minh [CITATION alV15 \l 1033 ][ CITATION VVo12 \l 1033 ] đã đề xuất phương pháp phân đoạn và nhận dạng hoạt động trên video Từ chuỗi hình ảnh RGB, các tác giả đã đề xuất trích chọn đặc trưng toàn cục (HOG và HOF) và đặc trưng cục bộ dựa trên chuyển động và SURF Sau đó, các đặc trưng này được biểu diễn thành các từ (visual word) theo mô hình BOW (Bag of word) Với cách biểu diễn này một video sẽ được biểu diễn thành vector thể hiện sự xuất hiện của các từ trong video Cuối cùng mô hình học SVM được sử dụng để phân loại các hoạt động Phương pháp được các tác giả đề xuất đã cải tiến độ chính xác nhận dạng so với một số phương pháp được đề cập trước đó trên 2 cơ sở dữ liệu dùng chung là KTH và Weizmann

Trong [ CITATION TNg14 \l 1033 ], nhóm nghiên cứu ở Đại học Bách Khoa Đà Nẵng đề xuất giải thuật nhận dạng cử chỉ tay sử dụng các đặc trưng hình học và phương pháp phân lớp SVM Đầu tiên, vùng tương ứng với bàn tay sẽ được tách ra dựa trên phương pháp phân đoạn màu da Tiếp theo, các đặc trưng như số ngón tay, góc giữa các ngón được trích chọn và đưa vào bộ phân lớp SVM Mặc dù đạt được kết quả nhận dạng 89.5% trên bộ cơ sở dữ liệu gồm 27 cử chỉ tay tĩnh nhưng phương pháp đề xuất chỉ hoạt động hiệu quả trong các điều kiện tốt (nền đơn giản, tay được phân tách tốt)

Nhóm nghiên cứu tại Viện CNTT, Viện hàn lâm khoa học Việt Nam đã thực hiện so sánh hai bộ phân lớp là SVM và RVM (Relevance Vector Machines) cho bài toán nhận dạng cử chỉ sử dụng thông tin khung xương [ CITATION DNg15 \l 1033 ] Với mỗi khớp xương, các tác giả trích 3 thông tin bao gồm tốc độ tương đối, góc, và tốc độ của góc Các đặc trưng này được nối lại thành một vector đặc trưng đại diện cho mỗi cử chỉ Các tác giả đã chỉ ra rằng RVM cho kết quả nhận dạng gần tương đương với SVM trong khi thời gian tính toán giảm được đáng kể

Nhóm nghiên cứu tại Trường Đại học Bách Khoa Hà Nội đã đề xuất các phương pháp kết hợp đặc trưng cho bài toán nhận dạng hoạt động nói chung và nhận dạng hoạt động bất thường nói riêng Trong [ CITATION Tha18 \l 1033 ], nhóm đề xuất kết hợp cả thông tin từ cảm biến gia tốc, ảnh màu, ảnh độ sâu trong nhận dạng 20 hoạt động của người Liên quan đến nhận dạng hoạt động dựa trên khớp xương, dựa trên quan sát các khớp xương có thể đóng các vai trò khác nhau trong nhận dạng hoạt động, nhóm đã đề xuất phương pháp trích chọn khớp xương chứa nhiều thông tin nhất và trích chọn các đặc trưng ma trận hiệp phương sai từ tập khớp xương đã được lựa chọn phục vụ cho bài toán nhận dạng hoạt động [ CITATION Tie18 \l 1033 ] Trong [ CITATION Van19 \l 1033 ], nhóm cũng đề xuất khai thác thông tin về thời gian và không gian của hoạt động dựa trên việc kết hợp của mạng nơ ron tích chập CNN và mạng bộ nhớ ngắn dài (LSTM) trong biểu diễn và nhận dạng hoạt động

Giới thiệu về các công nghệ sử dụng trong đồ án

Mô hình Client Server là mô hình mạng máy tính trong đó các máy tính con được đóng vai trò như một máy khách, chúng làm nhiệm vụ gửi yêu cầu đến các máy chủ. Để máy chủ xử lý yêu cầu và trả kết quả về cho máy khách đó.

Hình 1-3 Mô hình Client – Server

Trong mô hình Client - Server, server chấp nhận tất cả các yêu cầu hợp lệ từ mọi nơi khác nhau trên Internet, sau đó trả kết quả về máy tính đã gửi yêu cầu đó

Máy tính được coi là máy khách khi chúng làm nhiệm vụ gửi yêu cầu đến các máy chủ và đợi câu trả lời được gửi về Để máy khách và máy chủ có thể giao tiếp được với nhau thì giữa chúng phải có một chuẩn nhất định, và chuẩn đó được gọi là giao thức Một số giao thức được sử dụng phổ biến hiện nay như: HTTPS, TCP/IP, FTP,

Nếu máy khách muốn truy xuất các thông tin từ máy chủ, chúng phải tuân theo một giao thức mà máy chủ đó đưa ra Nếu yêu cầu đó được chấp nhận thì máy chủ sẽ thu thập thông tin và trả về kết quả cho máy khách yêu cầu Bởi vì Server - máy chủ luôn luôn trong trạng thái sẵn sàng để nhận request từ client nên chỉ cần client gửi yêu cầu tín hiệu và chấp nhận yêu cầu đó thì server sẽ trả kết quả về phía client trong thời gian ngắn nhất. Ưu điểm của mô hình:

 Giúp chúng ta có thể làm việc trên bất kì một máy tính nào có hỗ trợ giao thức truyền thông Giao thức chuẩn này cũng giúp các nhà sản xuất tích hợp lên nhiều sản phẩm khác nhau mà không gặp phải khó khăn gì.

 Có thể có nhiều server cùng làm một dịch vụ, chúng có thể nằm trên nhiều máy tính hoặc một máy tính.

 Chỉ mang đặc điểm của phần mềm mà không hề liên quan đến phần cứng, ngoài yêu cầu duy nhất là server phải có cấu hình cao hơn các client.

 Hỗ trợ người dùng nhiều dịch vụ đa dạng và sự tiện dụng bởi khả năng truy cập từ xa.

 Cung cấp một nền tảng lý tưởng, cho phép cung cấp tích hợp các kỹ thuật hiện đại như mô hình thiết kế hướng đối tượng, hệ chuyên gia, hệ thông tin địa lý (GIS).

 Vấn đề bảo mật dữ liệu thông tin đôi khi còn chưa được an toàn do phải trao đổi dữ liệu giữa 2 máy tính khác nhau ở 2 khu vực địa lý cách xa nhau Và đây cũng nhược điểm duy nhất của mô hình này Tuy nhiên vấn đề này có một số giao thức đã hỗ trợ bảo mật dữ liệu khi truyền tải Giao thức được sử dụng phổ biến như HTTPS.

Từ mô hình Client – Server, giới lập trình viên hiện đại đã phân trang web ra làm hai phần để thuận tiện phát triển và quản lý: Front-end - Back-end

Phần front-end của một trang web là phần tương tác với người dùng Tất cả mọi thứ ta nhìn thấy khi điều hướng trên Internet, từ các font chữ, màu sắc cho tới các menu xổ xuống và các thanh trượt, là một sự kết hợp của HTML, CSS, và JavaScript được điều khiển bởi trình duyệt máy tính của ta. Đâu là những phần giúp phần front-end của một trang web có thể hoạt động được? Tất cả dữ liệu sẽ được lưu trữ ở đâu? Đó là phần việc của back end Phần back end của một trang web bao gồm một máy chủ, một ứng dụng, và một cơ sở dữ liệu. Một lập trình viên back-end xây dựng và duy trì công nghệ mà sức mạnh của những thành phần đó, cho phép phần giao diện người dùng của trang web có thể tồn tại được.

1.2.2 Javascript và Nodejs Back-end

JavaScript được tạo trong mười ngày bởi Brandan Eich, một nhân viên của Netscape, vào tháng 9 năm 1995 Được đặt tên đầu tiên là Mocha, tên của nó được đổi thành Mona rồi LiveScript trước khi thật sự trở thành JavaScript nổi tiếng như bây giờ. Phiên bản đầu tiên của ngôn ngữ này bị giới hạn độc quyền bởi Netscape và chỉ có các tính năng hạn chế, nhưng nó tiếp tục phát triển theo thời gian, nhờ một phần vào cộng đồng các lập trình viên đã liên tục làm việc với nó.

Trong năm 1996, JavaScript được chính thức đặt tên là ECMAScript. ECMAScript 2 phát hành năm 1998 và ECMAScript 3 tiếp tục ra mắt vào năm 1999.

Nó liên tục phát triển thành JavaScript ngày nay, giờ đã hoạt động trên khắp mọi trình duyệt và trên khắp các thiết bị từ di động đến máy tính bàn.

JavaScript liên tục phát triển kể từ đó, có lục đạt đến 92% website đang sử dụng JavaScript vào năm 2016 Chỉ trong 20 năm, nó từ một ngôn ngữ lập trình riêng trở thành công cụ quan trọng nhất trên bộ công cụ của các chuyên viên lập trình web Nếu ta đang dùng internet, vậy chắc chắn ta đã từng sử dụng JavaScript rồi.

JavaScript có rất nhiều ưu điểm khiến nó vượt trội hơn so với các ngôn ngữ lập trình khác, đặc biệt trong các trường hợp thực tế Sau đây chỉ là một số lợi ích củaJavaScript:

 Người dùng không cần một compiler vì web browser có thể hiểu và biên dịch JavaScript

 Đây là ngôn ngữ dễ học hơn các ngôn ngữ lập trình khác

 Lỗi dễ phát hiện hơn và vì vậy dễ sửa hơn

 JS hoạt động trên nhiều trình duyệt, nền tảng,

 Ta có thể sử dụng JavaScript để kiểm tra input và giảm thiểu việc kiểm tra thủ công khi truy xuất qua cơ sở dữ liệu.

 JS giúp website tương tác tốt hơn với khách truy cập

 Ngoài ra ngôn ngữ này còn nhanh hơn và nhẹ hơn các ngôn ngữ lập trình khác.

NodeJS là một nền tảng được xây dựng trên “V8 Javascript engine” được viết bằng C++ và Javascript Nền tảng này được phát triển bởi Ryan Lienhart Dahl vào năm 2009 Node.js ra đời khi các developer đời đầu của JavaScript mở rộng nó từ một thứ ta chỉ chạy được trên trình duyệt thành một thứ ta có thể chạy trên máy của mình dưới dạng ứng dụng độc lập Giờ đây ta có thể làm được nhiều thứ với JavaScript hơn là chỉ tương tác với các website.

Kết luận

Như vậy trong chương này em đã giới thiệu tổng quan chung về bài toán nhận dạng hoạt động trong lớp học cũng như các cách tiếp cận đang được sử dụng, vai trò của hệ thống quản lý thông tin từ các hệ thống nhận dạng và các thông tin cơ bản về các công nghệ sẽ được sử dụng trong đồ án Trong phần sau em sẽ trình bày các bước được tiến hành để xây dựng một hệ thống quản lý thông tin về hoạt động của lớp học.

PHÂN TÍCH THIẾT KẾ HỆ THỐNG

Yêu cầu bài toán

Như em trình bày trong mục Mở đầu, đề tài của em có mục tiêu là Xây dựng hệ thống quản lý thông tin hoạt động của lớp học nhằm lưu trữ và quản lý các thông tin liên quan đến lớp học, camera gắn tại lớp học, quản lý kết quả nhận dạng để thực hiện truy xuất, báo cáo lại khi cần thiết Các nội dung liên quan đến các kỹ thuật nhận dạng, phát triển mô đung nhận dạng hoạt động từ hình ảnh thu thập từ các camera được thực hiện bởi thành viên khác trong nhóm thực hiện đề tài

2.1.1 Yêu cầu về chức năng

Về mặt chức năng, hệ thống được xây dựng cần đảm bảo các chức năng sau :

 Thu thập hình ảnh của lớp học từ cameras gắn tại các lớp học và gửi về hệ thống.

 Tự động kết nối/tích hợp với mô đun phân tích nhận dạng các hoạt động quan tâm từ hình ảnh thu thập được và lưu trữ kết quả phân tích.

 Hệ thống có khả năng quản lý các thông tin về người dùng, phân quyền người dùng

 Quản lý thông tin về lớp học và hệ thống camera gắn tại các lớp học.

 Hiển thị hình ảnh và kết quả nhận dạng, thống kê và xuất báo cáo.

2.1.2 Yêu cầu phi chức năng

 Phân tích/nhận dạng các hành động chính xác.

 Dữ liệu được lưu trữ toàn vẹn.

 Các thao tác với website và cơ sở dữ liệu nhanh và bảo mật.

 Đảm bảo tính ổn định của hệ thống.

Phân tích thiết kế

Sơ đồ khối của hệ thống được thể hiện ở Hình 2-1 Trong đó hình ảnh camera từ lớp học sẽ được thu thập và phân tích thông qua mô đun Phân tích nhận dạng được phát triển ở [ CITATION Thu21 \l 1033 ] Các kết quả nhận dạng sẽ được gửi đến mô đun quản lý để đưa kết quả vào trong cơ sở dữ liệu Các chức năng và giao diện chương trình được phát triển trên client cho phép người dùng thực hiện kết nối cơ sở dữ liệu và thực thi các tác vụ

Hình 2-10 Sơ đồ khối chung của hệ thống, trong đó các khối bôi đậm là nội dung được thực hiện trong đồ án.

2.2.2 Biểu đồ phân rã chức năng

Trong Hình 2.2, các chức năng của hệ thống được thể hiện bao gồm 5 tính năng chính.

 Phân tích nhận dạng: Module nhận dạng đã được triển khai ở [ CITATION Thu21 \l 1033 ].

 Quản lý tài khoản: Tính quản lý toàn bộ quyền truy cập và tài khoản của hệ thống.

 Quản lý dữ liệu: Quản lý toàn bộ dữ liệu lưu trữ với các thao tác thêm, sửa, xoá.

 Phân tích/ Thống kê: Tính năng thống kê với tiện ích vẽ biểu đồ thống kê.

 Xem trực tiếp luồng video: Cho phép người dùng xem trực tiếp từ các camera được kết nối trong hệ thống.

Hình 2-11 Biểu đồ phân rã chức năng của hệ thống

 Đối tượng sử dụng (actor) bao gồm: Admin, Người dùng và Hệ thống nhận diện ( moudule Phân tích nhận dạng )

- Phân tích nhận dạng: Ở bước này module Phân tích nhận dạng sẽ lấy dữ liệu từ các camera, phân tích dữ liệu và gửi kết quả về hệ thống.

- Quản lý dữ liệu, Quản lý tài khoản: Chỉ admin mới có quyền quản lý,chỉnh sửa các dữ liệu của hệ thống.

- Đối với các use case thống kê và vẽ biểu đồ thì toàn bộ user có thể truy xuất.

Hình 2-12 Sơ đồ đặc tả use case của hệ thống

2.2.4 Sơ đồ luồng hoạt động

Hình 2-13 Sơ đồ luồng hoạt động

Xây dựng cơ sở dữ liệu

2.3.1 Mô hình thực thể liên kết Để quản lý các thông tin đặt ra trong ứng dụng, mô hình thực thể liên kết được xây dựng và minh họa trong Hình 2.5 Trong đó các thực thể là Action, Image, Camera, Room, Account Mối quan hệ giữa Action và Image là các kết quả từ module Phân tích nhận dạng, quan hệ N – N, vì vậy cần thêm một bảng Action-Image để lưu thêm các thông tin về kết quả như id, số lượng kết quả hay thời gian phân tích,…Mỗi Image chỉ thuộc một Camera, vì vậy quan hệ là 1 – N Tương tự mỗi Camera chỉ thuộc một Room, quan hệ 1 - N Riêng thực thể Account không có quan hệ với các thực thể khác.

Hình 2-14 Mô hình thực thể liên kết

Từ mô hình thực thể liên kết Hình 2.5, ta chuyển đổi sang mô hình quan hệ trong CSDL ở Hình 2.6.

Hình 2-15 Mô hình quan hệ

Bảng 2-1 Từ điển dữ liệu cho cơ sở dữ liệu

Bảng Tên dữ liệu Ý nghĩa dữ liệu

Kiểu Giá trị mẫu account id Mã tài khoản

Int 1 username Tên đăng nhập

Varchar admin1 password Mật khẩu Varchar 123abc@@@ fullname Tên người dùng

Varchar Nguyễn Tiến Đạt role Quyền truy cập

Int 0 ( admin) description Mô tả Varchar Tài khoản admin room id Mã phòng học

Int 1 name Tên phòng học

Varchar Phòng 301 address Địa chỉ phòng học

Varchar D3 - Trường đại học Bách

Khoa Hà Nội description Mô tả Varchar Phòng dành cho các lớp học đại cương camera id Mã camera Int 1 name Tên camera Int Camera số 3 ipAddress Địa chỉ IP Varchar 192.168.1.100 spec Thông tin cấu hình

Varchar Độ phân giải 400x680 status Trạng thái Tinyint 0 ( OFF) description Mô tả Varchar Camera quản lý phòng học roomId Mã phòng học lắp đặt

Int 1 camera image id Mã hình ảnh

Int 1 timestamp Thời gian chụp ảnh

Date 2022-01-01 12:00:00 resultURL Địa chỉ lưu kết quả phân tích/ nhận dạng

Varchar C:/Users/Admin/result.json imageURL Địa chỉ lưu hình ảnh

Varchar C:/Users/Admin/ image.png cameraId Mã camera chụp ảnh

Int 1 action id Mã hành động

Int 1 name Tên hành động

Varchar Sử dụng điện thoại recognition

_ result id Mã kết quả Int 1 timestamp Thời gian ghi nhận

Date 2022-01-01 12:00:00 resultCount Số lượng hành động ghi nhận

Int 5 description Mô tả Varchar Nhận dạng cơ bản actionID Mã hành động

Int 1 imageID Mã hình ảnh

Xây dựng phần server

2.4.1 Công nghệ sử dụng và mô hình triển khai

Như đã phân tích trong phần cơ sở lý thuyết, nodejs là một framework lý tưởng để xây dựng backend Vì vậy, trong khuôn khổ của đồ án tốt nghiệp, em sử dụng các công nghệ sau:

 JWT (Công nghệ mã hoá token)

 RTSP (Công nghệ stream video)

Phía server sẽ được triển khai mô hình MVC với các ưu điểm chính :

 Tiết kiệm băng thông: Vì không sử dụng viewstate nên MVC rất nhẹ và tiết kiệm được diện tích của băng thông Khi cần tương tác gửi và nhận dữ liệu liên tục, người dùng có thể sử dụng các ứng dụng trên web Điều này giúp website có thể hoạt động ổn định và tốt hơn.

 Dễ dàng kiểm tra: Nhờ có MVC, ta sẽ dễ dàng hơn trong việc kiểm tra, rà soát lỗi, đảm bảo được chất lượng và độ uy tín cho phần mềm trước khi tới tay người dùng.

 Điều khiển: Sử dụng mô hình MVC sẽ giúp điều khiển được nền tảng các ngôn ngữ lập trình hiện đại như HTML, CSS, Javascript, với nhiều hình thức khác nhau.

 Chức năng Separation of Concern: Cho phép phân tách một cách rõ ràng các thành phần model, data, giao diện hay nghiệp vụ.

 Tính kết hợp: Có thể thoải mái viết code trên nền tảng web khi tích hợp ở mô hình MVC để giảm tải dữ liệu server.

 Tính đơn giản: Kết cấu của mô hình MVC tương đối đơn giản và dễ dàng sử dụng ngay cả khi không có chuyên môn.

Một trong những yêu cầu của hệ thống là phải hiển thị được hình ảnh thu nhận từ camera gắn trong lớp học

2.4.2 Triển khai stream luồng video Để stream video, ta lấy luồng rtsp đã được cung cấp từ các camera Địa chỉ rtsp được lưu trong bảng camera (streamLink) Package rtsp-ffmpeg[ CITATION ags \l

1033 ] hỗ trợ việc đọc và chuyển luồng rtsp thành các base64 image với tốc độ khung hình gốc. rtsp = require('rtsp-ffmpeg') var uri = 'rtsp://example:example/, stream = new rtsp.FFMpeg({input: uri}); var pipeStream = function(data) {

// data là phầ( n dữ liệu hình a ,nh dưới dạng ByteArray

} stream.on('data', pipeStream); // dữ liệu sẽ được chuyể, n đổ, i và gư, i liển tục với hàm stream.on

Sau khi chuyển đổi luồng rtsp dưới dạng các base64 image, em sử dụng

Socket.io để gửi dữ liệu realtime tới các client: io = require('socket.io')(server) io.on('connection', function(socket) { var pipeStream = function(data) { socket.emit('data', data.toString('base64'));

// chuyể, n đổ, i sang dạng base64 string

}; stream.on('data', pipeStream); socket.on('disconnect', function() { stream.removeListener('data', pipeStream);

2.4.3 Triển khai phần quản lý dữ liệu

Các api được viết dưới quy chuẩn Restfull api Bao gồm GET, POST, PUT, DELETE thực hiện các thao tác hiển thị, thêm, sửa, xoá Phần triển khai phân quyền và kiểm tra token được thực hiện bởi các middleware đảm bảo tính bảo mật.

2.4.4 Triển khai tính năng thống kê, vẽ biểu đồ

Dữ liệu cung cấp cho tính năng thống kê được truy xuất theo phòng học và thời gian Vì vậy có 3 thông số cần cung cấp cho api: roomId, timeFrom, timeTo Khi user nhập 3 thông số này ở trên UI, hệ thống sẽ truy xuất toàn bộ các hình ảnh được chụp trong phòng theo roomId Từ đó lấy được toàn bộ thông tin về các kết quả phân tích trong khoản thời gian timeFrom – timeTo và gửi lại về response của api để client xử lý việc hiển thị.

2.4.4.2 Tính năng vẽ biểu đồ

Phần vẽ biểu đồ sử dụng một API khác và cũng nhận vào các thông số tương tự như phần thống kê Tuy nhiên thay vì trả về toàn bộ các record, hệ thống sẽ trả về một object bao gồm tên các hành động và số lượng hành động xảy ra.

2.4.5 Tích hợp kết quả nhận dạng

Như đã mô tả ở trên, các phương thức và thao tác nhận dạng sẽ được coi như một module bên ngoài (module nhận dạng) Vì vậy em cần thực hiện kế nối hệ thống với module này Module nhận dạng được triển khai bằng ngôn ngữ Python và output là file json, vì vậy em cần viết một đoạn script bổ sung vào module để đọc dữ liệu từ file json và nhập dữ liệu vào CSDL MySQL.

{ info: { // thổng tin year: "2021", version: "1.0", description: "inside class room", contributor: "Mica", url: "mica.edu.vn:8007/iclassrom/dataset", date_created: "2021-01-19T09:48:27",

}, licenses: { id: 1, url: 'mica.edu.vn:8007/iclassrom/dataset', name: 'Attribution-NonCommercial-ShareAlike License'

// danh sách các hình a ,nh được phần tích, dựa vào tển cu ,a hình a ,nh có thể, // xác định được thời gian chụp a ,nh images: [

{ id: 0, file_name: "ch01_20210402084038_0001.jpg", width: 1920, height: 1080, license: 1,

{ id: 1, file_name: "ch01_20210402084038_0002.jpg", width: 1920, height: 1080, license: 1,

// các hành động quan tầm categories: [

// các kểV t qua , nhận dạng, annotations: [

{ id: 0, image_id: 0, category_id: 1, pid: 3, bbox: [ 485, 624,

{ id: 1, image_id: 0, category_id: 1, pid: 4, bbox: [ 485, 624,

Hình 2-16 Hình ch01_20210402084038_0002.jpg và kết quả phân tích trên ảnh

2.4.5.2 Cấu trúc script đọc và nhập dữ liệu vào MySQL

Từ file json, em thực hiện trích xuất các thông tin để đưa vào các bảng như sau:

 Images: Từ images.file_name, ta lấy được timeStamp Từ info.url và images.file_name ta lấy được imageURL và resultURL.

 Action: Từ categories ta lấy được các action name.

 Recognition_result: từ annotations ta lấy được imageId, actionId, resultCount và description.

Sau khi lấy thông tin, cần kết nối và thực hiện các truy vấn INSERT vào cơ sở dữ liệu Với Python, em dùng mysql-connector-python để kết nối với MySQL.

Khởi tạo kết nối: import mysql.connector mydb = mysql.connector.connect( host="localhost", user="yourusername", password="yourpassword"

Thực hiện insert dữ liệu vào trong bảng action như sau: mycursor = mydb.cursor() sql = "INSERT INTO action (name) VALUES (%s)" val = (json.categories[0]) // json là tển object đã convert từ // file json mycursor.execute(sql, val) mydb.commit() print(mycursor.rowcount, "record inserted.")

Với các bảng khác em thực hiện tương tự.

Xây dựng phần client

Reactjs là framework được lựa chọn để xây dựng client Các công nghệ sử dụng được liệt kê bao gồm:

 React – redux ( library quản lý global state)

 Material UI ( library cung cấp các UI có sẵn tới từ Google )

2.5.2 Nhận dữ liệu từ socket và stream video Ở phần client, em sử dụng socket.io-client[ CITATION htt1 \l 1033 ] để nhận dữ liệu realtime từ server và hiển thị Thẻ html được chọn để hiển thị là thẻ img (vì dữ liệu được chuyển qua socket là dạng base64 image). var img = document.getElementById('img'), socket = io(''); socket.on('data', function(data) { // nhận event từ socket và set vào the , image img.src = 'data:image/jpeg;base64,' + data;

2.5.3 Hiển thị kết quả thống kê và vẽ biểu đồ

Sau khi người dùng nhập các thông tin cần thiết, client sẽ gọi API và nhận các dữ liệu cần thiết Các kết quả nhận về sẽ được hiển thị dưới dạng bảng biểu và có thể export ra file excel Để vẽ biểu đồ, em sử dụng Re-charts[ CITATION htt2 \l 1033 ], một package có sẵn UI của rất nhiều loại biểu đồ Biểu đồ được lựa chọn trong đồ án là biểu đồ hình cột.

Hình 2-17 Biểu đồ thống kê hình cột về các hoạt động nhận dạng được trong lớp học

THỰC NGHIỆM HỆ THỐNG QUẢN LÝ

Cách thức thực nghiệm

Hệ thống được cài đặt và triển khai tại địa chỉ: http://mica.edu.vn:8008/ Để đánh giá hoạt động của hệ thống em thực hiện xây dựng kịch bản thử nghiệm các chức năng sau:

3.1.1 Thực nghiệm tính năng đăng nhập, tạo tài khoản

Tính năng đăng nhập sẽ phải vượt qua các testcase:

 Đăng nhập thành công với tên đăng nhập và mật khẩu đúng (Pass)

 Đăng nhập thất bại với tên đăng nhập hoặc mật khẩu sau (Pass)

 Tự động đăng xuất sau một khoảng thời gian dài không thao tác (Pass)

 Khởi tạo tài khoản thành công (Pass)

 Không có lỗi SQL Injection[ CITATION htt3 \l 1033 ] (Pass)

 Đảm bảo các thông tin bảo mật (password, token) phải được mã hoá. (Pass)

 Đảm bảo việc phân quyền (chỉ quyền admin mới có các tính năng quản lý) (Pass)

3.1.2 Thực nghiệm tính năng thống kê

 Đảm bảo dữ liệu thống kê chính xác (Pass)

 Thời gian phản hồi nhanh (Not Pass – Hệ thống đáp ứng tốt nhưng thời gian phản hồi khá chậm, cần cải thiện thêm)

3.1.3 Thực nghiệm tính năng trực tiếp video

 Luồng video phải tới từ đúng camera đã chọn (Pass)

 Không giật lag, vỡ khung hình (Pass)

3.1.4 Thực nghiệm tính năng quản lý dữ liệu

Tính năng quản lý dữ liệu sẽ phải vượt qua các testcase:

 Đảm bảo việc thêm sửa xoá thành công, không có sai sót, trùng lặp dữ liệu (Pass)

 Tính năng xuất file, nhập từ file excel ổn định, không lỗi font chữ (Pass)

3.1.5 Thực nghiệm kết nối với module Phân tích, nhận dạng

Do module Phân tích nhận dạng được coi như một module bên ngoài nên việc nhận kết quả được thực hiện thông qua file json và script viết sẵn ở 2.5.4.

 Đảm bảo việc đọc file json và nhập dữ liệu vào database chính xác và không trùng lặp (Pass)

Giao diện

Một số hình ảnh giao diện chương trình được thể hiện ở các hình bên dưới. Người dùng cần phải đăng nhập vào hệ thống với vai trò là người dùng hoặc quản trị hệ thống

Hình 3-18 Giao diện đăng nhập

Sau khi đăng nhập, người dùng có thể lựa chọn các chức năng phía bên trái của màn hình gồm: thống kê, xem luồng trực tiếp, quản lý Để xem luồng hình ảnh trực tiếp từ các video, người dùng cần lựa chọn camera từ danh sách các camera mà hệ thống quản lý Hình 3.2 biểu diễn giao diện luồng video trực tiếp.

Hình 3-19 Giao diện trang chủ

Hình 3-20 Giao diện đổi mật khẩu

Người dùng có thể tự thay đổi mật khẩu bằng cách chọn icon góc phải màn hình

Hình 3-21 Giao diện kết nối và xem trực tiếp luồng hình ảnh thu thập từ camera giám sát lớp học

Chức năng thống kê cho phép người dùng thống kê lại các hoạt động quan tâm đã được nhận dạng từ mô đun phân tích và lưu trữ trong hệ thống Trong chức năng ngày người dùng sẽ lựa chọn phòng học, và khoảng thời gian quan tâm Hệ thống thực hiện thống kê và đưa ra các biểu đồ thể hiện tần xuất xuất hiện của các hoạt động này. Người dùng cũng có thể lựa chọn chức năng xuất ra file excel các kết quả thống kê

Hình 3-22 Chức năng thống kê

Hình 3-23 Chức năng vẽ biểu đồ thống kê về các hoạt động nhận dạng được trong lớp học trong một khoảng thời gian do người dùng lựa chọn

Chức năng quản lý chỉ xuất hiện và cho phép truy cập khi tài khoản đăng nhập có quyền là Người quản trị (admin).

Việc xem danh sách cách dữ liệu được hiển thị dưới dạng bảng, admin có thể tuỳ chọn sắp xếp (khi click vào tên của cột ) hoặc tìm kiếm (filter ), phân loại theo từng trường Danh sách hiển thị cũng có các chế độ hiển thị to và nhỏ tăng khả năng tuỳ biến cho người dùng.

Các chức năng quản lý cho phép admin thực hiện thêm, sửa, xoá dữ liệu của Phòng học, Camera và Hành động Ngoài ra cũng có thể xuất file excel cũng như nhập dữ liệu từ file excel.

Hình 3-24 Quản lý phòng học

Hình 3-25 Thêm mới phòng học

Hình 3-26 Chỉnh sửa phòng học

Hình 3-28 Quản lý hoạt động Đối với chức năng quản lý tài khoản, ngoài việc chỉnh sửa các thông tin liên quan, admin chỉ có thể đặt lại mật khẩu của user thay vì thay đổi trực tiếp mật khẩu – Hình 3.11 Điều này đảm bảo tính bảo mật cho hệ thống cũng như chính user.

Hình 3-29 Quản lý tài khoản

Hình 3-30 Chỉnh sửa thông tin tài khoản

Source code

Toàn bộ source code được lưu tại: https://github.com/datgooner/eclass