Kỷ yếu Hội nghị Q
K
Quốc gia lần thứ VIII về Nghiên cứ cơ bản và ứng dụng Công nghệ thông tin (FAIR) Hà Nội, ngày 9
ứu
ệ
);
9-10/7/2015
DOI: 10.15625/va
D
ap.2015.000195
PHÁT TR
P
RIỂN ỨNG DỤNG WEB HƯ
G
G
ƯỚNG MÔ HÌNH DỰA TR
M
RÊN KỸ THUẬT
T
WE UWE
EB
T
Trần Đình Diễ Huỳnh Qu
ễn,
uyết Thắng
Viện Cô nghệ thôn tin và Truyền thông, Trường Đại học B
ông
ng
Bách khoa Hà Nội
à
tddien
n@cdts.edu.vn thanghq@so
n,
oict.hust.edu.v
vn
TÓM TẮ - Trong bài báo này chúng tôi trình bày kỹ thuật phát tr
TẮT
i
g
riển ứng dụng Web hướng mô hình (MDWE) phân tích,
ô
),
ưu nhược điểm của một số kỹ t
ư
thuật điển hình Bài báo đi sâu vào trình bày kỹ thuật UWE trong phát tri ển các ứng dụn Web: các
h.
y
E
ng
mô hình, các kỹ thuật chuyển đ mô hình. Tr cơ sở sử dụng công cụ Ma
m
ỹ
đổi
rên
agicUWE và áp dụng kỹ thuật UWE trong phát triển ứng
dụng Thuysan.N bài báo đã p
d
Net,
phân tích và làm rõ phương ph áp dụng chi tiết các kỹ thu phát triển ứn dụng Web UWE.
m
háp
uật
ng
U
Từ khóa - Kỹ thuật W
a
Web, Kỹ thuật W dựa UML (UWE), Phát tr
Web
(
riển ứng dụng W hướng mô hình (MDWE), Phát triển
Web
ô
phần mềm hướn mô hình (MD
p
ng
DSD).
I. GIỚI THIỆU
G
U
Kiến trú hướng mô hình (MDA) l kỹ thuật mớ cho sự phát triển sản phẩm phần mềm. Kỹ thuật này giải quyết
úc
là
ới
t
ẩm
.
y
được sự phức tạp của nền t
đ
tảng công ngh khác nhau bằng việc sử dụng các mô hình (models như là tác nhân chính
hệ
s)
n
tr
rong toàn bộ vòng đời phát triển ứng dụ
t
ụng, giảm sự phụ thuộc vào nền tảng côn nghệ [17]. Khi có nền tả mới ra
p
o
ng
ảng
đời thì ứng dụ mới sẽ đượ chuyển đổi tự động từ các mô hình để tương thích với nền tảng mới. Do đó, MDA đang
đ
ụng
ợc
i
ể
M
tr thành một phương pháp tiếp cận đượ chấp nhận rộng rãi để ph triển các ứ dụng phức tạp và ngày càng dành
rở
p
ợc
r
hát
ứng
c
được nhiều sự quan tâm của cộng đồng n
đ
ự
a
nghiên cứu cũng như giới cô nghiệp ph mềm [2]. Các ứng dụng Web bao
ông
hần
g
gồm nhiều thà phần khác nhau có thể được cung cấp bởi những nhà phát triể khác nhau với nền tảng công nghệ
g
ành
c
ển
khác nhau, nên việc sử dụng các kỹ thuật phát triển hư
k
n
g
t
ướng mô hình cho các ứng d
dụng Web đặc biệt hữu ích [2, 5, 11].
c
h
Các kỹ thuật n đã khắc p
C
này
phục được nh
hiều hạn chế mà các quá trì phát triển phần mềm tr
m
ình
n
rước đó chưa giải quyết
được [11], giả chi phí thự hiện dự án p
đ
ảm
ực
phần mềm, tă năng suất thực hiện dự án một cách t
ăng
trực tiếp hoặc thông qua
giảm khối lượn công việc làm lại. Có nh
g
ng
hiều kỹ thuật để phát triển ứng dụng web hương mô h
ứ
b
hình như: OOW UWE,
WS,
WebML, Web
W
bSA [6,11,16], trong đó UW là kỹ thuật phát triển ứng dụng web ho chỉnh và đ
,
WE
g
oàn
được sử dụng nhiều nhất
tr
rong kỹ thuật Web hướng m hình.
mô
Trong b báo này ch
bài
húng tôi trình bày kỹ thuật phát triển phần mềm hướng mô hình cho ứng dụng We dựa trên
p
n
g
eb
kỹ thuật UWE (UML-base W Engineering), thảo luậ và phân tíc những lợi th và bất lợi c phương pháp hướng
k
E
Web
ận
ch
hế
của
mô hình trong phát triển ứn dụng Web. Nội dung tiếp theo của bài báo như sau: trong phần II trình bày kỹ thuật Web
m
ng
p
I
ng
hướng mô hình trong đó tổn hợp so sán một số kỹ thuật điển hình Phần III tập trung trình b kỹ thuật Web hướng
h
h,
nh
t
h;
p
bày
W
mô hình UWE các mô hình phương phá xây dựng mô hình và kỹ thuật chuyển đổi mô hình Phần IV trình bày chi
m
E:
h,
áp
m
ỹ
n
h;
tiết áp dụng tro xây dựng ứng dụng Thu
ong
uysan.net; Cuối cùng, phần V là đánh giá nhận xét.
á
II KỸ THUẬT WEB HƯỚ
I.
ỚNG MÔ HÌN
NH
A. Giới t
thiệu
Khi kỹ thuật phát triển phần mềm dựa mô hình (Model Driven Software D
m
h
Development - MDSD) [1] ngày càng
tr nên phổ biến trong cộng đồng phát tri phần mềm thì các kỹ thu phát triển ứng dụng We cũng bắt đầ thay đổi
rở
g
iển
m
uật
eb
ầu
về phương phá luận và quy trình để phù hợp với kỹ thuật MDSD nhằm tạo ra c ác ứng dụng W nhanh ch
v
áp
y
ù
t
n
Web
hóng và có
chất lượng. Hư
c
ướng tiếp cận theo sự thay đổi này được gọi là kỹ thuậ Web hướng mô hình (MD
ật
g
DWE) [6]. Hình 1 mô tả
cấu trúc phát tr ứng dụng Web hướng m hình [6].
c
riển
g
mô
H
Hình 1. Cấu trú MDA cho kỹ thuật Web
úc
ỹ
Trần Đình Diễn, H
T
Huỳnh Quyết Thắ
ắng
565
MDWE chấp nhận và phát triển m số kỹ thuật trong MDSD nhằm tạo nê các ứng dụn Web [1,6, 3, 11] như:
E
một
t
D
ên
ng
3
(1) xây dựng c siêu mô hì và mô hình trong miền ứng dụng Web (2) định ngh và thực hiệ các chuyển đổi từ mô
các
ình
h
ứ
b;
hĩa
ện
n
hình đến mô h
h
hình, chuyển đ từ mô hình đến code với mục đích đạ được một ph trong toàn bộ quá trình thực hiện;
đổi
h
ạt
hần
n
và (3) kết nối hoặc phát triể công cụ để hỗ trợ thiết lậ chuyển đổ các mô hình tạo mã. Với cách này, MDWE giúp
v
ển
ập,
ổi
h,
i
th hẹp khoảng cách giữa m hình thiết k cấp cao và mã thực hiện Web cấp thấp [11].
hu
g
mô
kế
m
W
Hiện na một số kỹ thuật Web hư
ay,
ướng mô hình điển hình như OOWS, UW WebML, W
ư
WE,
WebSA đã đượ sử dụng
ợc
rộng rãi cho việc thiết kế và phát triển củ các ứng dụ Web[15, 18]. Trong mụ tiếp theo, c
r
à
ủa
ụng
1
ục
chúng tôi tổng hợp và so
sánh các kỹ thu này.
s
uật
B. So sá một số kỹ thuật Web hư
ánh
ướng mô hình điển hình
h
1) UWE
E
UWE là phương phá hướng đối t
à
áp
tượng dựa trên ngôn ngữ mô hình hóa U
m
UML [2], là m trong nhữn kỹ thuật
một
ng
đầu tiên phát t
đ
triển theo kỹ t
thuật hướng m hình và đư sử dụng nhiều nhất tron kỹ thuật W hướng mô hình [6].
mô
ược
n
ng
Web
UWE là một k thuật phát tr ứng dụng Web hoàn ch nhưng ch yếu tập trun vào giai đo phân tích và thiết kế.
U
kỹ
riển
g
hỉnh
hủ
ng
oạn
v
Một trong nhữ ưu điểm q
M
ững
quan trọng của UWE là tất cả các mô hìn của nó đều là phần mở r
a
nh
rộng của UML UWE sử
L.
dụng ký pháp đồ họa hoàn toàn dựa trên UML. Nó ch phép sử dụ các công cụ dựa trên U
d
n
ho
ụng
UML và giảm thiểu thời
m
gian nghiên cứ của các nhà phát triển W những ngư đã quen th
g
ứu
à
Web,
ười
huộc với UML
L[6].
Cách tiếp cận MDSD của UWE có lẽ là một tron những phư
D
ó
ng
ương pháp hoà thiện nhất v nó đưa ra một siêu mô
àn
vì
m
hình tương ứng mỗi mô hình của UWE n
h
h
như: Yêu cầu, Nội dung, Điề hướng, Trìn bày và Xử lý, các mô hì này kết
ều
ình
ử
ình
hợp với sự chu
h
uyển đổi mô h
hình nhằm thu được mô hình từ các mô hì khác [6].
h
ình
2) WEB
BML
WeBM là một phươ pháp thiết kế Web thế hệ thứ ba dựa trên MDA [14 Trong WeB
ML
ơng
t
h
4].
BML bổ sung xây dựng
g,
tập ký pháp để thiết kế khá niệm của cá trang Web phức tạp [6]. Phát triển ứn dụng với W
ể
ái
ác
ng
WeBML được hỗ trợ bởi
WebRatio, mộ công cụ thương mại cho v thiết kế và thực hiện cá ứng dụng W [7]. Phươ pháp này sử dụng ký
W
ột
việc
v
ác
Web
ơng
s
hiệu (notation) riêng và khô sử dụng m
h
)
ông
meta-model tu thủ MOF, mà sử dụng D
uân
Document Ty Definition (DTD) để
ype
lư các mô hìn nội dung v điều hướng ví dụ định nghĩa dạng ng pháp (gram
ưu
nh
và
g,
n
gữ
mmar-like defi
inition) cho cấ trúc của
ấu
tài liệu XML. DTD không có tính trừu tượng như MOF và thiếu ký hiệu dễ hiểu. Ngôn ngữ chuyển đổi XSLT
.
g
u
ễ
(eXtensible St
tylesheet Lang
guage Transfo
ormation) đượ sử dụng cho việc chuyển đổi mô hình sang mã ngu (hỗ trợ
ợc
o
n
h
uồn
Java và JSP). X
J
XSLT không phù hợp với những chuyển đổi phức tạp khó phát tri chương trì và dễ bị lỗ [2]. Tuy
n
p,
iển
ình
ỗi
nhiên, phương pháp tiếp cận mô hình định hướng của WeBML đặc biệt hiệu quả t
n
g
n
h
W
b
trong việc tạo các trang Web hỗ trợ đa
phương tiện [4
p
4].
Hình 2. Kiến trúc của WeBML [14]
n
Theo [1 có 3 mô h
14]
hình được đưa ra: (1) Mô hì dữ liệu, th hiện các nộ dung dữ liệu của trang Web tổ chức
a
ình
hể
ội
u
W
th thực thể - quan hệ, We
heo
eBML không xác định ký pháp của mình và thay vào đó đề xuất sử dụng kỹ thuật mô hình
p
h
ử
hóa chuẩn như Sơ đồ Thực thể - Quan hệ hoặc sơ đồ lớp UML. (2) Mô hình siêu văn bản mô tả một hoặc nhiều
h
ư
c
đ
n
h
hypertexts có t được công bố trên trang Web. Mỗi một siêu văn bản xác định m trang Web bao gồm một tiểu mô
h
thể
g
g
m
b
một
b,
m
hình thành phầ và một tiểu mô hình điều hướng. Mô hình đầu tiên xác định các t
h
ần
u
u
h
trang tạo nên siêu văn bản và các đơn
vị nội dung kế cấu nên tran Web, mô h
v
ết
ng
hình thứ hai mô tả cách các trang và các đơn vị nội du được liên kết từ siêu
m
ung
văn bản. (3) M hình trình bày, nó trình bày các lớp và các đồ họa được thể hiệ của trang W
v
Mô
v
a
ện
Web, độc lập với thiết bị
v
đầu ra và ngôn ngữ thể hiện
đ
n
n.
566
PHÁT TRIỂN ỨNG DỤNG WEB HƯỚNG MÔ HÌNH DỰA TRÊN KỸ THUẬT WEB UWE
3) OOWS
Theo [7] OOWS là phương pháp kỹ thuật Web, nó cung cấp kỹ thuật để hỗ trợ cho việc phát triển ứng dụng
Web. OOWS là sự mở rộng của phương pháp OO-Method. OO-Method gồm 3 mô hình: Mô hình cấu trúc, mô hình
động, mô hình chức năng, để phù hợp cho việc phát triển ứng dụng Web, OOWS đề xuất mới 3 mô hình: mô hình
người dùng, mô hình điều hướng và mô hình trình bày. Ba mô hình mới cho phép mô tả đầy đủ các ứng dụng Web tại
mức PIM. Quá trình tạo mã thực hiện bởi công cụ OlivaNova [7].
4) WebSa
WebSA là một cách tiếp cận hướng mô hình cho phát triển ứng dụng Web. Quá trình phát triển dựa trên MDA
thiết lập 4 giai đoạn của vòng đời phát triển: phân tích; thiết kế độc lập nền tảng, nơi xây dựng mô hình nền tảng độc
lập (PIM); thiết kế nền tảng cụ thể, nơi xây dựng mô hình nền tảng độc lập (PSM) và thực hiện [11]. Phương pháp này
nhóm các mô hình ứng dụng web thành 2 khung nhìn: chức năng và kiến trúc (Hình 3) theo [13, 16].
Hình 3. Quy trình phát triển WebSA
WebSA sử dụng mô hình đề xuất trong hai phương pháp: UWE và OO-H [11, 16]. Trong giai đoạn phân tích,
đặc điểm kỹ thuật Web được chia thành mô hình chức năng và các mô hình kiến trúc khái niệm.
Trong bảng 1, đưa ra tổng hợp so sánh các kỹ thuật OOWS, UWE, WebML, WebSA theo cấp độ MDA [6].
Trong khuôn khổ nghiên cứu này chúng tôi tập trung đề cập đến phương pháp xây dựng các mô hình theo UWE, trong
đó các hoạt động mô hình hoá chính là phân tích yêu cầu (requirement), thiết kế các khía cạnh nội dung (content), điều
hướng (navigation), xử lý (process) và biểu diễn (presentation), ở các bước chuyến đổi mô hình từ CIM sang PIM. Từ
PIM sang PSM và từ PSM sang code. Kết quả ở mỗi bước chuyển đổi là mô hình mặc định được tạo và sẵn sàng cho
các bước chuyển đổi tiếp theo [1].
Bảng 1. Tổng hợp so sánh các kỹ thuật Web hướng mô hình [6]
Kỹ thuật Web
hướng mô hình
UWE
WebML
OOWS
WebSA
CIM
X
X
Cấp độ kiến trúc mô hình
PIM
PSM
X
X
X
X
X
X
X
Bảng 1 cho thấy, kỹ thuật UWE hoàn toàn tuân thủ theo MDA cho việc phát triển ứng dụng Web. Vì vậy, các
nội dung trình bày trong các mục tiếp theo của bài báo được tập trung vào kỹ thuật UWE.
III. KỸ THUẬT WEB HƯỚNG MÔ HÌNH UWE
Metamodel UWE được tách theo cấu trúc gói như trong Hình 4. Trong đó, gói Adaptivity có mục đích cho phép
ngôn ngữ có thể mở rộng. Gói Core được chia thành các gói nhỏ hơn (còn được gọi là các mô hình trong UWE), bao
gồm [9]: (1) Requirements (Yêu cầu), (2) Content (Nội dung), (3) Navigation (Điều hướng), (4) Presentation (Trình
bày) và (5) Process (Xử lý) [9].
Trần Đình Diễn, H
T
Huỳnh Quyết Thắ
ắng
567
H
Hình 4. Cấu trú siêu mô hình trong UWE
úc
A. Các m hình trong UWE
mô
g
Mô hìn yêu cầu (R
nh
Requirements Model): mô hình yêu cầu tập trung vào việc sử dụng biểu đồ ca sử dụng của
s
o
g
ử
ngôn ngữ UM thông thườ để xác địn một vài xử lý và hoạt độ mà ứng d
n
ML
ờng
nh
ộng
dụng Web cần thực hiện. Các phần tử
n
đặc trưng của m hình này:
đ
mô
<
> là n
những use case có nhiệm vụ như: duyệt, xem và tìm kiế
e
ụ
x
ếm
<> các use case có n
c
nhiệm vụ khác
c
<> us case yêu cầ sự thích ngh
se
ầu
hi
Mô hìn nội dung (
nh
(Content Mod
del): Mô hình nội dung cho các ứng dụn Web với U
h
o
ng
UWE không kh biệt so
hác
với mô hình n dung phát triển phần m
v
nội
t
mềm không ph Web. Do đó, chúng tôi sử dụng thà phần mô hình UML
hải
i
ành
h
chuẩn cho mô hình cấu trúc như các lớp, các liên kết và các gói để mô hình hóa n dung của ứ dụng Web Ngoài ra
c
c
v
m
nội
ứng
b.
mô hình hành vi có thể sử dụ tính năng của UML nh máy trạng th và biểu đồ trình tự.
m
dụng
g
hư
hái
ồ
Mô hìn điều hướn (Navigation Model): Nh tên gọi, mô hình này đượ sử dụng để xác định luồ chuyển
nh
ng
n
hư
ô
ợc
ể
ồng
hướng mà ngư sử dụng c thể làm the (VD: các tr
h
ười
có
eo
rang Web và luồng chuyển hướng kết n chúng với nhau). Nó
n
nối
được thực hiện bằng biểu đồ lớp UML, đ
đ
n
ồ
được bổ sung bới những khu mẫu UWE đại diện cho các nút và cá liên kết.
b
uôn
E
o
ác
Các metamode điều hướng UWE được t
C
el
g
trình bày trong hình 5 [9]. Trục sương số của metam
g
T
ống
model điều hư
ướng là các
cặp trừu tượng metaclasses nút và link v các liên kế giữa các lớ này. Một tậ hợp các nú và link cun cấp các
c
g
s
và
ết
ớp
ập
út
ng
metaclass miề Web cụ thể cho việc xây dựng mô hình điề hướng: Na
m
ền
c
ều
avigationClas và Process
ss
sClass với
NavigationLin và ProcessL
N
nk
Link cũng như các Menu và các truy cập nguyên thủy I
ư
à
Index, Guided
dTour và Quer
ry.
Hình 5. S mô hình điều hướng (Navigation Metam
Siêu
model)
568
5
PHÁT TRIỂN ỨNG DỤNG WEB HƯỚNG MÔ HÌNH DỰA TR
N
W
Ô
RÊN KỸ THUẬT WEB UWE
T
Mô hìn xử lý (Proc Model): mô hình xử lý đặc tả hành vi của ứng dụ Web, nhữn hành động của người
nh
cess
ý
ụng
ững
dùng và phản hồi của ứng d
d
dụng tương ứn Nó bao gồm: (1) mô hìn cấu trúc củ xử lý - mô t mối quan hệ giữa một
ng.
nh
ủa
tả
vài xử lý khác nhau (hoặc c
v
cũng có thể là tập hợp các hoạt động) của ứng dụng W và (2) mô hình luồng xử lý – gồm
h
a
Web
ử
các biểu đồ ho động UML mô tả cụ th một xử lý được thực hiện như thế nào (khuôn mẫu UserAction trong UWE
c
oạt
L
hể
đ
n
o
được sử dụng để xác định cá hoạt động đ hỏi sự tươ tác rõ ràng với người sử dụng) (hình 6).
đ
ác
đòi
ơng
g
ử
Hình 6. Siêu mô hình xử lý (Process Metamodel) [9
h
s
9]
Lớp xử lý tượng trưn cho một xử lý thông qua việc hướng dẫn người dù cách sử dụ trên ứng dụng Web,
ử
ng
ử
a
ùng
ụng
d
khuôn mẫu UM <>
Link x lý thường là một liên kết giữa một lớp điều hướng và m lớp xử lý, khuôn mẫu UML:
xử
g
n
m
một
m
<>
Trạng t của một W xử lý đượ xác định bở mô hình luồ xử lý, trình bày bởi biểu đồ hoạt động UML
thái
Web
ợc
ởi
ồng
h
u
g
Luồng xử lý bao gồm luồng thực thi được trình bày bởi các nút và các cạ của hoạt đ
m
h
ạnh
động, các nút điều khiển
cung cấp cấu t
c
trúc điều khiể của luồng, như là quyết định và đồng bộ hóa, nút đối tượng để trình bày luồ dữ liệu
ển
g
ồng
th các cạnh và đỉnh của h
heo
hành động, tro UML2 ng nghĩa của hoạt động dựa trên điều kh
ong
gữ
h
a
hiển và các dấ hiệu của
ấu
dòng dữ liệu.
d
Mô hìn trình bày (
nh
(Presentation Model): Mô hình trình bày mô tả một c nhìn trừu tư
n
y
cái
ượng về giao diện người
dùng của ứng dụng (ví dụ g diện các tr
d
giao
rang Web). Mô hình trình bày định nghĩa nhiều khuôn mẫu cho các loại thành
M
b
a
n
phần khác nha (ví dụ như khung nhập v bản, các nút bấm,…), nhưng không c
p
au
văn
n
n
cung cấp chi t cụ thể như kiểu CSS
tiết
ư
hoặc các yếu tố HTML.
h
ố
Hình 7. Si mô hình trìn bày (Presenta
iêu
nh
ation Metamod [9]
del)
Từ nhữ trình bày t
ững
trên về UWE metamodel ta có thể định nghĩa một cách ngắn gọn: “
a
n
h
“UWE metamodel là các
g
tiêu chuẩn về mô hình trong UWE, dựa vào để xây dự các mô hình Requirem
ựng
h
ment, Content, Navigation, Process và
,
Presentation ch ứng dụng W
P
ho
Web.