TỔNG QUAN

Một phần của tài liệu Xây dựng ứng dụng RSS Reader sử dụng công nghệ Web Service và AJAX (Trang 52 - 89)

3.1.1. Giới thiệu chung

Trong 2 chương đầu tiên, chúng ta đã thấy được ưu điểm của riêng rẽ từng công nghệ. RSS giúp chúng ta có thể thu thập thông tin dễ dàng với định dạng XML, AJAX giúp chúng ta xây dựng ứng dụng với khả năng truyền và nhận dữ liệu bất đồng bộ, tăng tốc cho ứng dụng, Web service giúp chúng ta xây đựng được hệ thống các ứng dụng có khả năng tái sử dụng và khả chuyển về nền tảng. Với sự hỗ trợ của Apache Axis2 server, có thể dễ dàng xây dựng và upload các service cũng như với thư viện của mình, giúp cho client dễ dàng làm việc với các service. Tất cả những thành phần này, sẽ giúp chúng ta tạo nên ứng dụng RSS Reader + AJAX + Web service.

Bây giờ, chúng ta sẽ xem xét các mô hình chung của các RSS Reader hiện tại trên thế giới. Có thể dễ dàng thấy đa số các RSS Reader hiện tại có 2 đặc điếm sau:

Thứ nhất là các ứng dụng dạng Desktop Application, được cài đặt và chạy trên máy của người sử dụng. Loại này cần tới các file thư viện DLL được cài đặt trên máy, như vậy sẽ không có tính liên kết cao.

Thứ hai là các ứng dụng thường được tạo ra một cách khá khép kín với các hệ thống thư viện xác định cho riêng mình: Java application với các file thư viện dành riêng cho java, .Net Application với các file thư viện dành cho .Net.(Hình 3.1)

Hình 3.1 Các ứng dụng Rss Reader thông thường

Với xu hướng công nghệ web 2.0 hiện nay, và kiến trúc SOA đang được phát triển thì cả 2 đặc điểm trên đều đi ngược lại dòng chảy. Vì vậy khi kết hợp các ứng công nghệ trên lại với nhau để xây dựng lên ứng dụng sẽ phù hợp với xu hướng của thế giới. (Hình 3.2)

RSS Lib for .Net

RSS Lib for Java RSS

Hình 3.2 Ứng dụng RSS Reader with Web service

3.1.2 Yêu cầu đặt ra cho ứng dụng

Ứng dụng được xây dựng trên cơ sở các công nghệ mới, vì vậy mục đích mà ứng dụng muốn đạt tới là thể hiện được các điểm mạnh của các công nghệ đó.

• Thể hiện được điểm mạnh của AJAX : Khả năng truyền dữ liệu bất đồng bộ với server. Tăng tốc độ thực thi của ứng dụng, tạo cảm giác tương tác thực cho người sử dụng, giống như khi chạy các ứng dụng trên desktop.

• Thể hiện ưu điểm của web service: Ứng dụng sẽ có phần thu thập dữ liệu từ trên Internet được xây dựng thành dịch vụ, để có thể sử dụng từ các chương trình được viết bằng các ngôn ngữ khác nhau.

3.1.3 Mô hình ứng dụng

Theo những yêu cầu đặt ra, ứng dụng sẽ có 2 module với 2 nhiệm vụ: 1. Web service Module:

 Nhận các yêu cầu về địa chỉ các trang cung cấp thông tin rss và trả về là dữ liệu rss của các nguồn đó (đã có sự sắp xếp và phân loại theo chủ đề, theo ngày tháng)  Nhận các yêu cầu về quản lý các danh mục thông tin, trả về dữ liệu theo các yêu

cầu đó, và dưới dạng cây thư mục (Tree).  Dữ liệu vào: Request từ client

 Kho dữ liệu : Internet web site, Database store  Dữ liệu ra : Thông tin RSS

2. AJAX Client Module

 Hiển thị danh mục các nguồn cung cấp tin

 Hiển thị thông tin thu được từ web service trên gia diện

 Cung cấp các chức năng liên quan tới quản lý danh mục nguồn thông tin: tạo mới, sửa, xóa.

RSS Lib RSS

Mô hình của ứng dụng được mô tả như hình 3.3.

Hình 3.3 Mô hình luồng thông tin của ứng dụng

User Iterface

(Html, jsp…)

Server

Servlet Web Service

Add Feed Add Cateogry Get Cateogry Get Feed Get Feeds by Date Get All Feeds

RSS provider BBC CNN Google Get and Generate Menu Get and Generate Feed content RSS info Database

Apache Axis server Apache tomcat

3.1.4 Kiến trúc ứng dụng

Với mô hình được phân tích và minh họa trên hình 3.3, dựa vào những công nghệ và hệ thống đã nghiên cứu, kiến trúc của ứng dụng được mô tả như trên hình 3.4.

Hình 3.4 Mô hình kiến trúc của ứng dụng

Như vậy ứng dụng sẽ gồm AJAX Client, Java Servlet và Java Web service. Trong đó, AJAX và Java Servlet tương tác với nhau thông qua QueryString, còn Java Servlet tương tác với Web service bằng SOAP over HTTP.

3.2 SƠ ĐỒ PHÂN CẤP CHỨC NĂNG

Sơ đồ phân cấp chức năng liệt kê đầy đủ các chức năng của hệ thống.

Hình 3.5 Sơ đồ phân cấp chức năng (Function Diagram)

Hệ thống ứng dụng RSS Reader

Xử lý trên WebService

Server Xử lý tại WebService Client

Nhậncategory Nhận một feed xác định Nhận các feed sắp xếp theo category Nhận các feed sắp xếp theo ngày

Gửi yêu cầu và nhận phúc đáp từ WebService

Chuyển đổi định dạng dữ liệu

Hiển thị dữ liệu và tương tác với người sử dụng

Thêm hoặc xoá bớt một

feed

Thêm hoặc xoá bớt một

3.3 SƠ ĐỒ MỨC NGỮ CẢNH

Sơ đồ mức ngữ cảnh (Context Diagram) của ứng dụng được thể hiện trên hình 3.6. Có thể thấy được đối tượng sử dụng hệ thống và đầu vào đầu ra của nó. Kho dữ liệu ngoài: Thông tin từ các web site trên Internet. Đối tượng sử dụng hệ thống: Người sử dụng.

Hình 3.6 Sơ đồ luồng dữ liệu mức ngữ cảnh (Context Diagram)

3.4 SƠ ĐỒ MỨC DƯỚI ĐỈNH

Sau khi có sơ đồ mức đỉnh, đi vào phân tích chi tiết sâu hơn, ta có sơ đồ mức dưới đỉnh và các sơ đồ mức con, các sơ đồ này càng chi tiết, thì các chức năng của hệ thống càng được sáng tỏ.

Hình 3.7 là sơ đồ luồn dữ liệu mức 0.

Hình 3.7 Sơ đồ luồng dữ liệu mức 0 (DFD level 0)

Có thể thấy được vai trò của từng đối tượng trong sơ đồ này (giống như đã miêu tả trong mục 3.1.3). Hình 3.8 và hình 3.9 là sơ đồ luồng dữ liệu phân rã ở mức thấp hơn.

Dữ liệu trên Internet

Người sử dụng 1 Xử lý trên WebServic e Server 2 Xử lý tại WebServic e Client Category Thông tin Thông tin Thông tin Yêu cầu Phúc đáp

Hình 3.8 DFD Function 1 1.1 Nhận 1 Feed Soap Request/Response 1.2 Nhận các Feed theo Category 1.3 Nhận các Feed theo ngày Category Soap Request Soap Request Soap Request Soap Response Soap Response Soap Response Feed Feeds Urls Feeds 1.5 Xoá Feed/ Category 1.4 Thêm Feed/ Category Soap Request Soap Request Soap Response Soap Response

Thêm vào cơ sở dữ liệu

Xoá khỏi cơ sở dữ liệu

Dữ liệu trên Internet Dữ liệu trên Internet

Hình 3.9 là sơ đồ mức 1 của Đối tượng Rss Client

Hình 3.9 DFD (Function 2)

2.1 Gửi yêu cầu

và nhận phúc đáp từ WebService

SOAP yêu cầu/ SOAP phúc đáp

2.2 Chuyển đổi định dạng dữ liệu 2.3 Hiển thị và tương tác với người sử dụng Người sử dụng SOAP SOAP XML XML hoặc HTML Yêu cầu Thông tin QueryString

Mô tả chi tiết các chức năng:

Gửi yêu cầu và nhận phúc đáp từ WebService

Mô tả chung: Gửi SOAP Request lên WebService và nhận SOAP Response từ WebService.

Mô tả chi tiết: Khi người sử dụng gọi một chức năng ở phía giao diện tương tác, servlet WebService Client sẽ được gọi để thực hiện gửi yêu cầu tương ứng cho WebService Server và nhận phúc đáp.

Đầu vào: Yêu cầu của người sử dụng được ký hiệu dưới dạng QueryString gửi tới servlet WebService Client.

Quá trình xử lý: - Nhận và phân tách QueryString để nhận biết các tham số cần thiết

- Dựa vào Method number quy ước thực hiện các chức năng tương ứng.

- Xây dựng và gửi đi SOAP Request cũng như nhận về SOAP Response dưới dạng OMElement.

Đầu ra: SOAP Response.

Chuyển đổi định dạng dữ liệu

Mô tả chung: Chuyển đổi từ dạng dữ liệu WebService Server trả về sang định dạng phía Client cần để hiển thị lên giao diện.

Mô tả chi tiết: SOAP Response nhận về sau khi bóc tách lớp Envelope SOAP bên ngoài sẽ nhận được 1 định dạng XML xác định. Module này thực hiện chuyển định dạng XML nhận được sang dạng XML hay HTML thích hợp để truyền cho phần giao diện thực hiện hiển thị lên Web.

Đầu vào: Nội dung nhận được từ SOAP Response có định dạng XML

Quá trình xử lý: Kết hợp với một file XSLT xác định trong từng trường hợp để tạo ra định dạng XML hoặc HTML tương ứng.

Đầu ra: Dữ liệu dưới dạng XML hoặc HTML cần để hiển thị lên giao diện.

Hiển thị dữ liệu và tương tác với người sử dụng

Mô tả chung: Nhận yêu cầu của người sử dụng và hiển thị thông tin tương ứng.

Mô tả chi tiết: Khi người sử dụng đưa ra yêu cầu, hệ thống sẽ gửi lên servlet WebService Client, khi kết quả được trả về, giao diện sẽ thực hiện hiển thị lên màn hình.

Các chức năng người sử dụng có thể yêu cầu: - Xem 1 feed xác định.

- Xem các feed sắp xếp theo Category. - Xem các feed sắp xếp theo ngày tháng.

- Xoá/thêm 1 feed. - Xoá/thêm 1 folder.

Đầu vào: Yêu cầu của người sử dụng.

Quá trình xử lý: - Nhận yêu cầu gửi lên servlet.

- Nhận Response dưới dạng thích hợp, hiển thị lên màn hình. Category thực hiện hiển thị bằng JavaScript, feed hiển thị bằng AJAX.

Đầu ra: Thông tin hiển thị lên màn hình.

Nhận 1 feed

Mô tả: Lấy 1 feed xác định

Đầu vào: SOAP Request chứa id của feed đó trong cơ sở dữ liệu.

Quá trình xử lý: - Lấy url của feed từ cơ sở dữ liệu dựa vào id. - Lấy feed trên internet dựa vào url

Đầu ra: SOAP Response chứa nội dung của feed.

Nhận các feed sắp xếp theo Category

Mô tả: Lấy tất cả các feed trong một folder xác định

Đầu vào: SOAP Request chứa id của folder đó trong cơ sở dữ liệu.

Quá trình xử lý: - Lấy các url của các feed từ cơ sở dữ liệu dựa vào id của folder cha.

- Lấy các feed trên internet dựa vào các url

Đầu ra: SOAP Response chứa nội dung của các feed.

Nhận các feed sắp xếp theo ngày tháng

Mô tả: Lấy tất cả các feed trong Category sắp xếp theo ngày tháng

Đầu vào: SOAP Request gọi phương thức getAllByDate

Quá trình xử lý: Lấy tất cá các feed có trong cơ sở dữ liệu từ Internet và sắp xếp theo thời gian

Đầu ra: SOAP Response chứa nội dung của các feed.

Thêm một feed mới

Mô tả: Người sử dụng có thể thêm một feed mới vào Category.

Đầu vào: SOAP Request chứa id của folder cha mà feed thêm vào, tên của feed và url của feed.

Quá trình xử lý: Kiểm tra xem thông tin có hợp lệ không và add vào cơ sở dữ liệu

Đầu ra: SOAP Response chứa true nếu thành công hoặc false nếu không thành công.

Thêm một folder mới

Mô tả: Người sử dụng có thể thêm một folder mới vào Category.

Đầu vào: SOAP Request chứa id của folder cha mà folder thêm vào, tên của folder.

Quá trình xử lý: Kiểm tra xem thông tin có hợp lệ không và add vào cơ sở dữ liệu

Đầu ra: SOAP Response chứa true nếu thành công hoặc false nếu không thành công.

Xoá một feed

Mô tả: Người sử dụng có thể xoá feed trong Category

Đầu vào: SOAP Request chứa id feed cần xoá.

Quá trình xử lý: Kiểm tra xem thông tin có hợp lệ không và update cơ sở dữ liệu

Đầu ra: SOAP Response chứa true nếu thành công hoặc false nếu không thành công.

Xoá một folder

Mô tả: Người sử dụng có thể xoá folder trong Category

Đầu vào: SOAP Request chứa id folder cần xoá.

Quá trình xử lý: Kiểm tra xem thông tin có hợp lệ không và update cơ sở dữ liệu

Đầu ra: SOAP Response chứa true nếu thành công hoặc false nếu không thành công.

Kết luận:

Trong chương này chúng ta đã thực hiện phân tích đưa ra các sơ đồ phân cấp chức năng, các sơ đồ luồng dữ liệu và phân tích chi tiết các chức năng của hệ thống. Sau đây ta sẽ thực hiện pha tiếp theo là thiết kế hệ thống.

CHƯƠNG 4: THIẾT KẾ HỆ THỐNG

Sau khi hoàn thành quá trình phân tích hệ thống, ta tiếp tục thực hiện thiết kế giao diện của ứng dụng, thiết kế cơ sở dữ liệu, dữ liệu đầu vào và đầu ra, đồng thời liệt kê các gói thư viện của java hỗ trợ khi xây dựng ứng dụng.

4.1 THIẾT KẾ GÓI CHỨC NĂNG4.1.1 Thư viện RSS lib 4.1.1 Thư viện RSS lib

Trong quá trình tìm hiểu và thực hiện ứng dụng này, các thư viện về RSS hay và phổ biến có rất nhiều, nhưng điển hình là một số loại sau:

 Informa

 RssLib4j

 Rome 8.0

Các hệ thống thư viện này cung cấp cho chúng ta các cách để làm việc với các dạng thông tin rss : Như lấy về các kênh thong tin – Channel, lấy riêng biệt các item, về image, về category. Và còn chi tiết hơn nữa về từng thuộc tính cảu các đối tượng trên.

Ngoài ra một số dạng như Rome, Informa còn hỗ trợ các cách làm việc với các dạng chuẩn khác nhau của Rss: 0.91, 0.92, 0.93, 2.0, Atom,…vì vậy rất dễ dàng cho việc sử dụng.

4.1.2 Thiết kế package phía web sericvceGói rsswebservice Gói rsswebservice

Service class : Lớp dịch vụ, cung cấp các dịch vụ chính của ứng dụng, sử dụng thư viện RssLib4j

RssAction class : Lớp dịch vụ, cung cấp các dịch vụ chính của ứng dụng, sử dụng thư viện Rome 8.0

Gói rsswebservice.beans

 Channel class : Lớp miêu tả đối tượng channel (Kênh thông tin của một tổ chức, một hãng , ví dụ: bbc, cnn)

 Category class : Lớp mô tả đối tượng category (giống như một cách phân loại các kênh thông tin theo nội dung, theo chủ đề,.. ví dụ như Thể thao, Trính trị, .. Đông Á, Việt Nam,..)

 Image class : Lớp mô tả đối tượng hình ảnh với các thuộc tính : kích thước, địa chỉ nguồn, link tới đâu…

 Item class : Lớp mô tả đối tượng các thực thể thông tin, mỗi một kênh thông tin có chứa nhiều các “gói” tin, mỗi gói này được gọi là 1 item. Với các thuộc tính như tiêu đề, tác giả, ngày xuất bản, nội dung, …

 Feed class : Lớp mô tả đối tượng là 1 thông tin, có liên hệ với một category, được lưu trữ trong cơ sở dữ liệu.

 User class : Lớp mô tả đối tượng người sử dụng, với các thuộc tính tên, mật khẩu, để có thể quản lý việc truy cập tới ứng dụng, và mục đích tùy biến giao diện cho họ.

Gói rsswebservice.DAO

 CommonDAO class : Lớp có chứa các phương thức chung để sử dụng cho cả ứng dụng : Kết nối tới cơ sở dữ liệu , …

 CategoryDAO class : Lớp chứa các phương thức để làm việc với đối tượng category : tạo mới, xóa, thu thập từ database,..

 FeedDAO class : Lớp chứa các phương thức để làm việc với đối tượng feed : tạo mới, xóa, thu thập từ database,..

4.1.3 Thiết kế package phía servletGói org.apache.axis2.om Gói org.apache.axis2.om Các Interface:  OMElement.  OMNamespace. Các Class:  OMAbstractFactory.  OMFactory. Gói org.apache.axis2.client Các Class:  Options.  ServiceClient. Gói org.dom4j Các Interface:

 Document: Định nghĩa một văn bản XML.

Các Class:

 DocumentHelper: Một tập các phương thức trợ giúp trong khi sử dụng dom4j.

Gói org.dom4j.io

Các Class:

 DocumentResult: thực hiện một JAXP SAXresult cho một văn bản.  DocumentSource. Gói javax.xml.transform.stream Các Class:  Transformer.  TransformerFactory. Gói javax.xml.transform.stream Các Class:

 StreamSource: đóng vai trò như bộ phận nắm giữ luồng dữ liệu trong quá trình chuyển đổi dữ liệu XML.

4.1 THIẾT KẾ GIAO DIỆN NGƯỜI SỬ DỤNG

Khi bật ứng dụng, người sử dụng đầu tiên sẽ tiếp xúc với giao diện chính như hình 4.1

Hình 4.1. Giao diện chính của ứng dụng

Bêntrái của giao diện chính là Category – Danh mục các trang tin tức như hình 4.2.

Bên phải là màn hình hiển thị nội dung tin tức được chọn từ danh mục bên trái (hình 4.3)

Khita chọn chức năng add feed/add category trên menu, giao diện thêm feed hoặc thêm folder sẽ được mở ra, người sử dụng nhập nhưng thông tin cần thiết để thực hiện chức năng(hình 4.4, hình 4.5)

Hình 4.4. Giao diện thực hiện thêm 1 feed mới

4.2 THIẾT KẾ ĐỊNH DẠNG DỮ LIỆU INPUT/OUTPUT

Một phần của tài liệu Xây dựng ứng dụng RSS Reader sử dụng công nghệ Web Service và AJAX (Trang 52 - 89)