NGHIÊN CỨU WEBAPI, ANGULARJS VÀ ỨNG DỤNG XÂY DỰNG WEBSITE QUẢN LÝ NHÀ Ở SINH VIÊN TRƯỜNG ĐẠI HỌC QUẢNG NAM - Full 10 điểm

UBND TỈNH QUẢNG NAM
TRƯỜNG ĐẠI HỌC QUẢNG NAM
KHOA CÔNG NGHỆ THƠNG TIN
----------

KHỐ LUẬN TỐT NGHIỆP ĐẠI HỌC

Tên đề tài:

NGHIÊN CỨU WEBAPI, ANGULARJS
VÀ ỨNG DỤNG XÂY DỰNG WEBSITE
QUẢN LÝ NHÀ Ở SINH VIÊN
TRƯỜNG ĐẠI HỌC QUẢNG NAM

Sinh viên thực hiện: Ngô Thanh Mẫn
MSSV: 2113011023
Chun ngành: CƠNG NGHỆ THƠNG TIN
Khóa: 2013 - 2017
Giảng viên hướng dẫn: ThS. ĐỖ QUANG KHÔI

Quảng Nam, tháng 4 năm 2017


LỜI CẢM ƠN
Lời đầu tiên cho em gửi lời cảm ơn sâu sắc đến ThS. Đỗ Quang Khôi,
người đã trực tiếp hướng dẫn, giúp đỡ, định hướng và đóng góp ý kiến cho em
trong suốt thời gian làm bài để em có thể hồn thành Khóa luận tốt nghiệp này.
Em xin chân thành cảm ơn tất cả thầy, cô giáo trường Đại học Quảng
Nam, đặc biệt là các thầy, cô trong Khoa Cơng nghệ thơng tin của trường đã tận
tình dạy dỗ và truyền đạt kiến thức cho em trong suốt quá trình học tập và nghiên
cứu tại trường, tạo điều kiện thuận lợi cho em trong thời gian cuối khóa để hồn

thành chương trình tốt nghiệp.
Em cũng gửi lời cảm ơn đến Trung tâm học liệu và Công nghệ thông tin –
Trường Đại học Quảng Nam đã tạo môi trường, điều kiện giúp đỡ cho em trong
suốt quá trình thực tập tốt nghiệp và những kinh nghiệm trong thực tế.
Đồng thời, em cũng gởi lời cảm ơn đến gia đình, bạn bè đã động viên, giúp
đỡ em lúc khó khăn trong học tập và trong cuộc sống.

-i-


MỤC LỤC

DANH MỤC BẢNG ............................................................................................. iv 
DANH MỤC HÌNH VẼ ......................................................................................... v 
Phần 1. MỞ ĐẦU ................................................................................................... 1 
1.1. Lý do chọn đề tài ....................................................................................... 1 
1.2. Mục tiêu của đề tài ..................................................................................... 1 
1.3. Đối tượng và phạm vi nghiên cứu ............................................................. 2 
1.4. Phương pháp nghiên cứu ........................................................................... 2 
1.5. Lịch sử nghiên cứu .................................................................................... 2 
1.6. Đóng góp của đề tài ................................................................................... 2 
1.7. Cấu trúc của khóa luận .............................................................................. 2 
Phần 2. NỘI DUNG NGHIÊN CỨU .................................................................... 4 
Chương 1: TỔNG QUAN VỀ ANGULARJS VÀ WEB API ......................... 4 
1.1. Tổng quan về AngularJS ........................................................................... 4 
1.1.1. Lịch sử của AngularJS ........................................................................ 4 
1.1.2. Khái niệm AngularJs ........................................................................... 4 
1.1.3. Các tính năng chung của AngularJS ................................................... 5 
1.1.4. Các tính năng cốt lõi của AngularJS .................................................. 5 
1.1.5. Ưu điểm và nhược điểm của AngularJS .............................................. 7 

1.1.6. Các thành phần của AngularJS ........................................................... 7 
1.2. Tổng quan về Web API ............................................................................. 8 
1.2.1. Giới thiệu API và Web API ................................................................ 8 
1.2.2. Những lợi ích khi sử dụng ASP.NET Web API ................................ 10 
1.2.3. Một số đặc điểm nổi trội của ASP.NET Web API ............................. 11 
1.2.4. Kết luận chương 1 ............................................................................. 13 
Chương 2: PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG ................................ 14 
2.1. Khảo sát hệ thống .................................................................................... 14 
2.1.1. Phát biểu bài toán ............................................................................. 14 
2.1.2. Khảo sát hiện trạng thực tế ............................................................... 15 
2.1.3. Yêu cầu chức năng của bài toán ....................................................... 24 
2.1.4. Yêu cầu phi chức năng của bài toán ................................................. 24 
- ii -


2.2. Mơ hình hóa u cầu hệ thống................................................................. 25 
2.2.1. Xác định các tác nhân ....................................................................... 25 
2.2.2. Xác định các Use Case ...................................................................... 25 
2.2.3. Biểu đồ ca sử dụng tổng thể của hệ thống ........................................ 25 
2.2.4. Đặc tả yêu cầu ................................................................................... 26 
2.3. Mơ hình hóa cấu trúc hệ thống ................................................................ 34 
2.3.1. Xác định các lớp thực thể .................................................................. 34 
2.3.2. Xác định các lớp biên ........................................................................ 35 
2.3.3. Xác định các lớp điều khiển .............................................................. 37 
2.3.4. Biểu đồ lớp ........................................................................................ 38 
2.4. Mơ hình hóa hành vi của hệ thống .......................................................... 38 
2.4.1. Biểu đồ hoạt động.............................................................................. 38 
2.4.2. Biểu đồ tuần tự .................................................................................. 43 
2.5. Thiết kế hệ thống ..................................................................................... 46 
2.5.1. Thiết kế kiến trúc vật lý hệ thống ...................................................... 46 

2.5.2. Thiết kế chi tiết cơ sở dữ liệu ............................................................ 47 
2.5.3. Thiết kế giao diện .............................................................................. 51 
2.6. Kết luận chương 2 .................................................................................... 54 
Chương 3: CHƯƠNG TRÌNH THỬ NGHIỆM ............................................ 55 
3.1. Cài đặt hệ thống ....................................................................................... 55 
3.2. Một số giao diện chính của chương trình ................................................ 55 
3.3. Kết luận chương 3 .................................................................................... 59 
Phần 3. KẾT LUẬN ............................................................................................. 60 
Phần 4. TÀI LIỆU THAM KHẢO ..................................................................... 61 

- iii -


DANH MỤC BẢNG

Bảng 2.1: Danh mục quy trình xử lý nghiệp vụ Quản lý khu nội trú .................... 17 
Bảng 2.2: Quy trình đăng ký ở nội trú (QT/07/TTHTSV) .................................... 17 
Bảng 2.3: Quy trình tổ chức quản lý khu nội trú (QT/08/TTHTSV) .................... 20 
Bảng 2.4: Quy trình thu, thanh quyết tốn phí điện nước (QT/17/TTHTSV) ...... 21 
Bảng 2.5: Quy trình quản lý sinh viên Lào (QT/21/TTHTSV) ............................. 22 

- iv -


DANH MỤC HÌNH VẼ

Hình 2.1: Cơ cấu tổ chức của Trung tâm hỗ trợ sinh viên .................................... 15 
Hình 2.2: Sơ đồ các use case của hệ thống ............................................................ 25 
Hình 2.3: Sơ đồ lớp ................................................................................................ 38 
Hình 2.4: Biểu đồ hoạt động cho phương thức đăng nhập .................................... 39 

Hình 2.5: Biểu đồ hoạt động cho phương thức đăng ký........................................ 40 
Hình 2.6: Biểu đồ hoạt động cho phương thức chuyển sinh viên ......................... 41 
Hình 2.7: Biểu đồ hoạt động của phương thức tính tiền điện nước ...................... 42 
Hình 2.8: Kiến trúc của hệ thống ........................................................................... 46 
Hình 3.1: Giao diện trang chủ của website............................................................ 55 
Hình 3.2: Giao diện trang giới thiệu (1) của website ............................................ 56 
Hình 3.3: Giao diện trang giới thiệu (2) của website ............................................ 56 
Hình 3.4: Giao diện đăng nhập cho ban quản lý ................................................... 57 
Hình 3.5: Giao diện trang admin cho ban quản lý ................................................. 57 
Hình 3.6: Giao diện thống kê phịng...................................................................... 58 
Hình 3.7: Giao diện danh sách sinh viên ............................................................... 58 
Hình 3.8: Giao diện thêm nhân viên mới .............................................................. 59 

-v-


Phần 1. MỞ ĐẦU
1.1. Lý do chọn đề tài
Ngày nay ứng dụng công nghệ thông tin và việc tin học hóa được xem là
một trong những yếu tố mang tính quyết định trong hoạt động của các tổ chức,
củng như của các hệ thống quản lý, nó đóng vai trị hết sức quan trọng, tạo ra
những bước đột phá một cách mạnh mẽ.
Trong phát triển ứng dụng web hiện nay, các Framework thi nhau ra đời và
trở nên phổ biến hơn, cùng với đó là các yêu cầu xử lý được nhanh hơn, tốc độ và
mạnh mẽ. AngularJS là được biết đến là một Framwork phát triển dựa trên
Javascript để tạo các ứng dụng web phong phú, nó dùng để phát triển frontend
(giao diện khách hàng) thông qua các API để gọi data, sử dụng mơ hình MVC rất
mạnh mẽ. Angular là mã nguồn mở, hồn tồn miễn phí và được phát triển bởi
hàng ngàn các lập trình viên trên thế giới.
Trong khi đó ASP.NET Web API, một nền tảng đầy hiệu quả mà rất đơn

giản với giao thức HTTP và dịch vụ web theo mặc định sử dụng JSON. Các
model làm việc để xử lý và trả về được đóng gói qua các đối tượng đơn giản,
giúp xây dựng Rest full services trên nền tảng .net, nó tự động trả dữ liệu có kiều
phù hợp: Json, XML. Web API sẽ giúp bạn chuyển kiểu dữ liệu trả về theo thuộc
tính Accept trong header của Request và bạn khơng cần quan tâm đến điều đó.
KTX của nhà trường hiện đang quản lý theo cách truyền thống. Việc đăng
ký và quản lý thủ cơng gây nên nhiều khó khăn, tốn thời gian và gây lãng phí cả
về cơng sức và tiền bạc.
Chính vì những lí do trên nên em đã chọn đề tài “Nghiên cứu Web API,
AngularJs và ứng dụng xây dựng website quản lý nhà ở sinh viên trường Đại
học Quảng Nam” làm khóa luận tốt nghiệp.
1.2. Mục tiêu của đề tài
- Nắm vững những kiến thức cơ bản về AngularJS và Web API

-1-


- Áp dụng vào việc Xây dựng hệ thống quản lý nhà ở sinh viên trường Đại
học Quảng Nam
1.3. Đối tượng và phạm vi nghiên cứu
- Kiến thức về AngularJS và Web API.
- Ứng dụng AngularJS và Web API vào xây dựng 1 hệ thống.
1.4. Phương pháp nghiên cứu
- Đọc tài liệu
- Phân tích, tổng hợp tài liệu.
- Thống kê, phân tích dữ liệu.
- Phân tích và thiết kế trong xây dựng hệ thống thông tin.
1.5. Lịch sử nghiên cứu
AngularJS và Web API đã được một số tác giả tìm hiểu và nghiên cứu
trước đó.

Phần lớn các tác giả đều cho thấy một cách tổng quan về nội dung lý thuyết
của AngularJS và Web API đồng thời cũng xây dựng những hệ thống phù hợp với
môi trường và bản thân tác giả.
Với những ưu điểm của mình thì AngularJS và Web API đã được sử dụng
trong nhiều hệ thống lớn tuy nhiên nó cịn khá mới mẻ đối với sinh viên trường
Đại học Quảng Nam.
1.6. Đóng góp của đề tài
Trình bày những kiến thức cơ bản và tổng quan về AngularJS và Web API.
Xây dựng website ứng dụng trong việc quản lý nhà ở sinh viên Trường Đại
học Quảng Nam.
1.7. Cấu trúc của khóa luận
Lời cảm ơn
Mục lục
MỞ ĐẦU
1. Lý do chọn đề tài
-2-


2. Mục đích nghiên cứu
3. Đối tượng và phạm vi nghiên cứu
4. Phương pháp nghiên cứu
5. Lịch sử nghiên cứu
6. Đóng góp của đề tài
NỘI DUNG
Chương 1: TỔNG QUAN VỀ ANGULARJS VÀ WEB API
Chương 2: PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG
Chương 3: CHƯƠNG TRÌNH THỬ NGHIỆM
KẾT LUẬN
TÀI LIỆU THAM KHẢO

-3-


Phần 2. NỘI DUNG NGHIÊN CỨU
Chương 1: TỔNG QUAN VỀ ANGULARJS VÀ WEB API
1.1. Tổng quan về AngularJS
1.1.1. Lịch sử của AngularJS
Hai năm trước khi AngularJS mới ra đười người ta cịn hồi nghi về việc nó
có thể cạnh tranh được các Javascript Framework khác như Backbone.js hay
Knockout hay không. Tuy nhiên với sự hỗ trợ đến từ Google và nhiều cải tiến
đáng kể thì hiện nay AngularJS khơng những được nhiều người sử dụng mà còn
đang trở thành một hiện tượng mới trong làng Javascript.
AngularJS là một framework Javascript mạnh mẽ, được nhúng vào HTML
page bằng thẻ Script. AngularJS mở rộng thêm thuộc tính của HTML với các
(chỉ thị, lệnh) Directives, và liên kết dữ liệu đến HTML với các (biểu thức)
Expressions nhằm giảm bớt quá trình phát triển ứng dụng web.
Về lịch sử hình thành, dự án AngularJS được bắt đầu từ năm 2009, do lập
trình viên Misko Hevery tại Google viết ra. Misko và nhóm lúc này đang tham
gia vào một dự án của Google tên là Google Feedback. Với AngularJS, Misko đã
rút ngắn số dòng code front-end từ 17000 dòng còn chỉ khoảng 1500. Với sự
thành cơng đó, đội ngũ của dự án Google Feedback quyết định phát triển
AngularJS theo hướng mã nguồn mở.
1.1.2. Khái niệm AngularJs
AngularJS là một khung làm việc được viết bằng Javascript (hay cịn được
gọi là Javascript Framework). AngularJS khơng chỉ đơn giản là một thư viện mà
nó cịn là một framework. Khác với các thư viện Javascript như jQuery,
AngularJS đưa ra hướng dẫn cụ thể hơn cách cấu trúc mã lệnh HTML và
Javascript. Ví dụ bạn sẽ thấy khi sử dụng AngularJS, mã lệnh HTML thường
được viết theo cấu trúc như sau:
<div ng-app="">

-4-

<input type="text" ng-model="name">

</div>
Ở ví dụ trên chúng ta thấy trong một số thẻ HTML có các thuộc tính lạ với
tiền tố ng- như ng-app, ng-model và ng-name. Trong AngularJS chugns được gọi
là các chỉ dẫn hay directives. Các chỉ dẫn này có ý nghĩa như sau:
Chỉ dẫn ng-app="" được dùng để giúp AngularJS đánh dấu ứng dụng sẽ
được bắt đầu từ bằng nào trong HTML.
Chỉ dẫn ng-model="name" được dùng để kết nối giá trị của trường <input>
với giá trị của biến name trong ứng dụng AngularJS.
Chỉ dẫn ng-bind="name" dùng để gắn giá trị của biến name ở trên trở thành
giá trị innerHTML của thẻ

.
1.1.3. Các tính năng chung của AngularJS
- AngularJS là một Framework phát triển mạnh mẽ dựa trên JavaScript để
tạo các ứng dụng RICH Internet Application (RIA).
- AngularJS cung cấp cho lập trình viên những tùy chọn để viết các ứng
dụng client-side trong mơ hình MVC (Model View Controller) một cách rõ ràng.
- Các ứng dụng được viết bởi AngularJS tương thích với nhiều phiên bản
trình duyệt web. AngularJS tự động xử lý mã JavaScript để phù hợp với mỗi trình
duyệt.
- AngularJS có mã nguồn mở, miễn phí hồn tồn, được sử dụng bởi hàng
ngàn lập trình viên trên thế giới. Nó hoạt động dưới giấy phép Apache License
version 2.0.
Nhìn chung, AngularJS là một framework để tạo các ứng dụng lớn, các
hiệu năng cao trong khi giữ cho chúng có thể dễ dàng duy trì.
1.1.4. Các tính năng cốt lõi của AngularJS
Dưới đây là các tính năng cốt lõi của AngularJS:

Data-binding: Nó tự động đồng bộ hóa dữ liệu giữa thành phần model và
view.
-5-


Scope: Là những đối tượng hướng đến model, nó hoạt động như là cầu nối
giữa controller và view.
Controller: Đây là những tính năng của AngularJS mà được giới hạn tới
một scope cụ thể.
Service: AngularJS hoạt động với một vài dịch vụ (service) có sẵn, ví dụ
$http để tạo XMLHttpRequests. Nó là các singleton object mà được khởi tạo duy
nhất một lần trong ứng dụng.
Filter: Nó lựa chọn (hay là lọc) các tập con từ tập item trong các mảng và
trả về các mảng mới.
Directive: Directive là các marker trong các phần tử DOM (như các phần
tử, thuộc tính, css và nhiều hơn thế). Nó có thể dùng để tạo các thẻ HTML riêng
phục vụ những mục đích riêng. AngularJS có những directive có sẵn như
ngBind,ngModel…
Template: Là các rendered view với các thơng tin từ controller và model.
Nó có thể được sử dụng trong các file riêng rẽ (ví dụ như index.jsp) hoặc nhiều
view với một trang sử dụng "partials".
Routing: Là khái niệm của sự chuyển dịch qua lại các view.
Model View Whatever: MVC là một mơ hình thiết kế để phân chia các ứng
dụng thành nhiều phần khác nhau (gọi là Model, View và Controller), một phần
sử dụng với một nhiệm vụ nhất định. AngularJS không triển khai MVC theo cách
truyền thống, mà gắn liền hơn với Model-View-ViewModel. Nhóm phát triển
AngularJS đã đặt tên vui cho mơ hình này là Model View Whatever.
Deep Linking: Cho phép bạn mã hóa trạng thái các ứng dụng trên địa chỉ
URL để nó có thể được bookmark. Các ứng dụng có thể được phục hồi lại từ các
địa chỉ URL với cùng một trạng thái.

Dependency Injection: AngularJS có sẵn một hệ thống con dependency
injection để giúp các lập trình viên tạo ra các ứng dụng dễ phát triển, dễ hiểu và
kiểm tra.

-6-


1.1.5. Ưu điểm và nhược điểm của AngularJS
Ưu điểm:
- AngularJS cung cấp khả năng tạo ra các Single Page Application một
cách rất rõ ràng và dễ dàng để duy trì.
- AngularJS cung cấp khả năng Data binding tới HTML do đó giúp người
dùng cảm giác linh hoạt, thân thiện.
- AngularJS code dễ dàng khi unit test.
- AngularJS sử dụng dependency injection.
- AngularJS cung cấp khả năng tái sử dụng các component (thành phần).
- Với AngularJS, lập trình viên sẽ viết ít code hơn, với nhiều chức năng
hơn.
- Với AngularJS, view là thành phần trong trang HTML thuần, trong khi
controller được viết bởi JavaScript với quá trình xử lý nghiệp vụ.
- Và trên tất cả, ứng dụng AngularJS có thể chạy trên hết các trình duyệt
web, trên các nền tảng Android và IOs.
Nhược điểm:
Mặc dù AngularJS có thể kể đến rất nhiều các ưu điểm, nhưng đến thời
điểm này, nó vẫn có một số điểm yếu sau:
Khơng an tồn: Là một JavaScript framework, ứng dụng được viết bởi
AngularJS khơng an tồn. Phải có các tính năng bảo mật và xác thực phía server
sẽ giúp ứng dụng trở nên an tồn hơn.
Nếu người sử dụng ứng dụng của bạn vơ hiệu hóa JavaScript thì họ chỉ
nhìn được trang cơ bản, khơng thấy gì thêm.

1.1.6. Các thành phần của AngularJS
AngularJS framework có thể được chia thành ba phần chính sau:
ng-app: directive này định nghĩa và liên kết một ứng dụng AngularJS tới
HTML.
ng-model: directive này gắn kết giá trị của dữ liệu ứng dụng AngularJS đến
các điều khiển đầu vào HTML.
-7-


ng-bind: directive này gắn kết dữ liệu ứng dụng AngularJS đến các thẻ
HTML.
1.2. Tổng quan về Web API
1.2.1. Giới thiệu API và Web API
1.2.1.1. Giới thiệu về API
Đơn giản như thế này, hiện nay nhiều người dùng mạng xã hội facebook và
bạn muốn viết một ứng dụng để đăng tin lên mạng xã hội này. Vậy làm sao để
làm một ứng dụng như vậy khi facebook là của người khác? Hiểu được nhu cầu
này của các lập trình viên facebook sẽ đưa ra các thư viện chứa các hàm đăng,
like, share...trên trang của mình để các lập trình viên khai thác! Đó chính là API
Google+, Gmail, Blogger, Youtube, các ứng dụng của windows (Windows
media player, Internet Explorer,...), nhaccuatui, zingmp3,...rất nhiều các trang
web, ứng dụng đưa ra các API để hỗ trợ các lập trình viên
- API (Application Programming Interface - Giao diện lập trình ứng dụng).
Mỗi hệ điều hành, ứng dụng đều có những bộ API khác nhau. Nó cung cấp cho
người lập trình các hàm tương tác với CSDL, lập trình thực hiện các thao tác với
hđh hay phần mềm đó. Hầu hết các hàm API được chứa trong các file DLL
- Ví dụ: Các hàm API của hđh windows cho phép chúng ta lập trình ứng
dụng thay đổi icon màn hình, xem thơng tin máy tính,... hay các hàm API của
google cho phép lập trình viên lấy thơng tin, sửa thông tin người dùng,... Các hàm
API của facebook cho chúng ta đăng stt, ảnh, cmt,...

- Vậy API có phải một ngơn ngữ lập trình khơng? Câu trả lời là không các
bạn ạ. Các hàm API cũng như các hàm bình thường mà chúng ta hay viết và trên
từng ngơn ngữ khác nhau cũng có các bộ API tương ứng khác nhau.
- Ví dụ: Google API có bộ cho .NET, PHP,...
1.2.1.2. Giới thiệu web api
- Web API là một phiên bản kế tiếp của WCF, giúp chúng ta xây dựng lên
các Service cung cấp dịch vụ cho các ứng dụng web, window,…
-8-


- Trước web API chúng ta để có các service API chúng ta phải cấu hình,
xây dựng các ứng dụng wcf, web service khá phức tạp.
- Một ứng dụng đơn giản như là: Chúng ta có 1 Web API cung cấp các dịch
vụ lưu trữ dữu liệu, cung cấp các chỉ số chứng khốn, kết quả bóng đá, xổ số,…
- Các ứng dụng Client như website, ứng dụng winform, wpf có thể kết nối
vào Web API để lấy các dữ liệu về xử lý, cũng như cập nhật thông tin lại Web
API.
- Web API dùng phương thức trao đổi dữ liệu là HTTP, kiểu dữ liệu trao
đổi là JSON, một chuẩn dữ liệu hướng đối tượng được dùng khá nhiều trong việc
lưu chuyển thông tin trên Internet.
- Do dùng jSon là kiểu dữ liệu chuyển đổi nên tốc độ các trang web sử dụng
web API tương tác dữ liệu có tốc độ khá cao. Ngoài ra do Web API dùng giao
thức HTTP nên hầu như tất cả các ứng dụng trên các cơng nghệ đều có thể kết nối
tới để lấy cũng như tương tác với web API cụ thể như chúng ta có thể dùng các
cơng nghệ web như: Asp.net (MVC, Web Page, Web form), PHP, jsp hay các ứng
dụng desktop như: winform, wpf đều có thể dễ dàng kết nối tới web API.
- Với Web API chúng ta có thể xây dựng và phân tách các ứng dụng web
lớn. Cấu hình từng thành phần riêng biệt của website. Đâu là tầng data, đâu là
tầng xử lý, đâu là tầng dịch vụ,… Nền tảng của các ứng dụng lớn ln là các
service để các website thành viên có thể kết nối tương tác dữ liệu.

- Do đó với Web API chúng ta có thể ứng dụng vào các dự án Web (cũng
như window) lớn để phát triển trên nhiều tầng xử lý khác nhau.
- Dùng web API chúng ta dễ dàng xây dựng các ứng dụng window kiểu
điện toán (dữ liệu ở server) còn client chỉ cài giao diện.
Hay có thể xây dựng các website Single Page Application (SPA) (tất cả
web chỉ gói gọn trong 1 trang). Ứng dụng này tương tác khá cao với người dùng,
tốc độ nhanh (do dùng ajax) thường được dùng làm các website tương tác với các
thiết bị di động (các thiết bị di động thường có kết nối Internet chậm).

-9-


1.2.2. Những lợi ích khi sử dụng ASP.NET Web API
1.2.2.1. Cấu hình
Ngay khi bạn xây dựng một website, khơng cần bất kỳ cấu hình gì chúng ta
đã có thể cài đặt và sử dụng dịch vụ trên nền ASP.NET Web API. Khái niệm
điểm đầu cuối (xuất hiện trong WCF) không cịn, và cũng khơng cần contract. Và
bạn sẽ thấy ngay sau đây, một dịch vụ trên nền ASP.NET Web API được thiết lập
lỏng lẻo nếu ta so sánh với dịch vụ WCF. Theo đó bạn chỉ cần sử dụng REST
(Representational State Transfer – các bạn có thể xem chú giải vắn tắt về REST ở
cuối bài) URL, cùng các tham số đầu vào, và kết quả trả về là các bản tin JSON
hay XML.
1.2.2.2. Mặc định sử dụng REST
Việc xây dựng các dịch vụ với ASP.NET Web API cung cấp cho ta hầu hết
những thành phần thiết yếu để xây dựng kiến trúc REST. Đó là bởi vì tính năng
điều hướng (Route) URL tích hợp ngay trong nền tảng, các địa chỉ dịch vụ với
ASP.NET Web API là các điều hướng RESTful ánh xạ với các phương thức của
controller. Vì thế cho phép sử dụng các đường dẫn theo phong cách REST rất
thân thiện.
1.2.2.3. Trừu tượng hóa với các Route

Tương tự như các giao diện dịch vụ và sự thực thi chúng trên WCF, các
route cho phép nhà phát triển ASP.NET Web API tạo ra lớp trìu tương giữa bên
yêu cầu nhìn thấy và sự thực thi ở lớp dưới. Nói theo cách khác thì bạn có thể gắn
kết bất cứ URL nào với bất cứ phương thức nào của các controller.
Với sự thay đổi về phiên bản dịch vụ, chỉ đơn giản bằng cách thêm một
route mới (ví dụ “v2”) vào trong URL cho phép ta duy trì song song nhiều phiên
bản dịch vụ trên hệ thống mà không ảnh hưởng đến các dị vụ đang có.
1.2.2.4. Mở rộng chức năng xử lý dạng đường ống đơn giản
ASP.NET Web API cung cấp khả năng mở rộng dạng đường ống thông qua
các bộ lọc (filter) cho phép xử lý trước và sau khi thực thi các action của
controller.
- 10 -


Bằng việc gắn các bộ lọc cho phép ta thực hiện lọc các action (theo tham số
request), lọc vai trò (authorization) và lọc ngoại lệ. Để dùng có thể đơn giản bằng
cách khai báo attribute, hay cấu hình tồn cục áp dụng cho tất cả các phương thức.
1.2.3. Một số đặc điểm nổi trội của ASP.NET Web API
1.2.3.1. Thuận tiện cho các hành động (action) CRUD (create – read –
update – delete)
Các action HTTP (như GET, POST) tự động gắn kết vào các phương thức
của controller (chính là các controller action) thơng qua tên của chúng. Ví dụ

1.2.3.2. Thỏa thuận nội dung được tích hợp sẵn
Với MVC, để cho phép các phương thức controller trả về dữ liệu JSON hay
XML thì phải tùy biến kết quả trả về ở dạng nguyên gốc (raw). Nhưng với
- 11 -


ASP.NET Web API, các phương thức controller chỉ cần trả về dữ liệu gốc, tồn

bộ phần cịn lại sẽ tự động được chuyển đổi sang JSON hay XML tùy theo yêu
cầu từ gọi tới. Trong đó, yêu cầu từ bên gọi tới cũng chỉ cần sử dụng tiêu đề
(header) Accept hay Content-Type.
1.2.3.3. Cho phép sử dụng các attribute tiền tố điều hướng (route prefix) và
route
Trong nhiều trường hợp nếu bạn không muốn các phương thức trong
controller tuân theo quy tắc chung thì ta có thể sử dụng các attribute để cài đặt
riêng

như

RouteAttribute,

RoutePrefixAttribute,

HttpGetAttribute,

HttpPostAttribute, ….
1.2.3.4. Định nghĩa quy tắc ràng buộc cho route
Đặc điểm này cung cấp một cơ chế cho phép bạn chỉ ra các nguyên tắc
nghiệp vụ riêng trong xử lý route:

1.2.3.5. Hỗ trợ CORS (Cross-Origin Resource Sharing ~ Chia sẻ giữa các
nguồn tài nguyên gốc)
Trong ASP.NET Web API ta có thể kích hoạt chức năng này bằng việc đặt
một attribute EnableCorsAttribute để cho phép các yêu cầu bằng JavaScript từ các
domain khác có thể truy cập domain dịch vụ của bạn.
- 12 -

1.2.3.6. Quản lý lỗi toàn cục
Đây là một cải thiện rất lớn từ phiên bản ASP.NET Web API 2.1. Theo đó,
tất cả các exception khơng được bắt giờ có thể được ném ra và bắt thông qua một
cơ chế tập trung. Việc hỗ trợ nhiều các ghi log ngoại lệ được thực hiện trong
chính nền tảng (framework), tại đó cho phép ta truy xuất đến chính ngoại lệ bị
ném ra cùng ngữ cảnh của nó.
1.2.3.7. Giao diện IHttpActionResult
Việc thực thi giao diện này sẽ định nghĩa một HttpResponseMessage
factory có thể tái sử dụng và thuận tiện khi xây dựng unit-test.
1.2.4. Kết luận chương 1
Chương 1 đã trình bày những kiến thức cơ bản và tổng quan nhất của
AngularJs và WEB API. Qua đó cũng cho thấy được việc ứng dụng AngulaJS và
WebAPI là một vấn đề quan trọng trong quá trình xây dựng hệ thống WEB, đặc
biệt là những WEB App.
Trong AngularJs và WEB API có nhiều mơ hình kiến trúc khác nhau, mỗi
loại đều có những ưu và nhược điểm riêng của nó.

- 13 -


Chương 2: PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG
2.1. Khảo sát hệ thống
2.1.1. Phát biểu bài tốn
Ngày nay cơng nghệ thơng tin có những bước phát triển về chiều rộng và
chiều sâu. Máy tính điện tử khơng cịn là 1 thứ phương tiện quý hiếm mà đang
ngày càng trở thành 1 cơng cụ làm việc. Trên thị trường, có nhiều phần mềm quản
lý nhưng phần mềm quản lý ký túc xá thì ít có, và chưa được cải tiến, chưa thân
thiện với người sử dụng. Ứng dụng phần mềm quản lý ký túc xá đang được mở
rộng và ngày càng tiếp cận với nhiều thành phần sử dụng, đặc biệt là những người
khơng thành thạo vi tính và chun ngành công nghệ thông tin.

Ký túc xá (KTX) của trường Đại học Quảng Nam về quy mô là rất lớn nên
việc quản lý thông tin cán bộ quản lý thông tin cán bộ, quản lý sinh viên nội trú,
quản lý các phịng, quản lý thu tiền điện nước, tìm kiếm thơng tin là rất cần thiết.
Ngày nay việc quản lý trên máy tính mang lại hiệu quả cao về nguồn nhân lực,
kinh tế. Đặc biệt vào mỗi đầu năm học, số lượng sinh viên (SV) đăng ký ở KTX
là rất nhiều, vì vậy nếu có 1 chương trình quản lý KTX sẽ giúp công việc nhanh
hơn và tiết kiệm dc nhiều thời gian cho công tác quản lý.
Việc quản lý KTX nói chung hiện tại của nhà trường vẫn cịn gặp nhiều khó
khăn vì các cơng việc quản lý vẫn cịn quản lý một cách thủ công, từ việc thông
báo, đăng ký chỗ ở, đến việc quản lý hồ sơ sinh viên nội trú, thu chi tiền phòng,
tiền điện nước…vẫn còn quản lý trên sổ sách là chính yếu. Đặc biệt là vào đầu
mỗi năm học mới, số lượng sinh viên đăng ký vào ở KTX là rất đông, với cách
quản lý thủ cơng như vậy thì việc xử lý các đơn đăng ký của sinh viên rất chậm,
đôi khi tạo ra những áp lực trong công việc đối với cán bộ quản lý KTX. Vì vậy,
việc tin học hóa cơng tác quản lý KTX của nhà trường là hết sức cần thiết.
Các dữ liệu được lưu trữ bằng sổ sách nên khi tìm kiếm hay cụ thể là thao
tác với dữ liệu đã lưu thì tốn nhiều thời gian.
- 14 -