Tìm hiểu asp net xây dựng website tin tức đa ngôn ngữ

TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NG

Tr-ờng đại học vinh
Khoa công nghệ thông tin
--------------

đồ án tốt nghiệp đại học
Ngành: kỹ s- công nghệ thông tin

Tìm hiểu asp.net xây dựng website
tin tức đa ngôn ngữ
gvhd: ths. Cao thanh sơn
svth : nguyễn hoàng hòa
lớp : 47k cntt

Nghệ An - 05/2011

Trang 3


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

MỤC LỤC
MỤC LỤC..................................................................................................................3
DANH MỤC TỪ VIẾT TẮT, THUẬT NGỮ ...........................................................7
DANH MỤC HÌNH VẼ, ĐỒ THỊ .............................................................................8
LỜI NĨI ĐẦU ..........................................................................................................9
CHƢƠNG 1. KHẢO SÁT HỆ THỐNG ............................................................11
1.1

Tổng quan về ASP.NET ............................................................................11

1.1.1 Giới thiệu ngôn ngữ ASP.NET .............................................................11
1.1.2

Ưu điểm của ASP.NET ........................................................................12

1.2

Tổng quan về ngơn ngữ lập trình C# .....................................................17

1.3

Thƣ viện Jquery ........................................................................................17

1.4

Ajax ............................................................................................................20

1.5

Khảo sát hiện trạng của Website tin tức .................................................24

1.5.1 Mục đích yêu cầu của trang web.............................................................24
1.5.2 Yêu cầu của hệ thống ...........................................................................25
1.6

Tổng kết .....................................................................................................25

1.6.1

Chức năng User ....................................................................................25

1.6.2

Đối với người quản trị ..........................................................................26

1.6.3

Yêu cầu của hệ thống mới....................................................................26

CHƢƠNG 2. PHÂN TÍCH HỆ THỐNG ............................................................27
2.1

Yêu cầu chi tiết về Website ......................................................................27

2.1.1

Đối với người truy cập Website với chức năng User ..........................27

Trang 4


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

2.1.2
2.2

Đối với người quản trị ..........................................................................27

Biểu đồ phân cấp chức năng, biểu đồ luồng dữ liệu .............................27

2.2.1

Mô tả các chức năng ...........................................................................27

2.2.2 Biểu đồ phân cấp chức năng ................................................................30
2.2.3 Biểu đồ luồng dữ liệu ...........................................................................32
CHƢƠNG 3. THIẾT KẾ CƠ SỞ DỮ LIỆU ......................................................35
3.1

Thiết kế cơ sở dữ liệu ..............................................................................35

3.2

Lựa chọn cài đặt CSDL ...........................................................................35

3.3

Xác định các thực thể ..............................................................................36

CHƢƠNG 4. ĐẶC TẢ GIAO DIỆN ...................................................................41
4.1

Phần dành cho ngƣời sử dụng .................................................................41

4.1.1 Trang chủ ..............................................................................................41
4.1.2 Trang chủ của từng lĩnh vực ................................................................42
4.1.3 Trang đăng nhập ...................................................................................42
4.1.4 Trang đăng ký ......................................................................................43
4.2

Phần quản trị website ..............................................................................44

4.2.1

Trang xem, nhập, sửa, xóa các bài viết theo lĩnh vực .........................44

4.2.2 Trang quản lý thành viên của website ..................................................45
4.2.3 Trang gửi bài viết .................................................................................46
CHƢƠNG 5. GIAO DIỆN CHƢƠNG TRÌNH ..................................................47
5.1

Dành cho ngƣời sử dụng ..........................................................................47

5.1.1 Trang chủ .............................................................................................47

Trang 5


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

5.1.2 Trang chủ từng lĩnh vực ........................................................................49
5.2

Dành cho ngƣời quản trị ..........................................................................50

KẾT LUẬN .............................................................................................................51
1.

Kết quả tự đánh giá ...................................................................................51

2.

Kết luận ......................................................................................................51

TÀI LIỆU THAM KHẢO .....................................................................................53

Trang 6


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

DANH MỤC TỪ VIẾT TẮT, THUẬT NGỮ
Giải nghĩa

STT

Từ viết tắt, thuật ngữ

1

CSDL

2

ASP

3

ASP.NET

Active Server Page Dot NET

4

SQL

Structured Query Language

5

JQUERY

Một thư viện mã Javascript

6

AJAX

Asynchronous JavaScript and XML

7

COM

Component Object Model

8

DCOM

9

DLL

10

ADO.NET

11

VS.NET

12

XML

eXtensible Markup Language

13

CSS

Cascading Style Sheet

14

URL

Uniform Resource Locator

15

HTML

HyperText Markup Language

16

CLR

Common Language Runtime

17

IDE

Integrated Development Environment

18

XHTML

19

W3C

World Wide Web Consortium

20

HTTP

Hyper Text Transfer Protocol

21

DHTML

22

XAML

Cơ sở dữ liệu
Active Server Page

Distributed Component Object Model
Dynamic Link Library
ActiveX Data Object Dot NET
Visual Studio.NET

eXtensible HyperText Markup Language

Dynamic HyperText Markup Language
eXtensible Application Markup Language

Trang 7


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

DANH MỤC HÌNH VẼ, ĐỒ THỊ
Hình 1.1
Hình 1.2
Hình 1.3
Hình 1.4
Hình 1.5
Hình 2.1
Hình 2.2
Hình 2.3
Hình 2.4
Hình 2.5
Hình 2.6
Hình 2.7
Hình 2.8
Hình 3.1
Hình 3.2
Hình 3.3
Hình 3.4
Hình 3.5
Hình 3.6
Hình 3.7
Hình 4.1
Hình 4.2
Hình 4.3
Hình 4.4
Hình 4.5
Hình 5.1
Hình 5.2
Hình 5.3

Hình 5.4

Quá trình xử lý tập tin ASPX…………………………..…….....…...13
Cấu trúc trang ASP.NET…………………………….…………...….14
Cấu trúc trang ASP.NET……………………………….……………15
Cấu trúc một webform………………………………………....…....15
Sơ đồ thể hiện tính đồng bộ của Ajax………………………….…....22
Biểu đồ phân cấp chức năng : Hệ thống Website………………..….29
Biểu đồ phân cấp chức năng : Người quản trị…………………..…...30
Biểu đồ phân cấp chức năng : Thành viên Website………….……...30
Biểu đồ luồng dữ liệu : Mức ngữ cảnh………………………….…..31
Biểu đồ luồng dữ liệu : Mức đỉnh………………….………………..31
Biểu đồ luồng dữ liệu mức dưới đỉnh : Chức năng cập nhật…….….32
Biểu đồ luồng dữ liệu mức dưới đỉnh : Chức năng tìm kiếm……….32
Biểu đồ luồng dữ liệu mức dưới đỉnh : Chức năng đăng ký
thành viên……………………………………………………….…...33
Bảng tbuser………………………………………………………….36
Bảng admin………………………………………………….………36
Bảng BANTIN…………………………………………………........37
Bảng LINHVUC………………………………………….………....37
Bảng lang………………………………………………….………...38
Bảng COMMENT………………………………………….…....…..38
Mơ hình RelationShip của CSDL……………………………….…..39
Đặc tả giao diện trang chủ (Index.aspx)…………………………….40
Đặc tả giao diện trang đăng ký…………………………….……..….42
Đặc tả giao diện trang xem, nhập, sửa bài viết…………………...…43
Đặc tả giao diện trang quản lý thành viên……………………….….44
Đặc tả giao diện trang gửi bài viết…………………………….…….45
Giao diện tiếng Việt của Website……………………………….…..46
Giao diện tiếng Anh của Website……………………………….…..47

Giao diện trang chủ từng lĩnh vực…………………………….…….48
Giao diện trang quản trị………………………………………….….49

Trang 8


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

LỜI NĨI ĐẦU
Cơng nghệ thơng tin thực sự đã trở thành một phần không thể thiếu trong đời
sống của con người. Đặc biệt trong thời gian gần đây là sự phát triển chóng mặt
các mặt cơng nghệ. Những cơng nghệ mới ra đời một cách nhanh chóng và liên
tục. Để khơng bị lạc hậu trong q trình phát triển của thời đại mới, việc nắm bắt
các thông tin về công nghệ mới của mọi người trở nên cần thiết hơn bao giờ hết.
Đồ án “Tìm hiểu ASP.NET xây dựng Website tin tức đa ngơn ngữ” phần
nào giúp mọi người có thể có một cái nhìn tổng quan về sự biến đổi của thế giới
công nghệ hàng ngày. Website được xây dựng trên hệ quản trị SQL server 2005 và
bộ phát triển .NET MS Visual studio 2008, bên cạnh đó đề tài cịn tìm hiểu thêm
về cơng nghệ website ASP.NET và thư viện Jquery, công nghệ Ajax.
Cấu trúc đồ án như sau :
Chương 1. Khảo sát hệ thống
Trong chương này, chủ yếu giới thiệu bài tốn xây dựng website tin tức
cơng nghệ một cách tổng quát, mô tả cơ cấu tổ chức, tìm hiểu quy trình hoạt động
của hệ thống, qua đó đánh giá về hệ thống hiện tại. Đồng thời trong phần này cũng
tìm hiểu về cơng nghệ ASP.NET, ngơn ngữ lập trình C# và Microsoft.NET, thư
viện jquery, cơng nghệ ajax được sử dụng để triển khai bài toán.
Chương 2, 3. Phân tích hệ thống, thiết kế cơ sở dữ liệu Website tin tức công
nghệ
Trong chương này thực hiện quá trình phân tích, thiết kế hệ thống và triển
khai xây dựng Website tin tức công nghệ.

Trang 9


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

Chương 4, 5. Đặc tả giao diện và giao diện chính của Website tin tức cơng
nghệ
Chương này giới thiệu qua về giao diện và một số tính năng của website.
Và cuối cùng là kết luận của đồ án.
Đồ án này được hồn thành nhờ sự giúp đỡ tận tình, chu đáo của ThS. Cao
Thanh Sơn. Em xin bày tỏ lòng biết ơn sâu sắc tới thầy Cao Thanh Sơn cùng các
thầy cô trong tổ Các Hệ Thống Thông Tin đã góp ý giúp em thực hiện đồ án này.
Do nhiều yếu tố khách quan và do tầm hiểu biết chưa sâu sắc, đồ án tốt
nghiệp chắc chắn còn nhiều sai sót và hạn chế. Em rất mong được sự góp ý chân
thành của thầy cô và các bạn.
Em xin chân thành cảm ơn !
Sinh viên thực hiện:
Nguyễn Hồng Hịa

Trang 10


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

CHƢƠNG 1. KHẢO SÁT HỆ THỐNG
1.1 Tổng quan về ASP.NET
1.1.1 Giới thiệu ngôn ngữ ASP.NET
Hiện tại ASP 3.0 đã và đang trở thành kịch bản được nhiều người sử
dụng để thiết kế ứng dụng thương mại điện tử dưới nhiều hình thức khác

nhau. Chúng được sự hỗ trợ mạnh của ngơn ngữ lập trình C#, VB.NET… và
cơ sở dữ liệu SQL Server 2005 cùng với sự ra đời của công nghệ COM và
DCOM, ứng dụng trở nên hoàn hảo và ưu việt hơn trong q trình trao đổi
thơng tin trên mạng Internet và Intranet.
Tuy nhiên, Microsoft đã và đang nổ lực cho một cơng nghệ Web xử lý
phía máy chủ hồn tồn mới đó là ASP.NET độc lập với mọi trình duyệt.
Điều này có nghĩa là trình duyệt khơng cần phải cài đặt bất kỳ công cụ hỗ trợ
nào để duyệt trang Web dạng ASP.NET(.aspx). Với kỹ thuật cho phép mọi
thực thi đều nằm trên trình chủ (Server), có nghĩa là trình duyệt xử lý nhiều
vấn đề cùng một lúc cho nhiều người dùng, chính vì vậy địi hỏi cấu hình máy
chủ có cấu hình mạnh và địi hỏi băng thơng có khả năng truyền dữ liệu với
khối lượng lớn và tốc độ truy cập nhanh.
ASP.NET được thiết kế tương thích với các phiên bản ASP trước đó.
Bạn có thể triển khai ứng dụng phát triển bằng ASP.NET chung với ứng dụng
phát triển bằng ASP trên cùng một máy chủ mà khơng cần thay đổi cấu hình
của ứng dụng ASP.
Những ngôn ngữ được dùng để viết ASP.NET là VBScript, Jscript, C#.
Tùy thuộc vào khai báo chỉ mục trong đối tượng chỉ dẫn đầu trang ASP.NET,
bạn có thể chỉ rõ ngơn ngữ lập trình bạn sử dụng để xây dựng trang
ASP.NET.
Cơng nghệ ASP.NET sẽ hướng các lập trình viên Web vào quỹ đạo của
chúng bằng các lý do sau :
- Độc lập ngôn ngữ cho phép bạn không biên dịch ngôn ngữ, thực hiện
tối ưu các ngôn ngữ kết hợp.

Trang 11


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

- Dễ phát triển: ASP.NET cho phép bạn khai báo, viết mã và đơn giản
hóa vấn đề.
- Tách mã và nội dung ra hai phần khác nhau: Trong mở Webform bạn
có thể khai báo một số thủ tục trên tập tin với các tên mở rộng.
- Tính mềm dẻo và khả năng nâng cấp: Cho phép chúng ta quản lý trạng
thái của các Sesion và tạo form trên một ứng dụng sử dụng hệ thống Server.
- Hỗ trợ nhiều trình khách có thể tự động nhận dạng trình khách để hiện
thị cho phù hợp.
- Thay vì sử dụng mơ hình DLL, COM, DCOM trước đây, trong trường
hợp ứng dụng sử dụng cơng nghệ ASP.NET bạn có thể sử dụng dịch vụ tương
tự có tên là Web Services. [1]
1.1.2

Ưu điểm của ASP.NET

ASP.NET có nhiều ưu điểm hơn các nền tảng khác khi dùng nó để tạo
ứng dụng Web. Có thể phần lớn những ưu điểm quan trọng của nó đi kèm với
các máy chủ Windows và các cơng cụ lập trình Windows. Ứng dụng web
được tạo bởi ASP.NET được tạo ra, bắt lỗi và triển khai rất dễ dàng thông qua
các tác vụ có thể thực thi trọn v n trong một môi trường phát triển duy nhất Visual Studio. NET.
Với những nhà phát triển ứng dụng Web, ASP.NET bộc lộ những ưu
điểm sau đây :
- Những phần thực thi được của ứng dụng Web được biên dịch, vì vậy
chúng thực thi nhanh hơn là các kịch bản thông dịch.
- Các cập nhập ngay lập tức giúp cho việc triển khai các ứng dụng Web
mà không phải khởi động lại máy chủ.
- Truy cập tới .NET Framework, có thể đơn giản hóa nhiều khía cạnh
trong lập trình Windows.
- Sử dụng nhiều những hiểu biết về ngơn ngữ lập trình C#, VB, vốn đã
được tăng cường để hỗ trợ lập trình hướng đối tượng.

Trang 12


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

- Giới thiệu ngơn ngữ lập trình mới mà nó cung cấp khả năng an toàn
kiểu, hướng đối tượng, so với ngơn ngữ lập trình C.
- Tự động quản lý trạng thái để điều khiển trang Web (được gọi là
Server Controls) vì vậy chúng có gì đó giống với các Windows Controls.
- Các tính năng bảo mật được xây dựng sẵn thông qua máy chủ
Windows hoặc thông qua các phương thực xác nhận/phân quyền khác.
- Tích hợp chặt chẽ với ADO.NET để cung cấp các truy xuất CSDL và
các công cụ thiết kế CSDL trực quan trong bộ VS.NET.
- Hỗ trợ đầy đủ XML, CSS và các chuẩn Web đã được thiết lập hoặc mới
khác.
- Các tính năng sẵn có để đệm các trang web thường xuyên được yêu cầu
trên máy chủ, các nội dung bản địa hóa cho các ngơn ngữ và trao đổi, nhận ra
khả năng tương thích trình duyệt. [7]
Cơ chế hoạt động
Khi Web server nhận được u cầu từ phía client, nó sẽ tìm kiếm tập
tin được yêu cầu thông qua chuỗi URL được gởi về, sau đó, tiến hành xử lý
theo sơ đồ sau:

Trang 13


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

Hình 1.1
Webform trong ASP.NET

Để xây dựng ứng dụng web, ASP.NET cung cấp sẵn cho các nhà lập
trình rất nhiều lớp ngay khi cài đặt .NET framework. Trong số này có một lớp
đặc biệt quan trọng là Page. Mỗi lớp Page sẽ trình bày một trang tài liệu –
tương ứng với một window – và được gọi là một webform. Webform là một
công nghệ cho phép xây dựng các trang web trong đó có thể lập trình được.
Các trang này gọi là ASP.NET web form pages hay ngắn gọn là webform.
Các trang web xây dựng bằng ASP.NET sẽ không phụ thuộc vào trình duyệt
(tức là trình duyệt nào cũng cho kết quả như nhau và hiển thị giống nhau).
Cấu trúc trang ASP.NET
Một trang ASP.NET bao gồm cả phần giao diện người dùng và phần

Trang 14


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

xử lý logic bên trong. Giao diện người dùng chịu trách nhiệm hiển thị các
thông tin và tiếp nhận dữ liệu từ người dùng, trong khi đó phần xử lý (lập
trình) đảm nhiệm việc điều khiển sự tương tác của người dùng với trang web.
Phần giao diện người dùng bao gồm một file chứa ngôn ngữ đánh dấu như
HTML hoặc XML và server controls chẳng hạn. File này được gọi là một
trang (Page) và có đi mở rộng là aspx. Phần đáp ứng các tương tác của
người dùng với trang web được thực hiện bởi một ngơn ngữ lập trình chẳng
hạn như Visual Basic.NET và C#. Chúng ta có thể thực hiện việc viết code
bằng bất kỳ ngôn ngữ lập trình nào được hỗ trợ bởi CLR ở ngay trong trang
ASPX hoặc tách ra một file riêng. File tách riêng này được gọi là file Code
Behind hay mới đây gọi là Code file. Đuôi mở rộng của Code file là .VB
(Nếu dùng ngôn ngữ Visual Basic) hoặc .CS (nếu dùng ngơn ngữ C#).

Hình 1.2

Trang 15


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

Cách lưu trữ này được minh họa qua một ứng dụng cụ thể dưới đây.

Hình 1.3
Trong đó, trang web thứ nhất Default2.aspx chứa cả code (C#) và giao
diện (HTML) còn trang web thứ hai đặt code và giao diện ra 2 file riêng biệt.
default.aspx và default.cs.

Hình 1.4
Một webform bao gồm 2 thành phần:
Trang 16


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

- Thành phần giao diện (trang thisfile.aspx).
- Thành phần xử lý (lập trình) thisfile.cs.
1.2 Tổng quan về ngơn ngữ lập trình C#
Ngơn ngữ C# có khoảng 80 từ khóa và hơn mười kiểu dữ liệu được xây
dựng sẵn. Tuy nhiên, ngơn ngữ C# có ý nghĩa cao khi thực thi những khái
niệm lập trình hiện đại. C# bao gồm tất cả những hỗ trợ cho cấu trúc, thành
phần component, lập trình hướng đối tượng. Những tính chất đó hiện diện
trong một ngơn ngữ lập trình hiện đại.
Ngơn ngữ C# được xây dựng trên nền tảng của hai ngôn ngữ mạnh
nhất là C++ và Java.

Ngôn ngữ C# được phát triển bởi Microsoft, trong đó người dẫn đầu
là Anders Hejlsberg và Scott Wiltamuth. Cả hai người này điều là những
người nổi tiếng, trong đó Anders Hejlsberg được biết đến là tác giả của Turbo
Pascal, một ngơn ngữ lập trình PC phổ biến. Ông đứng đầu nhóm thiết kế
Borland Delphi, một trong những thành công đầu tiên của việc xây dựng môi
trường phát triển tích hợp (IDE) cho lập trình client/server. Phần cốt lõi hay
của bất cứ ngơn ngữ lập trình hướng đối tượng là sự hỗ trợ của nó cho việc
định nghĩa và làm việc với những lớp (class). Những lớp định nghĩa những
kiểu dữ liệu mới, cho phép người phát triển mở rộng ngơn ngữ để tạo mơ hình
tốt hơn để giải quyết vấn đề. [3]
1.3 Thƣ viện Jquery
Jquery là một thư viện Javascript kiểu mới, giúp chúng ta đơn giản hóa
cách viết Javascript và tăng tốc độ xử lý các sự kiện trên trang web. Để thực
hiện một chức năng nào đó, thay vì viết vài chục dịng lệnh JavaScript chán

Trang 17


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

ngắt, với Jquery chỉ cần vài dòng lệnh ngắn gọn.
o Tác dụng của Jquery :
 Truy cập (access) các phần tử (elements) trong nội dung trang web
(document)
 Thay đổi hình thức/giao diện (appearance) của trang web: Thay đổi
class hoặc style riêng lẻ..
 Thay đổi nội dung (content) trang web.
 Tương tác với người dùng.
 Hiệu ứng động: fades, wipes, ...
 Lấy thông tin từ Server mà không cần load lại trang web (AJAX)

 Đơn giản hoá tác vụ của JavaScript
o Cách dùng :
Cần có file thư viện của jquery : jquery.js down ở trang chủ
jquery.com cần attach file js trên vào file (htm,php,aspx...) muốn sử dụng.
Sửa thuộc tính src trong thẻ script để trỏ tới jquery.js. Ví dụ, nếu jquery.js ở
cùng thư mục với tệp HTML, có thể dùng:
<script type="text/javascript" src="jquery.js"></script>
Chạy mã lúc Document Ready (trang đã sẵn sàng). Có thể thấy rằng hầu hết
các lập trình viên Javascript kết thúc mã thực thi bằng cách thêm các dòng mã
vào script, tương tự như sau:
window.onload = function(){ ... }
Các mã bên trong đó sẽ được thực thi khi trang được tải xong. Khơng cịn gì
phải bàn, tuy nhiên, mã Javascript khơng chạy cho đến khi tất cả các hình ảnh
trong trang được tải xong (kể cả banner quảng cáo). Lý do cho việc sử dụng
window.onload là để chắc chắn rằng HTML 'document' phải được tải xuống

Trang 18


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

hết, sau đó mới chạy mã kia. Để giải quyết, jQuery có câu lệnh đơn giản,
được biết như ready event:
$(document).ready(function(){
// Mã javascrips
});
Mã này kiểm tra document và đợi cho đến khi nó sẵn sàng để sử dụng - theo ý
muốn. Hãy lấy đoạn mã mẫu ở trên và cho vào tài liệu HTML . Các ví dụ cịn
lại của jQuery sẽ được đặt bên trong phần callback của hàm này, chúng sẽ
được thực thi khi tài liệu sẵn sàng.

Trong hầu hết các ví dụ được sử dụng trong loạt bài này thì có 3 thành
phần được sử dụng nhiều nhất đó chính là tài liệu HTML, Stylesheet CSS và
một tài liệu JavaScript để thực hiện lệnh trên đó. Trong ví dụ đầu tiên chúng ta
sẽ sử dụng một tài liệu HTML đơn giản với một header, sidebar, content và
footer. Trong phần content sẽ có 3 đoạn văn bản và một số class có sẵn. Tất
nhiên phải sử dụng CSS để định dạng cho tài liệu HTML này. Thấy rằng, thư
viện jQuery được đặt ở dưới Stylesheet. Đây là một điểm rất quan trọng mà
cần lưu ý là thứ tự của các file khi gọi. Ban đầu phải là CSS load trước, khi
trang web đã load xong phần CSS thì chúng ta mới thêm vào phần thư iện
jQuery cuối cùng mới là code jQuery chúng ta tự viết ra. Nếu không khi code
jQuery sẽ không làm việc đúng như mong đợi nếu thư viện jQuery chưa được
load. Bây giờ mở trình soạn thảo code lên và tạo một file tên là first-jquery.js
và file này đã được chúng ta chèn vào trong dòng code:
<script src=”first-jquery.js” type=”text/javascript”></script>
Gõ vào file vừa tạo 3 dòng code như sau:

Trang 19


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

$(document).ready(function() {
$('.text').addClass('important');
});
Thao tác cơ bản nhất của jQuery là chọn một phần nào đó của tài liệu
HTML. tiến hành nó bằng cách sử dụng hàm $(). Thường thì nằm giữa dấu
ngoặc () là một chuỗi dưới dạng tham số, nó có thể là những CSS Selectors.
Trong ví dụ này chúng ta muốn tìm tất cả những thành phần nào có
class=”text”, cú pháp giống như khi viết code CSS vậy. Tất nhiên ở những bài
sau chúng ta sẽ tham khảo thêm nhiều những lựa chọn khác hay hơn nữa. [4]

1.4 Ajax
Ajax là viết tắt của Asynchronous JavaScript and XML - kỹ thuật kết
hợp hai tính năng mạnh của JavaScript được các nhà phát trển đánh giá rất
cao :
o Gửi yêu cầu (request) đến máy chủ mà không cần nạp lại trang
o Phân tách và làm việc với XML
Các ứng dụng Ajax xoay quanh một tính năng có tên là
XMLHttpRequest. Ajax là sự phối hợp một loạt các công nghệ đang thu hút
sự quan tâm của giới công nghiệp trong thời gian gần đây. Đó chính là :
o Trình bày trang Web dựa trên XHTML và CSS, các chuẩn của W3C,
được
Firefox (Mozilla), Safari (Apple), Opera, Netscape 8.0 (nhân Firefox) hỗ
trợ rất tốt.

Trang 20


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

o Biểu diễn động và tương tác sử dụng Document Object Model.
o Trao đổi và xử lý dữ liệu dùng XML.
o Thu hồi dữ liệu bất đối xứng dùng dùng XMLHttpRequest.
Hoạt động của ajax :
Thơng thường ứng dụng máy tính rồi sẽ được lưu và chạy hoàn toàn trên
web thay vì trong ổ cứng. Dù vậy, viễn cảnh đó vẫn chưa thể xảy ra do ứng
dụng web bị hạn chế bởi nguyên lý rằng tất cả các thao tác phải được thực
hiện thông qua HTTP (HyperText Transfer Protocol - Giao thức truyền tải
qua siêu liên kết). Những hoạt động của người sử dụng trên trang web sẽ tạo
ra một yêu cầu HTTP tới server. Máy chủ thực hiện một số khâu xử lý như
lấy lại dữ liệu, tính tốn, kiểm tra sự hợp lệ của thông tin, sửa đổi bộ nhớ, sau

đó gửi lại một trang HTML hồn chỉnh tới máy khách. Về mặt kỹ thuật,
phương pháp này nghe có vẻ hợp lý nhưng cũng khá bất tiện và mất thời gian,
bởi khi server đang thực hiện vai trò của nó thì người phải chờ đợi. Để khắc
phục hạn chế trên, các chuyên gia phát triển giới thiệu hình thức trung gian cơ chế xử lý AJAX - giữa máy khách và máy chủ. Ajax cho phép tạo ra một
Ajax Engine nằm giữa giao tiếp này. Điều này giống như việc tăng thêm một
lớp giữa cho ứng dụng để giảm q trình "đi lại" của thơng tin và giảm thời
gian phản ứng. Khi đó, các yêu cầu gửi resquest và nhận response do Ajax
Engine thực hiện. Thay vì trả dữ liệu dưới dạng HTML và CSS trực tiếp cho
trình duyệt, web server có thể gửi trả dữ liệu dạng XML và Ajax Engine sẽ
tiếp nhận, phân tách và chuyển hóa thành XHTML+CSS cho trình duyệt hiển
thị. Việc này được thực hiện trên client nên giảm tải rất nhiều cho server,
đồng thời người sử dụng cảm thấy kết quả xử lý được hiển thị tức thì mà

Trang 21


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

không cần nạp lại trang. Mặt khác, sự kết hợp của các công nghệ web như
CSS và XHTML làm cho việc trình bày giao diện trang web tốt hơn nhiều và
giảm đáng kể dung lượng trang phải nạp. Và thay vì tải lại (refresh) tồn bộ
một trang, nó chỉ nạp những thơng tin được thay đổi, cịn giữ ngun các phần
khác. Vì thế, khi duyệt một trang hỗ trợ AJAX, người sử dụng khơng bao giờ
nhìn thấy một cửa sổ trắng (blank) và biểu tượng đồng hồ cát - dấu hiệu cho
thấy máy chủ đang thực hiện nhiệm vụ. Ví dụ, trong một website ảnh, với ứng
dụng truyền thống, toàn bộ trang chứa các ảnh sẽ phải mở lại từ đầu nếu có
một thay đổi nào đó trên trang. Cịn khi áp dụng AJAX, DHTML chỉ thay thế
đoạn tiêu đề và phần vừa chỉnh sửa, do vậy tạo nên các giao dịch nhanh
chóng. "Mọi thao tác của người sử dụng sẽ gửi lệnh JavaScript tới bộ xử lý
AJAX, thay vì tạo ra một yêu cầu HTTP (HTTP request) và truy vấn tới máy

chủ", Jesse James Garrett đã ghi trong bài viết đầu tiên định nghĩa về thuật
ngữ này. "Nếu cần gì từ server, như tải về bổ sung mã giao diện hay nhận dữ
liệu mới, AJAX sẽ truyền yêu cầu tới máy chủ một cách không đồng bộ,
thông thường sử dụng XML, mà không làm gián đoạn sự tương tác của người
dùng với ứng dụng web". Tính khơng đồng bộ của các ứng dụng Ajax được
thể hiện trong hình dưới đây.

Trang 22


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

Hình 1.5 Sơ đồ thể hiện tính khơng đồng bộ của Ajax

Điển hình của ứng dụng AJAX bao gồm những trích dẫn chứng khốn
được cập nhật liên tục mỗi giây, với màu xanh và đỏ nhấp nháy khi giá dao
động. Microsoft cũng ứng dụng Ajax trong bản cập nhật Hotmail và đang xây
dựng chương trình mới hỗ trợ sự phát triển Ajax. Công nghệ thay thế XAML
sẽ cho phép nhiều ứng dụng phong phú hơn hoạt động trên trình duyệt. Tuy
vậy, Ajax chưa thể thực hiện tất cả mọi thứ. Những ứng dụng phụ thuộc nhiều
vào máy tính cố định như Photoshop của Adobe sẽ khơng xuất hiện sớm trên
trình duyệt. Ngay cả Google cũng phải tạo một phần mềm bản đồ trên desktop
(Google Earth) và yêu cầu tải chương trình về để có thể hiển thị hình ảnh 3D
và thực hiện một số tính năng cải tiến khác. Hơn nữa, ứng dụng web đòi hỏi
phải liên tục kết nối với Internet, khiến cơng việc trên sẽ trở nên khó khăn nếu
bị gián đoạn. [4]

Trang 23

TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

1.5 Khảo sát hiện trạng của Website tin tức
1.5.1 Mục đích u cầu của Website
Sau khi được học và tìm hiểu về ngơn ngữ ASP.NET, bằng khả năng
thực tế có được, em đã xây dựng Website tin tức, đây là trang web sẽ giới
thiệu những tin tức công nghệ mới nhất trên thế giới cũng như ở Việt Nam.
Qua tìm hiểu về các Website trên mạng như :
-
-
-
Em đã rút ra được các nhận xét sau :
- Đối với trang thì có đặc điểm như
sau :
 Thông tin đa dạng từ nhiều lĩnh vực liên quan đến cơng nghệ ở trong
và ngồi nước.
 Các thơng tin được cập nhật liên tục, cho phép chúng ta xem theo chủ
đề, theo ngày tháng trước đấy…
 Màu sắc hài hoà, các chức năng rõ ràng dễ sử dụng…
 Bên cạnh đó cũng có những bài viết, những tin tức tồn tại rất lâu ngày.
- Đối với trang :
 Thông tin về công nghệ được cập nhật liên tục.
 Giao diện không được bắt mắt như trang thongtincongnghe.com.

Trang 24


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

Tiến hành phỏng vấn với một số độc giả thường xuyên quan tâm đến tin

tức công nghệ, đa phần thường vào trang thongtincongnghe.com. Vì tin tức
ở trang này đa dạng hơn so với các trang web khác.
Qua khảo sát và tham khảo ý kiến của các bạn đọc, em quyết định sẽ xây
dựng một Website tin tức dựa vào trang thongtincongnghe.com. [6]
1.5.2 Yêu cầu của hệ thống
-

Nguồn thông tin đa dạng và sống động.

-

Giao diện trang web thân thiện, dễ nhìn, dễ sử dụng, màu sắc hài hịa.

-

Thơng tin được cập nhật và sửa đổi thường xuyên.

-

Cho phép tìm kiếm một cách nhanh chóng.

-

An tồn bảo mật dữ liệu.

1.6 Tổng kết
Từ yêu cầu của hệ thống em đưa ra một số yêu cầu chi tiết về website như
sau:
- Hiển thị các danh mục.
- Hiển thị chi tiết về thông tin trong danh mục.

- Hiển thị kết quả của việc tìm kiếm, đăng ký, đăng nhập.
- Hiển thị các thông tin mới diễn ra hằng ngày.
1.6.1

Chức năng User

Cho phép đăng ký làm thành viên.
Cho phép sửa đổi.

Trang 25


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

Cho phép xem tin tức, tìm kiếm thơng tin.
Cho phép Post các bài viết phản hồi.
1.6.2

Đối với người quản trị

- Quản lý các User: xóa, sửa, nhập thêm User, Admin.
- Cập nhật mới các thông tin liên quan, sửa thông tin, xóa thơng tin.
- Kiểm tra, chỉnh sửa các bài Post lên Website và sau đó đăng bài.
- Hiển thị thơng tin lên nhóm tin, chun mục.
1.6.3

u cầu của hệ thống mới

- Hình thức thơng tin đa dạng và sống động.
- Giao diên thân thiện, dễ nhìn, màu sắc khơng đối lập.

- Cung cấp thông tin và phát triển hoạt động liên tục, không ngừng.
- Thông tin được cập nhật và sửa đổi thường xuyên.
- Có khả năng cập nhật, sửa, xố.
- Có khả năng tra và tìm kiếm một cách nhanh chóng.

- An tồn dữ liệu.

Trang 26


TÌM HIỂU ASP.NET XÂY DỰNG WEBSITE TIN TỨC ĐA NGƠN NGỮ

CHƢƠNG 2. PHÂN TÍCH HỆ THỐNG
2.1 Yêu cầu chi tiết về Website
- Hiển thị các danh mục.
- Hiển thị chi tiết về thơng tin có trong danh mục.
- Hiện thị kết quả của việc tìm kiếm, đăng ký , đăng nhập.
- Hiện thị được các thông tin mới diễn ra hàng ngày.
2.1.1

Đối với người truy cập Website với chức năng User

- Cho phép đăng ký thành viên.
- Cho phép xem tin tức, tìm kiếm thơng tin.
- Cho phép Post các bài bình luận về tin tức.
2.1.2

Đối với người quản trị

- Quản lý các user: xoá, sửa, nhập thêm User, Admin.

- Cập nhật mới các thông tin liên quan, sửa thông tin , xố thơng tin.
- Kiểm tra, chỉnh sửa các bài Post lên của user và sau đó đăng bài.
- Hiển thị thơng tin lên theo nhóm tin, chun mục.
2.2 Biểu đồ phân cấp chức năng, biểu đồ luồng dữ liệu
2.2.1

Mô tả các chức năng

Danh sách các chức năng yêu cầu của Website tin tức:


Đầu ra:
- Hiển thị thông tin.
- Hiện thị thông tin theo chủ đề.
- Thông tin hiển thị theo khn có sẵn.

Trang 27