Logo
CÔNG NGHỆ WEB 2.0
slide.tailieu.vn
Logo
Nội Dung
Một Số Web 2.0 Tra Cứu Dịch Vụ
Giới Thiệu Công Nghệ Web
6
1
Các vấn đề của Web 2.0
Web 2.0 là gì?
3
7 2
Đặc tính và kỹ thuật của Web 2.0
Một số ứng dụng của Web 2.0
8
Công Nghệ Web 2.0
Các vấn đề của Web 2.0
9 4
Ứng Dụng Của Web.2.0
Rui Ro & Vấn Đề
10 5
slide.tailieu.vn
Logo
Giới Thiệu Công Nghệ Web
ệ ể ự
ặ ậ ủ
ủ
3
ứ ộ ố ứ ụ ị ủ 1. S phát tri n c a công ngh Web 2. Web 2.0 là gì? ỹ 3. Đ c tính và k thu t c a Web 2.0 ệ 4. Công ngh Web 2.0 ụ 5. Các ng d ng c a Web 2.0 6. M t s Web 2.0 tra c u d ch v
slide.tailieu.vn
Logo
1. Sự phát triển của công nghệ Web
4
slide.tailieu.vn
Logo
Giới Thiệu Công Nghệ Web 2.0
5
slide.tailieu.vn
Logo
Giới Thiệu Công Nghệ Web 2.0
6
slide.tailieu.vn
Logo
2. Web 2.0 là gì?
ấ ầ ậ ệ ữ
ầ ủ ị
v Thu t ng Web 2.0 l n đ u xu t hi n vào tháng 10/2004 ủ khi Tim OReily – Ch t ch và Dale Dougherty – Phó Ch ề ạ ị i m t cu c h i th o v t ch c a OReily Media đ a ra t ế ự s phát tri n ti p theo c a Web.
ủ ả ộ ộ ộ
ấ
ả
ế ả
ề ở ộ ố ữ ng tác gi a các ng ườ cho phép ng
ư ủ ể ể ề v Có r t nhi u quan đi m khác nhau v Web 2.0, tuy ư ố ẫ m t s tính năng nh Web 2.0 nhiên đa s v n mô t ươ ườ kh năng giao ti p, tính t i dùng ế ố ữ ớ i dùng có v i nhau hay là nh ng y u t ể ạ th t o ra thông tin.
v Các lo i d ch v Web 2.0 nh m ng xã h i, blog, các t
ụ
ể ạ ị ở ư
ư ạ ộ ự ổ ự ừ ế ế ớ
7
ộ ừ ể đi n m wiki, … đang có m t s phát tri n nh vũ bão ự và th c s đang làm bi n đ i th gi i Internet t ng ừ ngày, t ng gi ờ .
slide.tailieu.vn
Logo
2. Web 2.0 là gì? (tt)
ủ ự
ể S phát tri n c a Web v Web 1.0 (19932003) đa s là các trang HTML, ng
ườ ố i dùng xem thông tin qua trình duy t. ệ Web 1.0 chủ yếu gồm các website "đóng" của các hãng thông tấn hay các công ty nhằm mục đích tiếp cận độc giả hay khách hàng hiệu quả hơn. Nó là phương tiện phát tin hơn là phương tiện chia sẻ thông tin.
v Web 2.0 (2003 beyond): Web 2.0 được chú trọng tới yếu tố công nghệ, nhấn mạnh tới vai trò nền tảng ứng dụng, nhấn mạnh đến tính chất sâu xa hơn – yếu tố cộng đồng thông qua các trang Web, các thông tin chia ụ ẻ s qua Web và nhi u ng d ng t
8
ề ứ ươ ng tác.
slide.tailieu.vn
Logo
2. Web 2.0 là gì? (tt)
9
ủ ự ể S phát tri n c a Web
slide.tailieu.vn
Logo
3. Đặc tính và kỹ thuật của Web 2.0
ể
ạ
ể
ụ
ọ ứ
ề ả
ợ
ồ
ệ ộ
ụ
ề
ị
d ng d ch v web và
ậ ữ ệ ầ ượ
ủ Quan đi m c a Tim OReily v Web có vai trò n n t ng, có th ch y m i ng d ng v T p h p trí tu c ng đ ng ố v D li u có vai trò then ch t ấ ở ạ ượ v Ph n m m đ ừ ậ
đ
ề
ầ
ế ị t b
ậ ể ứ ề ệ ứ
c cung c p c c p nh t không ng ng ễ ụ v Phát tri n ng d ng d dàng và nhanh chóng ạ ể v Ph n m m có th ch y trên nhi u thi ụ v Giao di n ng d ng phong phú (O'Reilly, 2005).
10
slide.tailieu.vn
Logo
3. Đặc tính và kỹ thuật của Web 2.0
ồ
ể
ệ
ủ
ế ệ ứ
c hi u là th h th 2 c a vi c thi
ộ Quan đi m c a c ng đ ng Wikipedia: ể v Web 2.0 đ
ụ
ượ
ẽ ẻ
ơ
ủ
ủ ế ế ượ t k ề ể ứ và phát tri n ng d ng Web, nó s làm cho truy n ễ c d dàng h n, chia s thông tin, tham thông đ gia và thao tác Web an toàn h n. ơ ẫ ớ ự ứ
ụ ư
ệ ồ
ụ
ộ
ị
ẻ
ạ
ở
ể v Khái ni m Web 2.0 đã d n t i s phát tri n c a các ề ữ c ng đ ng, d ch v l u tr và ng d ng trên n n ừ ể ộ ư Web, nh các m ng xã h i, chia s video, t đi n m wiki, blog, …
11
slide.tailieu.vn
Logo
ứ
ể ư
ố
ộ
3. Đặc tính và kỹ thuật của Web 2.0 ủ Theo nguyên c u c a Graham Cormode và Balachander Krishnamurthy (AT&T), các Website 2.0 ư ặ có nh ng đ c tính nh : ự v Ng
ệ i dùng là th c th u tiên s m t trong h
ể ế ố ớ
ệ ố
i dùng trong h th ng có th k t n i v i nhau
ễ
m t cách d dàng. ể
ấ
ướ
ề
ữ ườ th ng.ố ườ v Ng ộ ườ v Ng ị
i dùng có th cung c p thông tin d ả ạ
ủ
ẻ
ộ
ờ ả
ượ
ả
i khác. Đ ng th i đ m b o đ
ề
ẻ
i nhi u ể đ nh d ng khác nhau: nh, video, text …, có th đánh th (tagging), góp ý, đánh giá n i dung c a ề ng c quy n riêng ư t
ườ ồ và quy n chia s thông tin.
ệ
ể
ấ
ở
ứ 12
slide.tailieu.vn
ườ
ể
ặ
v Cung c p các giao di n API m , đ “bên th 3” ậ i dùng ho c các nhà l p trình) có th mashup
(ng
ữ ệ
ứ
ụ
ủ
ộ
ớ
(tr n) các ng d ng hay d li u c a Website v i
ữ ệ
ụ
ứ
ầ
các thành ph n khác ( ng d ng hay d li u) làm
ị ủ
tăng giá tr c a thông tin.
Logo
3. Đặc tính và kỹ thuật của Web 2.0
ườ ử ụ
Vai trò ng
i s d ng Web 2.0
13
slide.tailieu.vn
Logo
3. Đặc tính và kỹ thuật … (tt)
ớ ể ử ụ ậ
v Web 2.0 là m t cách ti p c n m i đ s d ng Web i dùng cùng nhau
ộ ề ả ế ơ ườ ư
ộ nh là m t n n t ng n i mà ng tham gia vào vi c ệ
§ t o ra, § ch nh s a, và ử ỉ § xu t b n thông tin ả ấ
ạ
v Thông qua nh ng công c h p tác sáng t o n i dung
ụ ợ ạ ộ
14
ữ ề trên n n web.
slide.tailieu.vn
Logo
3. Đặc tính và kỹ thuật … (tt)
ườ i ng i dùng không ph i ch ỗ ch
ườ ườ ạ ớ v Web 2.0 liên quan t ộ i dùng t o ra n i dung mà ng ỉ ở ả i dùng còn giúp
ắ i,
ệ
15
ộ ng § thu th p, ậ § t ứ ổ ch c, § mô t , ả § c p nh t, ậ ậ § chia s , ẻ § truy n bá, ề § s p x p l ế ạ § bình lu n, ậ § hi u đính, và § đóng gói n i dung.
slide.tailieu.vn
Logo
3. Đặc tính và kỹ thuật … (tt)
ạ ộ ộ ườ ộ v Web 2.0 là m t cu c h i tho i trong đó ng i dùng có
ơ ộ ể c h i đ
§ đánh d u, ấ § nh n xét, và ậ § chia s quan đi m ẻ
ể
v V m t s ch đ , ngu n thông tin và d ch v thông
ủ ề ụ ề ồ ị
ộ ố ấ ị tin nh t đ nh.
ộ
16
ệ ậ ườ ạ ờ Đi u đó có nghĩa là Web 2.0 hoàn toàn là n i dung do ng ề ể i dùng t o ra nh khai thác trí tu t p th .
slide.tailieu.vn
Logo
3. Đặc tính và kỹ thuật … (tt)
v Cách th c Web 2.0 đ a thông tin đ n ng
ấ ả
ệ
ế ườ i dùng:
§ Xu t b n qua web đ n vi c xu t b n qua RSS, email hay
ư ế
ử ụ
ộ
ụ ể ư
ấ ượ
§ R t nhi u ng d ng s d ng các hàm API công c ng ch ỉ t ra đ đ a thông tin lên Facebook (qua email,
c vi
ề ứ ế đ SMS …).
ừ
ồ
§ Có th mashup t ể
ứ ấ ả SMS…,
nhi u ngu n tin khác nhau … ả
ề Đi u này hoàn toàn không kh thi v i Web 1.0.
17
ớ ề
slide.tailieu.vn
Logo
3. Đặc tính và kỹ thuật … (tt)
v Web 2.0 có th đ
ụ ể
ể ượ ữ ặ ạ c phân lo i theo nh ng đ c
đi m:ể § Chung chung và c th . § Tĩnh và đ ng.ộ § Đóng và m .ở § Cá nhân và s đông.
ố ượ
v Ho c chúng đ
ẻ
ư
ứ
ạ
ị
§ Chia s thông tin nh hình nh, phim, tin t c và âm nh c. ả § Tham gia. § H i h p. ộ ọ § H tr giám sát d ch v . ụ ỗ ợ § Giao d chị
18
ặ ạ ự ứ c phân lo i d a vào ch c năng:
slide.tailieu.vn
Logo
3. Đặc tính và kỹ thuật … (tt)
v Web 2.0 có th đ
ể ượ ữ ặ ạ c phân lo i theo nh ng đ c
v Chung chung và cụ thể: các ứng dụng của Web 2.0 có thể có tính chất chung chung như là Google Earch hoặc cụ thể như là các website tương tác của quận trong một thành phố.
v Tĩnh và động: các ứng dụng Web 2.0 có đặc tính tĩnh như là Youtube (www.youtube.com) và đặc tính động như những live chats, các hình ảnh hoặc các tài liệu có thể trao đổi như MSN, Yahoo.
v Đóng và mở: các ứng dụng Web 2.0 có thể hoạt động trong môi trường đóng như tạo các trang web cá nhân và mở như Google Maps, cho phép người sử dùng tìm kiếm thông tin trong vị trí địa lý xác định.
19
đi m:ể
slide.tailieu.vn
v Cá nhân và số đông: một số ứng dụng chỉ dành có các cá nhân để chia sẻ kinh nghiệm với những người quan tâm khác như là
weblogs, hoặc cũng có thể phục vụ sự quan tâm của một đám
đông. Ví dụ như diễn đàn để bàn luận về các vấn đề xã hội.
Logo
3. Đặc tính và kỹ thuật … (tt)
v Web 2.0 có th đ
ể ượ ữ ặ ạ c phân lo i theo nh ng đ c
v Chia sẻ thông tin như hình ảnh, phim, tin tức và âm nhạc.
v Tham gia: việc tham gia đánh giá những bộ phim được đặt trên Youtube hay là đánh giá những bài viết trên các tạp chí điện tử.
v Hội họp: Web 2.0 có thể được dùng để chia sẻ mối quan tâm trong cùng một cộng đồng, giảm những hạn chế về liên lạc như là MySpace, Twitter, Facebook.
v Hỗ trợ giám sát dịch vụ: các ứng dụng Web 2.0 cung cấp vị trí
của những bệnh viện, thư viện, trường mẫu giáo, trường học.
20
v Giao dịch như là eBay, nghĩa là cung cấp các dịch vụ thương mại theo những cách đổi mới, các Web 2.0 như là những cửa hàng trực tuyến mà người ghé thăm có thể mua những thứ cần thiết qua mạng.
đi m:ể
slide.tailieu.vn
Logo
ệ
4. Công ngh Web 2.0
v Web 2.0 v n đang ti p t c phát tri n c
ầ
ế
ề
§ máy ch , ủ § ki n trúc ph n m m, § giao th c, ứ § chu n , ẩ §
§
trình duy t, ệ ụ ứ ng d ng, ...
ế ụ ả ở ề ả ể ẫ n n t ng
v Hình thành ho c tăng c
ườ ả
21
ươ ng kh năng các mô hình ệ ặ ề ặ t ng tác v m t công ngh trong Web 2.0.
slide.tailieu.vn
Logo
ệ
4. Công ngh Web 2.0
ở XML v XML đ
ề ượ ượ c vi ữ t b i eXtensible Markup Lauguage, ị ở ấ c đ ngh b i W3C
ữ ế ắ t t ở ộ “Ngôn ng Đánh d u M r ng” đ đ t o ra các ngôn ng khác.
ả ơ
ặ ẻ ệ v M c đích chính c a XML là đ n gi n hóa vi c chia s ệ ệ t là các h
ể ạ ụ ữ ệ d li u gi a các h th ng khác nhau, đ c bi ố th ng đ
v XML cung c p m t ph
ế ố ớ ộ ấ
ộ ấ ả ể ả ủ ệ ố ữ ượ c k t n i v i Internet. ể ệ ươ ng ti n dùng văn b n (text) đ ụ thông tin và áp d ng m t c u trúc ki u cây cho
22
mô t thông tin đó.
slide.tailieu.vn
Logo
ệ
4. Công ngh Web 2.0
ị ơ ở ủ
ị ầ ộ
ỗ ợ ệ ể ạ ổ ợ ượ h p chu i h p l
c k t h p theo t ệ
v XML cung c p m t c s cú pháp cho vi c t o l p các
XML ự ủ ơ v Đ n v c s c a XML là các ký t theo đ nh nghĩa c a ự ự toàn c u). Các ký t Universal Character Set (B ký t ộ ế ợ đ t o thành m t đ tài li u XML. ấ
ữ ệ ạ ậ ầ ộ ơ ở ự ấ ngôn ng đánh d u d a trên XML theo yêu c u.
v Ví d :ụ
23
slide.tailieu.vn
Logo
ệ
4. Công ngh Web 2.0
ộ t t
ọ ở ợ
t b i Really Simple Syndication là m t ượ ổ c t ng h p và đ c b i các ẩ
v RSS đ ớ
RSS ượ v RSS đ ạ ị ụ ặ ượ ế ắ ở c vi ộ đ nh d ng n i dung Web đ ự công c đ c thù d a trên chu n XML. ể c dùng đ thông báo cho ng
ườ i dùng các thông ẻ ệ tin m i trên các Website thông qua vi c chia s thông tin.
ượ ộ ậ ướ ạ ấ
v Thông tin này đ ượ XML đ hay RSS channel.
24
c cung c p d ộ ọ i d ng m t t p tin c g i là m t RSS feed, webfeed, RSS stream
slide.tailieu.vn
Logo
ệ
4. Công ngh Web 2.0
ế ắ ừ AJAX v AJAX, vi t t t t
ộ
ụ
ố ỉ ể ộ ằ ế ắ ả ữ ầ t, thay vì t i đi t
ộ Asynchronous JavaScript and XML ụ ồ (JavaScript và XML không đ ng b ), là b công c cho ỏ ữ ộ ứ phép tăng t c đ ng d ng web b ng cách c t nh d ả ạ ị ệ li u và ch hi n th nh ng gì c n thi i l i toàn b trang web.
v AJAX không ph i m t công ngh đ n l
ộ ả ệ ơ ẻ ự ế
ộ ợ
ệ ớ ị ữ ệ
ộ
ể ố ượ ộ ớ ồ
25
ủ ế ữ ệ ề mà là s k t h p m t nhóm công ngh v i nhau. Trong đó, HTML và CSS đóng vai hi n th d li u, mô hình DOM trình bày ổ ữ thông tin đ ng, đ i t ng XMLHttpRequest trao đ i d ị ủ ệ li u không đ ng b v i máy ch web, còn XML là đ nh ạ d ng ch y u cho d li u truy n.
slide.tailieu.vn
Logo
ệ
4. Công ngh Web 2.0
ạ ộ ư ế
ế ắ ừ t t t t
ồ ộ ụ
ố ỉ ể
ầ ữ ằ ế ắ ả t, thay vì t ỏ ữ ệ ả ạ i l i đi t
ệ ơ ẻ ự ế ả ộ AJAX ho t đ ng nh th nào? Vi Asynchronous JavaScript and XML (JavaScript ộ và XML không đ ng b ), là b công c cho phép tăng t c ụ ộ ứ đ ng d ng web b ng cách c t nh d li u và ch hi n ộ ị th nh ng gì c n thi i toàn b trang web. v AJAX không ph i m t công ngh đ n l
ợ ộ
ệ ớ ị ữ ệ
ộ
ể ố ượ ộ ớ ồ
26
ủ ế ữ ệ ề mà là s k t h p m t nhóm công ngh v i nhau. Trong đó, HTML và CSS đóng vai hi n th d li u, mô hình DOM trình bày ổ ữ thông tin đ ng, đ i t ng XMLHttpRequest trao đ i d ị ủ ệ li u không đ ng b v i máy ch web, còn XML là đ nh ạ d ng ch y u cho d li u truy n.
slide.tailieu.vn
Logo
4. Công ngh Web 2.0
ệ Cơ chế làm việc của ajax
v Lúc đó Client sẽ rơi vào trạng thái chờ (waiting…), trong lúc này phía Client không thể thực hiện một công việc nào khác.
v Khi Server xử lý hoàn thành các yêu cầu và sẽ gửi trả lại cho phía Client một trang web khác thay thế trang cũ
27
9/20/16
Cơ chế truyền thông đồng bộ v Khi người dùng cần cập nhật thông tin (click vào một một Button nào đó), thì yêu cầu thay đổi thông tin sẽ được gửi từ phía Client về Server dưới dạng HTTP request, toàn bộ trang web sẽ được gửi chứ không riêng gì một vài thông tin cần thay đổi (dạng này gọi là postback).
slide.tailieu.vn
Logo
ệ
4. Công ngh Web 2.0
v Cách thức hoạt động của 1 trang web cổ điển là : Click waiting .. refresh …….Do đó cho dù yêu cầu cập nhật một lượng thông tin nhỏ thì trang web cũng phải load lại, do đó các trang web chạy chậm .
28
9/20/16
Cơ chế truyền thông đồng bộ
slide.tailieu.vn
Logo
ệ
4. Công ngh Web 2.0
v Khi đó công việc gửi request và nhận response đều 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 đổi thành XHTML + CSS cho trình duyệt hiển thị. Việc phân tích và chuyển đổi 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 User cảm thấy kết quả xử lý được hiển thị tức thì mà không cần nạp lại toàn bộ trang.
29
9/20/16
Cơ chế truyền thông bất đồng bộ v Ajax cho phép tạo ra một Ajax Engine nằm giữa UI (user interface (Server)– giao diện người dùng(Client)) và Server, Ajax Engine này vẫn nằm ở phía Client .
slide.tailieu.vn
Logo
ệ
4. Công ngh Web 2.0
30
9/20/16
Cơ chế truyền thông bất đồng bộ
slide.tailieu.vn
Logo
ệ
4. Công ngh Web 2.0
v Việc gửi request và nhận response do Ajax Engine thực hiện. Do đó phía Browser UI không rơi vào trạng thái chờ (waiting…), tức là có thể thực hiện nhiều việc cùng lúc (Asynchronous). .
31
9/20/16
Cơ chế truyền thông bất đồng bộ v 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 Ajax Engine chỉ gửi đi những thông tin cần thay đổi chứ không phải toàn bộ trang web, do đó giảm được tải qua mạng.
slide.tailieu.vn
Logo
4. Công ngh Web 2.0
ệ Cơ chế làm việc của ajax
32
9/20/16
slide.tailieu.vn
Logo
ệ
4. Công ngh Web 2.0
v Google Suggest hiển thị các thuật ngữ gợi ý gần như ngay
lập tức khi người sử dụng chưa gõ xong từ khóa.
v Google Maps, mọi người có thể theo dõi những thay đổi, xê
dịch, kéo thả bản đồ như trên môi trường desktop.
v Gmail đến phiên bản thử nghiệm Google Groups, đều là
những ứng dụng AJAX.
v Trang chia sẻ ảnh Flickr (hiện thuộc Yahoo) hay công cụ tìm
kiếm A9.com của Amazon.
v Yahoo Mail Beta 1 là hòm thư mới sẽ được trang bị thêm nhiều tính năng thuộc Web 2.0 như RSS, chế độ xem thư trước (preview)...
v Microsoft cũng đang triển khai chương trình Windows Live
Mail và Windows Live Messenger hỗ trợ AJAX.
Các ứng dụng AJAX phổ biến
slide.tailieu.vn33
Logo
ệ
4. Công ngh Web 2.0 Các ứng dụng AJAX phổ biến
slide.tailieu.vn34
Logo
ệ
4. Công ngh Web 2.0
v Là một công nghệ "nguy hiểm" khi gây ra không ít rắc rối về giao diện người dùng. Ví dụ, phím "Back" (trở lại trang trước) được đánh giá cao trong giao diện website chuẩn. Đáng tiếc, chức năng này không hoạt động ăn khớp với Javascript và mọi người không thể tìm lại nội dung trước đó khi bấm phím Back. Bởi vậy, chỉ một sơ xuất nhỏ là dữ liệu trên trang đã bị thay đổi và khó có thể khôi phục lại được.
v Không thể lưu lại địa chỉ web vào thư mục Favorite (Bookmark) để xem lại về sau. Do áp dụng lớp trung gian để giao dịch, các ứng dụng AJAX không có một địa chỉ cố định cho từng nội dung.
Những nhược điểm của AJAX
slide.tailieu.vn35
Logo
ệ
4. Công ngh Web 2.0
v Microsoft Internet Explorer 5.0 trở lên; Mozilla, Firefox, SeaMonkey, Epiphany, Galeon và Netscape 7.1; trình duyệt chứa KHTML API 3.2 trở lên như Konqueror, Apple Safari... v CSS (Cascading Style Sheets) dùng để miêu tả cách trình bày các tài liệu viết bằng ngôn ngữ HTML, XHTML, XML, SVG, XUL... Các thông số kỹ thuật của CSS do tổ chức World Wide Web Consortium (W3C) quản lý.
v DOM - mô hình đối tượng tài liệu (Document Object Model) - là một giao diện lập trình ứng dụng (API). Thông thường DOM có dạng một cây cấu trúc dữ liệu và được dùng để truy xuất các tài liệu HTML và XML. Mô hình DOM hoạt động độc lập với hệ điều hành và dựa theo kỹ thuật lập trình hướng đối tượng để mô tả tài liệu.
Những trình duyệt hỗ trợ AJAX
slide.tailieu.vn36
Logo
ệ
4. Công ngh Web 2.0 Những trình duyệt hỗ trợ AJAX
v DHTML, hay HTML động, tạo một trang web bằng cách kết hợp các thành phần: ngôn ngữ đánh dấu HTML tĩnh, ngôn ngữ lệnh máy khách (như Javascript) và ngôn ngữ định dạng CSS và DOM. Do có khả năng phong phú, DHTML còn được dùng như một công cụ xây dựng các trò chơi đơn giản trên trình duyệt.
slide.tailieu.vn37
Logo
ệ
4. Công ngh Web 2.0
v Phía Client :
1. Viết hàm tạo đối tượng XMLHttpRequest (đối tượng này dùng để gởi request đến Server). 2. Viết hàm gởi yêu cầu (request) đến Server. 3. Viết hàm xử lý thông tin sau khi gởi request đến Server. Có thể là thông tin lỗi trả về (nếu việc gởi request thất bại) hay là thông tin do Server trả lời lại. v Phía Server :
1. Viết hàm xử lý các yêu cầu (request) từ Client
Các bước xây dựng một ứng dụng ajax
gửi đến.
slide.tailieu.vn
Logo
ệ
4. Công ngh Web 2.0
Mô hình hoạt động của AJAX
Các bước xây dựng một ứng dụng ajax
slide.tailieu.vn
Logo
ệ
4. Công ngh Web 2.0
v RIA là ứng dụng nền Web nhưng có những đặc điểm
RIA (Rich Internet Application)
v RIA được thực hiện bởi các chuẩn hay các phần mềm mở rộng (plug-ins) của trình duyệt hoặc được thực hiện trên các máy ảo.
v Các nền tảng RIA thường được nhắc đến như Curl,
tiêu biểu của các ứng dụng desktop.
v Các phần mềm RIA có thể có rất nhiều ứng dụng khác nhau như: Ứng dụng văn phòng hay bản đồ.
Adobe Flash/Adobe Flex/AIR, Java/JavaFX…
slide.tailieu.vn
Logo
ệ
4. Công ngh Web 2.0
v Mashup cho phép người dùng thể hiện khả năng sáng tạo bất tận bằng cách “nối” hai hay nhiều ứng dụng Web lại với nhau.
v Một số công cụ tạo mashup (mashup editor) v Microsoft Popfly dành cho người không chuyên. Dựa trên nền tảng Silverlight, mọi người có thể lập các dịch vụ online tương đối phức tạp nhưng lại không cần am hiểu về HTML, XTML, CSS, AJAX... Tất cả những gì họ phải làm là kéo - thả nội dung từ nguồn này sang nguồn kia.
v Popfly miễn phí và tương thích Internet Explorer và
Mush up
Firefox.
slide.tailieu.vn
Logo
ệ
4. Công ngh Web 2.0
Mush up
v Video - ảnh: Ví dụ như dùng giao diện lập trình ứng dụng API của Flickr để tạo mashup chia sẻ ảnh trên những site khác.
v Tìm kiếm - mua sắm: Là việc tích hợp search engine
Bốn nội dung mashup chính v Bản đồ: Chẳng hạn người dùng lập bản đồ về bất động sản, cửa hàng quà tặng, trường học... tại một địa phương qua Google Maps.
v Tin tức: Tiêu biểu nhất là Digg.com - dịch vụ hỗ trợ người sử dụng tập hợp tin tức về công nghệ, văn hóa... từ hàng loạt website khác nhau
để tra cứu thông tin về du lịch, nhà hàng...
slide.tailieu.vn
Logo
ệ
4. Công ngh Web 2.0
Mush up
v Data mashup: Trộn dữ liệu cùng loại từ nhiều nguồn, chẳng hạn gộp dữ liệu từ các RSS feed vào một feed đơn nhất.
Bốn loại mashup tiêu biểu v Consumer mashup: Trích xuất dữ liệu khác nhau từ nhiều nguồn và được tập hợp lại dưới một giao diện đồ họa đơn giản.
slide.tailieu.vn
Logo
ệ
4. Công ngh Web 2.0
Mush up
v Telecom mashup là ứng dụng viễn thông tổng hợp, chẳng hạn kết hợp dịch vụ tin nhắn từ công ty A, nhạc chuông của công ty B, thư thoại (voicemail) của công ty C...
Bốn loại mashup tiêu biểu v Business mashup: Sử dụng cả hai loại mashup trên, thường là tích hợp data ở cả trong và ngoài công ty. Ví dụ, công ty bất động sản A có thể phân tích thị phần khi so sánh số căn nhà họ bán được tuần qua với danh sách tổng các ngôi nhà được bán trên thị trường.
slide.tailieu.vn
Logo
ệ 4. Công ngh Web 2.0 (tt)
ữ ệ ố ớ ệ ố ữ ứ ớ ứ ụ
ụ ụ ề ế Gi a h th ng v i h th ng, gi a ng d ng v i ng d ng: v SOA và Web Services là ví d v ki n trúc và mô hình
ề ể phát tri n ph n m m.
v Tính chia s đ
ể ệ ở ạ ị c th hi n
ữ ệ ề ể ầ
khía c nh d li u và d ch ụ ị v , đ nh hình đ n mô hình phát tri n ph n m m có tính ệ ố ươ t ữ ng tác cao v i nh ng h th ng khác.
ươ ụ ầ ẻ ượ ế ớ ườ ả ng kh năng t ữ ứ ng tác gi a ng d ng
v Web 2.0 tăng c ớ ứ v i ng d ng. ờ
ụ
ư ẩ ầ
ế ố ự
v Ngoài ra, nh các chu n nh RSS, RDF Atom,... (h u ể h t đ u d a trên XML) mà các h th ng cũng có th chia s d li u v i nhau linh ho t h n.
ệ ạ ơ ớ
ề ẻ ữ ệ ứ
v Các giao th c FOAF, XFN, SOAP, REST OPBP ...cũng ứ ng tác cho các ng d ng Web
ươ ườ ụ ả ng kh năng t
45
tăng c 2.0.
slide.tailieu.vn
Logo
ệ 4. Công ngh Web 2.0 (tt)
ườ ớ ệ ố i dùng v i h th ng:
ờ ợ ấ ộ
ế ệ ả ả ữ Gi a ng ộ ớ v V i Web 1.0 vào m t liên k t và ch đ i, m t m t ừ ộ ộ i toàn b n i dung t
ể ị ề ờ kho ng th i gian đ trình duy t t ể Server v và hi n th .
ệ ỉ ầ ả ề ả ấ ạ ộ ữ i toàn b d ổ ữ i v nh ng thay đ i
v V i Web 2.0 dùng AJAX, thay vì ph i l y l server, trình duy t ch c n t ế
ị ể ớ ệ ừ li u t ầ c n thi
ộ
ứ ừ ớ ng tác d li u nhanh h n, t
ổ ữ ệ ề ơ ệ ầ
ữ ớ
46
ạ ơ ớ ơ ụ ể t và hi n th chúng. ư v Cũng là HTTP nh ng AJAX b sung m t cách th c giao ệ ươ ế ti p m i giúp vi c t đó có ồ ọ ữ ể ạ th t o nên nh ng ph n m m có giao di n đ h a ụ ệ ẹ phong phú, linh ho t h n, đ p h n v i nh ng nghi p v ộ ứ có th sánh ngang v i m t ng d ng desktop.
slide.tailieu.vn
Logo
ệ 4. Công ngh Web 2.0 (tt)
ườ ườ i dùng i dùng v i ng :
ỉ ượ ả
ớ ế ệ ấ ề ứ ụ ự ủ
ọ
v Các d ch v v chia s nh, blog, chia s nh c, ... ph n
ữ Gi a ng ữ ệ c cung v D li u cho th h Web 2.0 không ph i ch đ ở ấ c p b i server, r t nhi u ng d ng mà s tham gia c a ườ ử ụ i s d ng đóng vai trò quan tr ng. ng ị ầ
ồ ượ ụ ề ữ ệ ẻ ườ ở ớ l n ngu n d li u đ
v Nh v y ngoài quan h gi a ng
ườ ư ậ
ẻ ả ấ c cung c p b i ng ệ ữ ơ ệ ạ i dùng. ớ ườ i dùng i dùng v i ng ớ ệ ườ i dùng v i h
47
ố ữ ừ ế ệ ố ố ọ đóng vai trò quan tr ng h n quan h ng th h Web 1.0. th ng v n dĩ c h u t
slide.tailieu.vn
Logo
5. Các ứng dụng của Web 2.0
ắ
ị ạ ệ
ặ
ộ ấ
ậ ự
ở
ọ
ữ ệ ẻ ả
ạ
v Nh n tin nhanh (Instant MessagingIM) v Đ nh d ng t p tin (RSS) v Phát thanh (Podcasting ho c broadcasting,) v Đánh d u xã h i (social bookmarking) ế v Nh t ký tr c tuy n (Blog) v Công trình m (Wiki) v L c d li u (Mashup) v Chia s hình nh và video ộ v M ng xã h i (social networks) ụ ổ v Các d ch v t ng h p
48
ợ ị
slide.tailieu.vn
Logo
5. Các ứng dụng của Web 2.0 (tt)
ắ
ộ ứ ắ
ễ
ề ứ Internet ữ ứ tìm ụ ể th trên
Nh n tin nhanh (Instant MessagingIM) ổ ế v M t trong nh ng ng ph bi n là nh n tin nhanh hay ụ ị d ch v tra c u qua chat. Có nhi u ng d ng mi n phí ư nh Yahoo ( có Talk http://webmessenger.yahoo.com), Google , AIM, (http://www.google.com/talk), MSN Messenger, ICQ, GaduGadu, ngay c ả IRC và SMS.
v Nh n tin nhanh cũng có th d dàng s d ng đ
ử ụ ể ễ ượ c trên
49
ế ị ộ ắ các thi t b di đ ng
slide.tailieu.vn
Logo
5. Các ứng dụng của Web 2.0 (tt)
ị ạ
ể ậ
ữ ư ụ ụ ặ ạ ứ ữ ồ
50
ườ ử ụ ệ Đ nh d ng t p tin (RSS) v RSS (Really Simple Syndication) ữ v RSS có th l p danh m c nh ng website h u ích dùng ủ ề làm ngu n tra c u ho c t o ra nh ng th m c ch đ cho ng i s d ng
slide.tailieu.vn
Logo
5. Các ứng dụng của Web 2.0 (tt)
ặ
ể ử ụ ươ ứ ệ Phát thanh (Podcasting ho c broadcasting) v Tra c u có th s d ng ph ng ti n phát thanh trên
Internet.
v M t s ng d ng mi n phí n i ti ng trên Internet
ụ ố ứ ễ ổ
ộ ể
51
ế đ làm podcasting là Audacity (www.audacity.sourceforge.net ) và Odeo Studio ( www.studio.odeo.com)
slide.tailieu.vn
Logo
5. Các ứng dụng của Web 2.0 (tt)
ộ ấ
ậ ườ ữ
Đánh d u xã h i (social bookmarking) ộ v Đánh d u xã h i giúp t p h p nh ng đ ẫ ườ ẫ ữ ng d n h u ng d n này vào các
ư ấ ợ ữ ạ ả và phân lo i nh ng đ ích, mô t ủ ề ụ ể ụ th m c theo ch đ c th .
v Furl (www.furl.net) và del.icio.us (www.delicious.com) là ụ ổ ậ hai trong s nh ng ví d n i b t cung c p nh ng tính năng này.
52
ữ ữ ấ ố
slide.tailieu.vn
Logo
5. Các ứng dụng của Web 2.0 (tt)
ậ ế
ự ể ạ ữ ủ ẻ ậ Nh t ký tr c tuy n (Blog) v Có th t o ra nh ng nh t ký c a riêng mình, chia s tin
ứ t c và thông báo cá nhân.
ệ ề ự ệ m c a, các s ki n
53
ồ ể ượ ế ờ ở ử ớ v Thông tin v ngu n tài li u m i, gi ẻ ằ c chia s b ng blog. ố và bi n c có th đ
slide.tailieu.vn
Logo
5. Các ứng dụng của Web 2.0 (tt)
ở
ộ ậ ế ặ
ể
ữ ả t ho c th o lu n. ở ướ i dùng có th kh i x ồ ự ủ ề ng m t ch đ và ứ ưở ng ng
54
Công trình m (Wiki) ấ ớ v Khác v i blog, wiki cung c p nh ng n i dung mang tính ệ ướ ạ i d ng bài vi trí tu d ườ ớ ộ v V i wiki, ng ộ ở ộ m r ng n i dung này d a trên h i âm và h ọ ạ ủ c a b n đ c.
slide.tailieu.vn
Logo
5. Các ứng dụng của Web 2.0 (tt)
ọ ữ ệ
ộ
ụ ừ ồ ự ẵ ở ề ặ L c d li u (Mashup) ộ ứ v Mashup là m t ng d ng khác mà ượ ạ c t o ra t đó m t ngu n l c ụ ị hai ho c nhi u d ch v web s n
thông tin đ có.
v Ng
ụ ể
ị ứ ợ chu n b cho các đ t qu ng ho c d ng video.
v Ng
ườ ẩ ườ ể i dùng tra c u có th khai thác công c này đ ự ặ ế ạ i dùng cũng có th s p x p l i (mashup) n i dung
55
ụ ớ ể ạ ạ ị ả ể ắ ộ ữ ề ư ệ v th vi n đ t o ra nh ng d ch v m i sáng t o.
slide.tailieu.vn
Logo
5. Các ứng dụng của Web 2.0 (tt)
ẻ
ữ ả Chia s hình nh và video ụ ổ v Flickr ( www.flickr.com) là m t trong nh ng ví d n i
ề ẻ ộ ả ụ ế ti ng v công c chia s hình nh
ụ ổ ế ộ ề v YouTube ( www.youtube.com ) là m t ví d n i ti ng v
56
ẻ chia s video.
slide.tailieu.vn
Logo
5. Các ứng dụng của Web 2.0 (tt)
ạ ộ
ạ ộ
http://www.linkedin.com) ng
ứ ứ ệ
M ng xã h i (social networks) ư v Thông qua các m ng xã h i nh Facebook friendster (www.friendster.com) (www.facebook.com), ườ ho c (ặ i dùng tra c u có ể ự ể th dùng n n công ngh này, có th đăng tin t c, s ệ ki n, hình nh.
ị ợ ề ả ụ ổ
ề ứ ụ ử ụ Các d ch v t ng h p ể ế v Có th k t h p và s d ng nhi u ng d ng Web 2.0
57
ợ ệ ộ ề trên cùng m t n n công ngh .
slide.tailieu.vn
Logo
5. Một số Web 2.0 tra cứu dịch vụ
58
slide.tailieu.vn
Logo
6. Các vấn đề của Web 2.0
v Quá kỳ vọng: Các ứng dụng Web 2.0 yêu cầu kết nối Internet ổn định và nhanh để làm việc. Trừ khi kết nối băng rộng được phủ khắp, còn không thì Web 2.0 chỉ là một bổ sung cho cách thức chúng ta làm việc (bên cạnh ứng dụng desktop).
v Quá đơn giản: Web 2.0=Ajax! Cũng như Web 2.0, Ajax được kỳ vọng quá nhiều. Thực chất, Ajax chỉ là một trong số nhiều công nghệ nền tảng của Web 2.0 và Ajax còn có những hạn chế.
v Quá chú trọng công nghệ: RSS, SOA, Ajax... hàng loạt công nghệ được gắn liền với Web 2.0. Người ta áp dụng các công nghệ mới mà không quan tâm đến các tính chất quan trọng hơn: truyền thông, cộng tác, trí tuệ cộng đồng.
59
slide.tailieu.vn
Logo
7. Một số ứng dụng của Web 2.0
v Ngoài ra bạn cũng có thể dễ dàng chia sẻ bộ sưu tập của bạn. Nếu có ai đó hỏi bạn có liên kết nào hay, bạn chỉ cần chỉ người đó lên xem kho bookmark của bạn trên Delicious.
60
Giới thiệu trang web Del.icio.us: v Delicious sẽ giúp bạn bạn đánh dấu (bookmark) lại những trang web mà bạn muốn giữ lại để tham khảo lại sau này. Bạn có thể lập một bộ sưu tập các website hay về nhiều lĩnh vực, dùng để share hoặc cho cá nhân,… v Bạn có thể tổ chức sắp xếp tùy theo ý thích, không phải chép trong USB và có thể tham khảo ở bất cứ nơi nào miễn có Internet.
slide.tailieu.vn
Logo
7. Một số ứng dụng của Web 2.0
61
Giới thiệu trang web Del.icio.us: v Đăng ký: vào trang chủ http://del.icio.us, nhập thông tin username, mật khẩu và email. Sau đó vào hộp mail và click vào link xác nhận để đảm bảo với del.icio.us là đó thực sự là hộp mail của bạn.
slide.tailieu.vn
Logo
7. Một số ứng dụng của Web 2.0
62
slide.tailieu.vn
Logo
7. Một số ứng dụng của Web 2.0
v Tag là gì? Tag theo đúng nghĩa đen của nó, là một loại nhãn dán lên sản phẩm hay đồ vật nhằm ghi chú hoặc đánh dấu phân loại. Ở đây cũng vậy, Delicious cho phép bạn tổ chức sắp xếp kho link theo cách riêng của bạn, bạn có thể gán cho mỗi link 1 hoặc nhiều nhãn, sau đó bạn sẽ tìm lại những link đó qua các nhãn này.
v Tag bundle: là tập hợp các tag có liên quan với nhau ở một mức ý nghĩa nào đó. Nói đơn giản là bạn có thể gom nhóm các tag lại với nhau thành tag bundle.
v Network: Delicious
là một website mang
tính cộng đồng (community). Nó cũng giống như blog hoặc Yahoo 360, ở đó mọi người có thể share nhau những gì họ có. Bạn có thể thêm một người vào Network của bạn cũng như xem họ có cập nhật gì mới.
63
Giới thiệu trang web Del.icio.us:
v Sử dụng:Để vào kho link của bạn, bạn gõ vào address bar
http://del.icio.us/
slide.tailieu.vn
Logo
7. Một số ứng dụng của Web 2.0
64
Giới thiệu trang web Del.icio.us:
slide.tailieu.vn
Logo
7. Một số ứng dụng của Web 2.0
v Nhấp vào liên kết “Save a new Bookmark” (ở trên cùng) trên trang
chính của account Delicious.
v Hoặc nhấp vào nút “post to del.icio.us” trên thanh toolbar trong khi đang xem trang web bạn muốn lưu (xem hướng dẫn cài thêm công cụ hỗ trợ).
v Trên ô tags bạn có thể nhập vào những tag bạn muốn gán cho liên
kết này. Cũng có nhiều cách cho bạn lựa chọn § Gõ trực tiếp, các tag cách nhau bằng khoảng trắng. Delicious có hỗ trợ auto-complete, tức hiện ra tên tag mà nó cho là bạn sắp gõ vào. Bạn chỉ cần gõ vài chữ đầu, ví dụ chữ “we”, nó sẽ hiện ra “web”, “webdesign”,… cho bạn chọn. Bạn có thể chọn hoặc gõ tiếp cho đến khi tag bạn muốn xuất hiện ngay đầu danh sách. Để chọn bạn nhấn mũi tên trái phải và phím Tab.
§ Hoặc bạn có thể click trực tiếp vào danh sách tag gợi ý bên
dưới.
65
Giới thiệu trang web Del.icio.us: v Bạn có thể thêm một liên kết vào kho link của bạn bằng nhiều cách:
slide.tailieu.vn
Logo
7. Một số ứng dụng của Web 2.0
§ Để chia sẻ kho liên kết này cho bạn bè của bạn, bạn chỉ cần cho
họ biết tên account của bạn. Bạn cũng có thể truy xuất đến
account của người khác bằng liên kết: “http://del.icio.us/
v Tìm kiếm
§ Để tìm trên Delicious, bạn có thể gõ vào ô tìm kiếm, hoặc nhấp vào tên Tag để liệt kê tất cả liên kết có tag đó. Bạn cũng có thể liệt kê link có chứa tag trên toàn thể trang Delicious (chọn view all khi đang liệt kê tag hay vào từ trang chủ). Cái hay của Delicious ở đây là bởi vì mọi người share nhau kho liên kết của họ, nên khi ta muốn tìm một cái gì đó, ta có thể tìm được chính xác một cách nhanh chóng hơn là tìm trên Google (tất nhiên không phải tất cả mọi thứ đều có thể)..
66
Giới thiệu trang web Del.icio.us: v Share cho bạn bè:
slide.tailieu.vn
Logo
7. Một số ứng dụng của Web 2.0
Ngay sau khi đăng ký, Delicious sẽ giới thiệu với bạn một số công cụ mà bạn sẽ sử dụng để việc sử dụng Delicious trở nên dễ dàng hơn.
Trước tiên, bạn hãy kéo-thả 2 liên kết mà Delicious cung cấp lên thanh công cụ Bookmarks (Firefox) hoặc Links (IE). Bạn cũng có thể kéo vào Favorites.
67
Giới thiệu trang web Del.icio.us: v Cài các công cụ hỗ trợ cho Delicious
slide.tailieu.vn
Logo
7. Một số ứng dụng của Web 2.0
68
slide.tailieu.vn
Logo
7. Một số ứng dụng của Web 2.0
v Ghi chú: nếu bạn sử dụng Internet Explorer mà không thấy Links Toolbar, bạn hãy nhấp chuột phải vào thanh công cụ bất kỳ và check vào dòng Links. Nếu dòng đó đã check thì có nghĩa là thanh công cụ đã nằm đâu đó trên màn hình và thường là bị thanh Address chèn ép dồn sang góc phải. Hãy vào đó lôi nó ra, cho nó thêm chút không gian hay tốt hơn là dành hẵn 1 dòng cho nó.
Nếu bạn bỏ lỡ qua trang giới thiệu này, bạn có thể quay lại bất kỳ lúc nào bằng cách vào Help >> Buttons trên website Delicious.
Nếu bạn là người dùng Firefox, bạn có thêm một lựa chọn, đó là cài thêm Delicious extension hỗ trợ 2 chức năng như trên đồng thời cũng cho bạn tìm kiếm trực tiếp từ Firefox mà không cần mở website Delicious lên.
v Để cài đặt bạn có thể vào Help >> Firefox and Internet Explorer
extension.
.
69
slide.tailieu.vn
Logo
7. Một số ứng dụng của Web 2.0
2. Soạn thảo văn bản – chia sẻ thông tin – hợp tác làm việc trực tuyến
tuyến
trực
v Hiện tại, Google đã cung cấp cho bạn dùng miễn phí công cụ văn phòng Google Docs tại địa chỉ http://docs.google.com . Bạn có thể soạn thảo văn bản trực tuyến tại Google mà có thể sẽ không cần Word, khi soạn thảo nhanh trên máy không cài Office.
v Để sử dụng, bạn vào địa chỉ http://docs.google.com và điền tài khoản và mật khẩu đã đăng ký với Google (tài khoản Gmail). Nếu không có tài khoản, bạn có thể chọn Create a new google Account để đăng ký sử dụng.
v Sau khi màn hình đăng nhập hoàn tất, bạn có thể sử dụng hầu hết các tính năng cần thiết của một chương trình soạn thảo văn bản trực tuyến. Khi đó, bạn sẽ thấy được những tính năng vượt trội của Google Docs ngay khi sử dụng thông qua ba chức năng chính: Hiệu quả, tiện lợi và chia sẻ cấp cao.
.
70
slide.tailieu.vn
Logo
7. Một số ứng dụng của Web 2.0
2. Soạn thảo văn bản – chia sẻ thông tin – hợp tác làm việc trực tuyến
71
slide.tailieu.vn
Logo
7. Một số ứng dụng của Web 2.0
2. Soạn thảo văn bản – chia sẻ thông tin – hợp tác làm việc trực tuyến
Khai thác tính hiệu quả của Google Docs
v Khung soạn thảo tương thích tốt với Unicode, cho bạn soạn thảo tiếng Việt dễ dàng. Hỗ trợ đầy đủ các tính năng của một chương trình soạn thảo văn bản.
v Chế độ kiểm tra chính tả cho văn bản tiếng Anh.
v Bạn có thể lưu văn bản soạn thảo dưới dạng html, RTF (tương
thích với WordPad), PDF (tương thích với chuẩn Acrobat Reader), Word (tương thích Office của Windows), OpenOffice (Tương thích OpenOffice).
v Bạn có thể in trực tiếp ngay trên khung soạn thảo.
v Hỗ trợ tác vụ Find & Replace trong trường hợp cần chỉnh sửa
nhiều từ giống nhau.
v Bạn có thể chèn hình ảnh, liên kết, table.
72
slide.tailieu.vn
Logo
7. Một số ứng dụng của Web 2.0
2. Soạn thảo văn bản – chia sẻ thông tin – hợp tác làm việc trực tuyến
Khai thác tính tiện lợi của Google Docs
v Google Docs cho bạn đem tài liệu để chỉnh sửa mọi lúc mọi
nơi khi cần.
v Để thực hiện, bạn chọn Upload để hiển thị khung Upload a File. Bạn được quyền đưa các tài liệu cá nhân lên lưu trữ với kích thước không quá 500KB cho mỗi tài liệu. Google Docs chấp nhận tài liệu văn bản HTML và text (.txt), Microsoft Word (.doc), Rich Text (.rtf), OpenDocument Text (.odt)
and StarOffice (.sxw).
Sau khi Upload thành công, bạn dễ dàng thao
tác chỉnh sửa trên văn bản khi cần.
73
slide.tailieu.vn
Logo
7. Một số ứng dụng của Web 2.0
2. Soạn thảo văn bản – chia sẻ thông tin – hợp tác làm việc trực tuyến
Khai thác tính năng chia sẻ cấp cao trong Google Docs
v Bạn có thể chọn Share để chia sẻ cho mọi người thông qua email với tác vụ Collaborater hoặc Viewer, nếu share với chế độ Colaborator, những người được mời sẽ cùng tham gia cộng tác và chỉnh sửa trên cùng một file văn bản gốc, và mọi người khác đều có thể thấy được sự thay đổi đó là ứng dụng vào việc cộng tác làm việc nhóm giữa các thành viên trong cùng một nhóm.
trang
nhân
blog
cá
v Để mở rộng hơn trong việc chia sẻ tập tin, bạn có thể thao tác trên menu mở rộng Publish. Tác vụ này cho bạn đem tập tin của mình trên như www.blogger.com , các wordpress.com…
v Ngoài ra, để mọi người có thể xem tập tin của mình, bạn có thể nhờ Google gán một đường link về tập tin qua thao tác Publish Document. Khi đó, tài liệu của bạn sẽ có một địa chỉ web cụ thể cho mọi người truy cập và đọc tài liệu khi cần.
74
slide.tailieu.vn
Logo
7. Một số ứng dụng của Web 2.0
3. Tìm địa điểm, tìm đường đi, danh bạ, số điện thoại …mọi lúc mọi nơi
v Vào trang web sau: http://diadiem.com/ : thông tin địa điểm của
các thành phố lớn
a) Tìm kiếm một địa điểm (Ví dụ nhà mình): Chọn Tìm kiếm, Chọn thành phố và gõ vào địa chỉ cần tìm, sau đó click nút Tìm.
v VD: 1641 Phạm thế hiển P.6 Q.10
75
slide.tailieu.vn
Logo
7. Một số ứng dụng của Web 2.0
3. Tìm địa điểm, tìm đường đi, danh bạ, số điện thoại …mọi lúc mọi nơi
b) Tìm đường đi từ nơi này đến nơi khác: Chọn Đường đi và gõ địa chỉ hai điểm A, B, sau đó click nút Tìm
76
slide.tailieu.vn
Logo
8. Thách thức khi sử dụng
Thách thức khi sử dụng Web 2.0
v Có ba vấn đề cần quan tâm khi sử dụng Web 2.0 là sự riêng tư, tính
bảo mật, và tính bản quyền.
v Sự riêng tư được thể hiện trong sự hợp tác công khai. Chẳng hạn
như một thảo luận được thực hiện ở vài thời điểm với một số lượng thông tin được công khai trên Facebook. Khi đó, người sử dụng sẽ quyết định thông tin nào có thể được xem bởi ai. Khia cạnh riêng tư có thể cần tinh vi hơn và khó đối phó hơn.
v Việc sử dụng công nghệ AJAX cho phép chúng ta phát triển nhiều ứng dụng hơn. Sử dụng những mã và các chương trình chạy trên websites (hoặc cho phép giao tiếp giữa các website) không may cũng tăng cường khả năng lạm dụng. Tấn công để phá hủy các website hoặc chiếm đoạt tài khoản của người sử dụng là vấn đề lớn hơn cho các ứng dụng Web 2.0 có tương tác đối với những website của Web 1.0. Vì vậy, cố gắng tăng cường hướng đến sự an toàn phải được le kế hoạch khi xây dựng các ứng dụng Web 2.0.
77
slide.tailieu.vn
Logo
8. Thách thức khi sử dụng
Thách thức khi sử dụng Web 2.0
v Đối với các ứng dụng Web 2.0, dữ liệu là thành phần trung tâm,
quan trọng hơn cả phần mềm. Vì thế, người sử dụng có thể thêm dữ liệu đối với một ứng dụng hoặc điều chỉnh dữ liệu đang tồn tại. Điều này ảnh hưởng đến các vấn đề luật pháp liên quan và bản quyền ngay lập tức. Rõ ràng các ví dụ về vấn đề này là các trang nơi mà người sử dụng có thể công khai những bức ảnh của họ (Flickr) hoặc video (YouTube). Cả Flickr và YouTube có các hệ thống đặt để kiểm tra sự xâm phạm và những vi phạm luật pháp khác liên quan đến sự riêng tư, bảo vệ trẻ vị thành niên, v.v. lâu dài.
78
slide.tailieu.vn
Logo
9. Sử dụng Web 2.0 với Chính Phủ
v Việc sử dụng Web 2.0 trong chính phủ được chia thành ba loại:
§ Tập trung vào truyền thông;
§ Tập trung vào tương tác;
§ Tập trung vào dịch vụ.
79
slide.tailieu.vn
Logo
9. Chuyển đổi từ Web 1.0 sang Web 2.0
v Tập trung vào truyền thông: thông tin của chính phủ được truyền bá đến người dân càng xa và rộng thì càng tốt. Người dân có thể dễ dàng truy cập đến thông tin ở bất cứ đâu và chính phủ có thể khuyến khích chiến dịch quốc tế với chi phí hiệu quả.
v Mục đích chính của việc sử dụng là tăng nội dung mà chính phủ đưa vào các công cụ mạng xã hội, như blogs, podcasts và vlogs, RSS, wikis, và các mạng xã hội trong doanh nghiệp. Để sử dụng chất lượng đảm bảo đi kèm với khu vực công và những gì cần để chính phủ xây dựng mối quan hệ với người dân. Chính phủ phải thiết lập một quy tắc rõ ràng cho việc tham gia vào blogging và wikies để không vi phạm luật chứng thực.
v Web 2.0 cho phép bên thứ ba tải và kết xuất nội dung từ tài nguyên chính phủ và đưa thông tin đến người dân. Chính phủ cho phép thông tin được truyền bá rộng rãi hơn đến người dân qua các phương tiện khác nhau, nhưng họ phải đảm bảo xác thực thông tin chính phủ được cung cấp ở website của bên thứ ba.
80
slide.tailieu.vn
Logo
9. Chuyển đổi từ Web 1.0 sang Web 2.0
v Tập trung vào tương tác: tương tác với người dân để có phản hồi của họ về chính trị, các vấn đề, dịch vụ và kế hoạch của chính phủ, để có lợi trong việc tạo nội dung mới và làm cho người sử dụng phương tiện trung gian để tạo mashups nội dung có lợi cho những người khác. v Sử dụng tập trung vào tương tác là khó hơn được thực hiện để so sánh với sử dụng tập trung vào giao tiếp, vì khó để xác thực nội dung được tạo bởi người sử dụng trước khi trộn với nội dung mới.
81
slide.tailieu.vn
Logo
9. Chuyển đổi từ Web 1.0 sang Web 2.0
v Tập trung vào dịch vụ: sử dụng mạng xã hội quan trong bao
nhiêu, khó thực hiện để thành công bấy nhiêu. Mạng xã hội yêu cầu chính phủ giám sát để cung cấp giá trị đến người sử dụng. Phương tiện trung gian có thể tích hợp vào nội dung không của chính phủ với nội dụng của chính phủ và tạo những sản phẩm thông tin mới để gia tăng giá trị thông tin chính phủ. Chính phủ phải tin cậy và xác thực các phương tiện trung gian để tạo các dịch vụ và cung cấp giá trị phù hợp với người dân. Trong khi sử dụng các phương tiện trung gian có thể thay đổi dịch vụ ở chi phí thấp nhất, chính phủ phải đảm bảo tính đồng nhất và công bằng về chất lượng dịch vụ cho tất cả mọi người.
v Trong trường hợp sử dụng cuối cùng, thách thức của chính phủ là để đảm bảo tính riêng tư, bảo mật, hợp pháp của dữ liệu. Thách thức này gợi ý rằng có các vấn đề quan trọng đưa vào xem xét trước khi phổ biến trên mạng xã hội một cách rộng rãi. Chính phủ phải đưa vào các vấn đề, ảnh hưởng, và những mối đe dọa.
82
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
1. Cơ chế nhớ sẵn của trình duyệt
v. Cache-Control (điều khiển nhớ sẵn) là quy tắc quan trọng nhất.
Trường này dùng để xác định rõ các chỉ thị mà toàn bộ các cơ chế nhớ sẵn (caching mechanisms) dọc theo chuỗi yêu cầu/đáp ứng phải tuân theo. Các chỉ thị quy định các hành vi nhằm ngăn chặn bộ nhớ đệm gây nhiễu loạn bất lợi đến yêu cầu hay đáp ứng. Các chỉ thị này thường đè lên các thuật toán nhớ sẵn mặc định. Các chỉ thị về nhớ sẵn là đơn hướng, theo nghĩa là sự hiện diện của một chỉ thị trong một yêu cầu không hàm ý rằng cùng một chỉ thị đó được áp dụng cho đáp ứng.
v. Định nghĩa cache-control là: Cache-Control = "Cache-Control" ":"
cache-directive (chỉ thị nhớ sẵn).
83
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Bảng 1. Các giá trị chỉ thị nhớ sẵn thông dụng
Cache-directive (chỉ thị nhớ sẵn)
Mô tả
public (công cộng)
Toàn bộ nội dung sẽ được đưa vào bộ nhớ sẵn..
private (riêng tư)
Nội dung chỉ được nhớ sẵn trong bộ nhớ sẵn riêng tư.
no-cache (không nhớ sẵn)
Toàn bộ nội dung sẽ không được đưa vào bộ nhớ sẵn.
no-store (không lưu trữ)
Toàn bộ nội dung sẽ không được nhớ sẵn trong bộ nhớ sẵn hoặc trong một tệp tin tạm Internet.
Nếu nội dung đã nhớ sẵn đã cũ, phải gửi yêu cầu đến máy chủ/proxy để xác nhận lại nó.
must-revalidation/proxy-revalidation (phải tái xác nhận / proxy tái xác nhận)
max-age=xxx (xxx là số)
Sau xxx giây, nội dung đã nhớ sẵn trở nên cũ
84
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Bảng 2 cho thấy trình duyệt sẽ gửi lại yêu cầu đến máy chủ hay sẽ sử dụng nội dung đã nhớ sẵn trong các tình huống khác nhau
Nhấn Enter trong cửa sổ gốc Làm mới
Nhấn nút Back
Chỉ thị nhớ sẵn
Mở một cửa sổ trình duyệt mới
public
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt gửi lại yêu cầu đến máy chủ.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
private
Trình duyệt gửi lại yêu cầu đến máy chủ.
Trình duyệt gửi lại yêu cầu đến máy chủ.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Khi xuất hiện lần đầu, trình duyệt gửi yêu cầu đến máy chủ. Sau đó nó biểu hiện trang đó từ bộ nhớ sẵn.
no-cache/no- store
Trình duyệt gửi lại yêu cầu đến máy chủ.
Trình duyệt gửi lại yêu cầu đến máy chủ.
Trình duyệt gửi lại yêu cầu đến máy chủ.
Trình duyệt gửi lại yêu cầu đến máy chủ.
Trình duyệt gửi lại yêu cầu đến máy chủ.
Trình duyệt gửi lại yêu cầu đến máy chủ.
Trình duyệt biểu hiện trang từ bộ nhớ đệm.
must- revalidation/p roxy- revalidation
Khi xuất hiện lần đầu, trình duyệt gửi yêu cầu đến máy chủ. Sau đó nó biểu hiện trang đó từ bộ nhớ sẵn.
max-age=xxx (xxx là số)
Sau xxx giây, trình duyệt gửi lại yêu cầu đến máy chủ.
Trình duyệt gửi lại yêu cầu đến máy chủ.
Sau xxx giây, trình duyệt gửi lại yêu cầu đến máy chủ.
Sau xxx giây, trình duyệt gửi lại yêu cầu đến máy chủ.
85
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Expires
v Trường tiêu đề của thực thể Expires đưa ra ngày và giờ mà sau đó thì đáp ứng được coi là cũ. Một mục nhớ sẵn đã cũ không thể được bộ nhớ sẵn (hoặc một bộ nhớ sẵn của proxy hoặc một bộ nhớ sẵn của tác nhân người sử dụng) trả lại một cách bình thường, nếu nó trước tiên không được xác nhận bởi máy chủ gốc (hoặc bởi một bộ nhớ sẵn trung gian mà có một bản sao tươi mới của thực thể). (Ghi chú: chỉ thị điều khiển nhớ sẵn max-age và s-maxage sẽ đè lên tiêu đề Expires.)
v Expires nhận các giá trị theo khuôn dạng sau: "Expires: Sun, 08 Nov 2009 03:37:26 GMT". Nếu ngày mà nội dung được xem đến là trước ngày đã cho, nội dung đó không được coi là hết hiệu lực và sẽ được lấy ra từ bộ nhớ sẵn. Nếu ngày đó đã qua, nội dung bị coi là đã hết hiệu lực, và bộ nhớ sẵn sẽ có một hành động nào đó. Bảng 3-6 cho thấy các hành vi khác nhau của trình duyệt đối với các hoạt động khác nhau của người sử dụng.
86
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Bảng 3. Các hành động ứng với hiệu lực của nhớ sẵn khi người sử dụng mở một cửa sổ trình duyệt mới
Firefox 3.5
IE 8
Chrome 3
Safari 4
Nội dung không cũ.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Nội dung là cũ.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
87
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Bảng 4. Các hành động ứng với hiệu lực của nhớ sẵn khi người sử dụng nhấn Enter trong cửa sổ trình duyệt gốc
Firefox 3.5
IE 8
Chrome 3
Safari 4
Nội dung không cũ.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 304.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 304.
Nội dung là cũ.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
88
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Bảng 5. Các hành động ứng với hiệu lực của nhớ sẵn khi người sử dụng nhấn F5 để làm mới trang
Firefox 3.5
IE 8
Chrome 3
Safari 4
Nội dung không cũ.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 304.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 304.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 304.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 304.
Nội dung là cũ.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
89
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Bảng 6. Các hành động ứng với hiệu lực của nhớ sẵn khi người sử dụng nhấn phím Back hoặc Forward
Firefox 3.5
IE 8
Chrome 3
Safari 4
Nội dung không cũ.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Nội dung là cũ.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
90
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Bảng 6. Các hành động ứng với hiệu lực của nhớ sẵn khi người sử dụng nhấn phím Back hoặc Forward
Firefox 3.5
IE 8
Chrome 3
Safari 4
Nội dung không cũ.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Nội dung là cũ.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
91
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Last-Modified/E-Tag
v Giá trị trường tiêu đề của thực thể Last-Modified (đã sửa đổi
gần nhất) thường được sử dụng như một bộ xác nhận hiệu lực nhớ sẵn (cache validator). Nói đơn giản, một mục trong bộ nhớ sẵn được coi là có hiệu lực nếu thực thể không bị sửa đổi kể từ thời điểm ứng với giá trị Last-Modified. Giá trị trường tiêu đề đáp ứng ETag, một thẻ thực thể, cung cấp một bộ xác nhận hiệu lực nhớ sẵn “mờ đục”. Điều này cho phép sự xác nhận hiệu lực tin cậy hơn trong các tình huống khi việc lưu trữ ngày tháng sửa đổi là rất bất tiện, khi mà độ phân giải một giây của các giá trị ngày tháng HTTP là không đủ, hoặc khi mà máy chủ gốc muốn tránh các nghịch lý nhất định có thể phát sinh từ việc sử dụng ngày tháng sửa đổi.
v Các trình duyệt khác nhau có các hành vi khác nhau đối với
cấu hình. Bảng 7-10 cho biết các hành vi trình duyệt khác nhau đối với các hoạt động khác nhau của người sử dụng.
92
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Last-Modified/E-Tag
Bảng 7. Hành động ứng với Last-Modified E-Tag khi người sử dụng mở một cửa sổ trình duyệt mới
Firefox 3.5
IE 8
Chrome 3
Safari 4
Nội dung không bị thay đổi từ lần truy cập cuối cùng.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 304.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 304.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 304.
Nội dung đã bị thay đổi từ lần truy cập cuối cùng.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
93
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Last-Modified/E-Tag
Bảng 8. Hành động ứng với Last-Modified E-Tag khi người sử dụng nhấn Enter trong cửa sổ trình duyệt gốc
Firefox 3.5
IE 8
Chrome 3
Safari 4
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Nội dung không bị thay đổi từ lần truy cập cuối cùng.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 304.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 304.
Nội dung đã bị thay đổi từ lần truy cập cuối cùng.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
94
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Last-Modified/E-Tag
Bảng 9. Hành động ứng với Last-Modified E-Tag khi người sử dụng nhấn F5 để làm mới trang
Firefox 3.5
IE 8
Chrome 3
Safari 4
Nội dung không bị thay đổi từ lần truy cập cuối cùng.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 304.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 304.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 304.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 304.
Nội dung đã bị thay đổi từ lần truy cập cuối cùng.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
95
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Last-Modified/E-Tag
Bảng 10. Áp dụng thiết lập không có bộ nhớ sẵn và người sử dụng nhấn phím Back hoặc Forward
Firefox 3.5
IE 8
Chrome 3
Safari 4
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Nội dung không bị thay đổi từ lần truy cập cuối cùng.
Nội dung đã bị thay đổi từ lần truy cập cuối cùng.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
96
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Không có thiết lập nào liên quan đến bộ nhớ sẵn
v Nếu bạn không xác định bất kỳ thiết lập nào liên quan đến bộ nhớ sẵn, các trình duyệt khác nhau có các hành vi khác nhau, và đôi khi các hành vi của cùng một trình duyệt lại khác nhau khi được chạy một vài lần trong cùng một tình huống. Điều đó có thể trở nên phức tạp. Ngoài ra, một nội dung nào đó không nên đưa vào bộ nhớ sẵn sẽ được nhớ sẵn, nó có thể gây ra các vấn đề về an ninh.
v Các trình duyệt khác nhau có các hành vi khác nhau.
97
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Không có thiết lập nào liên quan đến bộ nhớ sẵn
Bảng 11. Áp dụng thiết lập không có bộ nhớ sẵn và người sử dụng mở một cửa sổ trình duyệt mới
Firefox 3.5
IE 8
Chrome 3
Safari 4
Mở một trang mới. Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Nhấn Enter trong cửa sổ gốc.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Nhấn F5 để làm mới.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Nhấn phím Back hoặc Forward.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt biểu hiện trang từ bộ nhớ sẵn.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
Trình duyệt gửi lại yêu cầu đến máy chủ. Mã trả về là 200.
98
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Ví dụ áp dụng
v Phần này cung cấp các ví dụ về phân tích một điểm Web để xác định hành vi nhớ sẵn đúng đắn bằng cách sử dụng cả công cụ thương mại của IBM và công cụ mã nguồn mở.
v Roller Weblogger của Apache
v Roller Weblogger của Apache là một ứng dụng Web 2.0 mã nguồn mở. Nó là máy chủ blog Java™ mã nguồn mở điều khiển các blog như blogs.sun.com, blog.usa.gov, IBM Lotus Connections, IBM Developer Works, và nhiều địa chỉ khác.
v Trong bài này, chúng tôi chọn các blog của My developerWorks IBM làm ví dụ để giải thích chi tiết các thiết lập bộ nhớ sẵn. Hình 1 cho thấy một ảnh chụp màn hình của trang blog My developerWorks.
99
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Ví dụ áp dụng
Hình 1. Trang blog My developerWorks
100
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Ví dụ áp dụng
• Trang này có 62 yêu cầu, hầu hết là png, gif, js, hoặc một số kiểu tệp tin tĩnh khác. Khi người sử dụng truy cập trang này lần đầu tiên, phải mất khoảng 16 giây để hoàn thành việc hiển thị toàn trang trong trình duyệt. Nếu bạn xác định được đúng đắn các thiết lập của bộ nhớ sẵn thì phần lớn các tài nguyên sẽ được đưa vào bộ nhớ sẵn ở phía trình duyệt. Do đó, khi người sử dụng truy cập trang này một lần nữa thì số lượng các yêu cầu cho trang này giảm còn 22, và sẽ chỉ mất khoảng 6 giây để tải. Trải nghiệm của người sử dụng cải thiện một cách đáng kể.
• Bây giờ chúng ta sẽ phân tích một số thiết lập quan trọng đối với bộ nhớ sẵn dành cho yêu cầu. Kết quả liên quan đến Weblogger nhìn thấy trong hình 2.
101
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Hình 2. Tiêu đề của đáp ứng từ trang nhà các blog My developerWorks 1
Trước hết, Cache-Control đè lên các thiết lập Last-Modified, vì vậy trang này có thể được đưa vào bộ nhớ sẵn trên máy cục bộ trong 5 giây, nhưng phải xác nhận hiệu lực lại nếu nội dung là cũ. Khi một người sử dụng truy cập trang này, trình duyệt trước tiên sẽ kiểm tra bộ nhớ sẵn cục bộ để xác định xem các tệp cục bộ đã hết hiệu lực chưa. Nếu nội dung là cũ, trình duyệt sẽ gửi một yêu cầu đến máy chủ để so sánh dấu thời gian Last-Modified. Nếu tệp tin đáp ứng có cùng một nhãn thời gian Last- Modified, máy chủ trả về mã 304 cho trình duyệt để báo rằng tệp tin đáp ứng cũng như nhau
102
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Hình 3. Tiêu đề của đáp ứng từ trang nhà các blog My developerWorks 2
Thiết lập Cache-Control này chỉ ra rằng đáp ứng này không thể đưa vào bộ nhớ sẵn được. Từ quan điểm nghiệp vụ, yêu cầu này được dùng để kiểm tra xác thực và uỷ quyền của người sử dụng, nó không nên được đưa vào bộ nhớ sẵn.
103
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Hình 4. Tiêu đề của đáp ứng từ trang nhà các blog My developerWorks 3
Tệp tin đáp ứng này là một tệp thư viện JavaScript rất hiếm khi bị sửa đổi nên nó có độ tuổi tối đa (max-age) bằng một ngày.
104
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Ví dụ áp dụng
Trung tâm Mashup (Mashup Center)
v Trung tâm Mashup được thiết kế để cung cấp một giải pháp
mashup nghiệp vụ dễ sử dụng, hỗ trợ một quá trình lắp ráp các phần mềm ứng dụng theo tình huống động, sống còn đối với hoạt động của doanh nghiệp (line-of-business) — với các khả năng an ninh và điều quản mà CNTT yêu cầu. Nó gồm có Lotus Mashups và InfoSphere MashupHub. Hình 5 cho thấy một ảnh chụp nhanh của Lotus Mashups đang hoạt động.
105
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Hình 5. Trang chủ Mashup
106
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Hình 6. Tiêu đề đáp ứng của trang nhà Mashup 1
107
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
Hình 7. Tiêu đề đáp ứng của trang nhà Mashup 2
v Đây là trang chính cá nhân, nó không nên được đưa vào bộ nhớ sẵn. Chú ý giá trị ngày tháng Expires (hết hiệu lực) được đặt ở một ngày rất xa trong quá khứ sao cho nó sẽ luôn được làm mới.
108
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
v Tóm tắt v Do tính phức tạp của nhiều trình duyệt, các thiết lập bộ nhớ sẵn đúng đắn là rất quan trọng. Trong bài này, chúng tôi đã mô tả các cách làm tốt nhất sau đây:
v Nhớ sẵn càng nhiều tệp tin càng tốt để có thể giảm bớt thời gian tải về và cải
thiện hiệu năng.
v Hãy sử dụng các chỉ thị điều khiển nhớ sẵn (cache-control) để xác định hành vi bộ nhớ sẵn càng nhiều càng tốt, nhất là đối với IE. Điều này làm giảm bớt sự không nhất quán giữa các trình duyệt khác nhau và là cách tốt nhất để cải thiện hiệu năng.
v Đừng sử dụng "no settings related with cache." (không có thiết lập nào về bộ
nhớ sẵn).
v Với các thiết lập mặc định, khi được mở mới, trình duyệt IE hầu như luôn luôn
gửi một yêu cầu đến phía máy chủ để lấy ra dữ liệu.
v Nếu một trang không nên đưa vào bộ nhớ sẵn, hãy sử dụng " no-cache, no- store" để chắc chắn rằng trang đó sẽ không được đưa vào bộ nhớ sẵn, nhất là khi dữ liệu đó liên quan đến an ninh hoặc thông tin nhạy cảm.
v Nếu không cần thiết, không sử dụng yêu cầu kiểu POST, vì nó không thể đưa
vào bộ nhớ sẵn được.
109
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
v Ứng dụng 2.0 nào không thể thiếu với bạn?
1.
del.icio.us là site bookmark hàng đầu, tôi đang dùng một plugin của Firefox để giúp bookmark các bài viết ưa thích nhanh hơn. Điều phiền toái duy nhất là cách tag theo từ, chứ không phải cụm từ làm cho danh mục bị phân mảnh và khó tìm được bài lưu trữ. Ngoài ra, nhiều trang web đã biến mất sau một thời gian.
2. Digg chủ yếu để theo dõi các tin nóng. Nhưng đa số là tin “made in
USA” nên nhiều khi khá vô bổ.
3.
Firefox: Khỏi cần nói, tôi dùng Firefox làm trình duyệt mặc định với hàng chục plugin. Đây chính ứng dụng mà tôi “couldn’t live without”. Tuy nhiên có lẽ do overuse trình duyệt này nên nó chiếm RAM kinh khủng. Disclosure: gần hơn 70% người truy cập vào blog này dùng Firefox.
4.
Flickr: Tôi không dùng ứng dụng này nhiều do ít có hứng thú chụp hình, chủ yếu để lưu trữ hình của gia đình.
5. Gmail: Sure, đây là ứng dụng mail cách mạng.
110
slide.tailieu.vn
Logo
10. Cải thiện hiệu năng của các ứng dụng Web
v Ứng dụng 2.0 nào không thể thiếu với bạn?
6. Google Reader: Tôi không khoái trình đọc RSS này lắm vì nó hơi
thô sơ. Tôi dùng FeedReady!
7. Netvibes: Tôi là fan của Netvibes, với hàng ngàn plugin đây là
trang chủ trên cả tuyệt vời.
8.
TechMeme: Trang web nên đọc hàng ngày cho dân sính công nghệ.
9.
Technorati: Tôi dùng nó chủ yếu để xem xếp hạng blog.
10. WordPress: Tất nhiên đây là ứng dụng không thể thiếu vì blog này làm trên WordPress. Nhiều plugin của WordPress rất có giá trị nhưng đôi khi phải mất khá nhiều thời gian mới dùng được.
11. YouTube: Quá chậm nếu xem từ Việt Nam. Tôi thích Clip.vn hơn.
12. Zoho: Tôi ít dùng Zoho vì nó hơi chậm so với Google Docs.
111
slide.tailieu.vn
Logo
CÂU HỎI ÔN TẬP
1.
Lập bảng so sánh tính năng giữa Web 1.0 và Web 2.0
2. Phân tích điểm khác nhau giữa web tĩnh (static) và web động
(dynamic)
3. Phân tích kiến trúc của web 1.0 và web 2.0 (client server &
webservices)
4. Bạn biết gì về dịch vụ Đánh dấu xã hội (social bookmarking)
cho ví dụ cụ thể
5. Phân tích công nghệ AJAX trong web 2.0 6. Phân tích tính năng kỹ thuật “Giữa hệ thống với hệ thống,
giữa ứng dụng với ứng dụng” của Web 2.0
7. Bạn biết gì về FaceBook cho ví dụ cụ thể
8.
Liệt kê các ứng dụng của Web 2.0. Cho ví dụ
112
slide.tailieu.vn
Logo
CÂU HỎI ÔN TẬP
1. Liệt kê các yếu tố Thiết kế tương tác. Phân tích và cho một ví dụ của một nguyên tắc mà bạn cho là quan trọng.
2. Phân tích nguyên tắc thiết kế hướng người dùng. 3. Phân tích 10 nguyên tắc thiết kế, mỗi nguyên tắc
cho 1 ví dụ
4. Prototype là gì? Có cần thiết phải làm Prototype
không? Vì sao? Cho ví dụ minh họa
5. Thiết kế tương tác là gì? Trình bày các nguyên tắc
113
thiết kế tương tác cho game, cho ví dụ cụ thể

