Xem mẫu
- BÁO CÁO
ĐỒ ÁN TỐT NGHIỆP ĐẠI HỌC
ĐỀ TÀI:
TÌM HIỂU VÀ XÂY DỰNG ỨNG DỤNG
DỰA TRÊN CÔNG NGHỆ AJAX
Sinh viên thực hiện : Phạm Thị Thu Duyên
Lớp : CT702
Giáo viên hướng dẫn: TS. Nguyễn Ngọc Hóa
1
- Nội dung
• Giới thiệu công nghệ AJAX
• Các công nghệ cấu thành AJAX
• XMLHttpRequest và trao đổi dữ liệu bất
đồng bộ
• Ứng dụng AddressBook
• Kết luận và hướng phát triển
2
- Nội dung
• Giới thiệu công nghệ AJAX
• Các công nghệ cấu thành AJAX
• XMLHttpRequest và trao đổi dữ liệu bất
đồng bộ
• Ứng dụng AddressBook
• Kết luận và hướng phát triển
3
- Sự phát triển của Web
• 1990, Tim Berners-Lee sáng chế ra
HTML=>mở ra kỷ nguyên WWW
Không có sự tương tác qua Web
• Web 1.0 và các trang web động
Các ứng dụng tương tác như eCommerce,
forum…
Các công nghệ sử dụng JavaScript,
ASP/ASP.NET, JSP/Servlet, PHP…
4
- Mô hình ứng dụng Web truyền thống
5
- Mô hình tương tác đồng bộ client/server
6
- Nhược điểm
• Cách thức tương tác với người dùng: đồng
bộ client/server.
Đợi phía server đáp ứng yêu cầu
Nạp lại toàn bộ trang web sau mỗi tương tác
• Một số rào cản khác (hoạt động qua trình
duyệt…)
7
- Giải pháp và công nghệ thực tế
• Chỉ cập nhật các phần bị thay đổi của
trang Web
• Trao đổi dữ liệu bất đồng bộ client/server
• AJAX xuất hiện như một giải pháp
• Một công nghệ của Web 2.0
8
- Asynchronous JavaScript And XML
• AJAX là tập hợp của nhiều công nghệ với
thế mạnh của riêng mình để tạo thành
một sức mạnh mới.
Thể hiện web theo chuẩn XHTML và CSS
Nâng cao tính năng động và phản hồi bằng DOM
Trao đổi và xử lý dữ liệu bằng XML và XSLT
Truy cập dữ liệu bất đồng bộ bởi XMLHttpRequest
Liên kết công nghệ bằng JavaScript
9
- Mô hình tương tác không đồng bộ với AJAX
10
- Nội dung
• Giới thiệu công nghệ AJAX
• Các công nghệ cấu thành AJAX
• XMLHttpRequest và trao đổi dữ liệu bất
đồng bộ
• Ứng dụng AddressBook
• Kết luận và hướng phát triển
11
- Các công nghệ cấu thành AJAX
• Cascading Style Sheet (CSS): Bảng
định kiểu xếp chồng
• Document Object Model (DOM): Mô
hình đối tượng tài liệu
• eXtensible Markup Language (XML):
Ngôn ngữ đánh dấu mở rộng
• JavaScript: Ngôn ngữ kịch bản phía client
• XMLHttpRequest
12
- Sự kết hợp các công nghệ
• JavaScript
• DOM & JavaScript
• CSS
• XMLHttpRequest & JavaScript: truyền
thông giữa client/server
• Dữ liệu dạng XML
13
- Nội dung
• Giới thiệu công nghệ AJAX
• Các công nghệ cấu thành AJAX
• XMLHttpRequest và trao đổi dữ liệu bất
đồng bộ
• Ứng dụng AddressBook
• Kết luận và hướng phát triển
14
- XMLHttpRequest
• Công nghệ trọng tâm của AJAX
• Thành phần ActiveX trong IE 5.0
• Không là chuẩn của W3C nhưng được hầu
hết các trình duyệt hỗ trợ
• Thực hiện một cách bất đồng bộ:
Gửi các yêu cầu (request) tới server
Nhận các đáp ứng (response) từ server
15
- XMLHttpRequest
• Tạo XMLHttpRequest bằng JavaScript
Kiểm tra trình duyệt có
phải là IE hay không?
var xmlHttp;
function createXMLHttpRequest() {
if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
}
Tạo đối tượng XMLHttpRequest Tạo đối tượng XMLHttpRequest cho
cho các trình duyệt non-IE IE dưới dạng một ActiveXObject
16
- Mô hình ứng dụng AJAX
17
- Một số ứng dụng dùng AJAX
• Xử lý văn bản trên Net
• Giao tiếp, liên lạc
• Chia sẻ và lưu trữ file
• Bản đồ trực tuyến
.........
18
- http://maps.google.com/
19
- Nội dung
• Giới thiệu công nghệ AJAX
• Các công nghệ cấu thành AJAX
• XMLHttpRequest và trao đổi dữ liệu bất
đồng bộ
• Giới thiệu ứng dụng AddressBook
• Kết luận và hướng phát triển
20
nguon tai.lieu . vn
