1. Trang chủ
  2. » Công Nghệ Thông Tin

Bài giảng Lập trình Web ASP.Net với C#: Chương 8 - Th.S Phạm Đào Minh Vũ

65 17 0

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Định dạng
Số trang 65
Dung lượng 1,96 MB

Các công cụ chuyển đổi và chỉnh sửa cho tài liệu này

Nội dung

Chương 8 - Công nghệ và dịch vụ Web. Những nội dung chính trong chương gồm: giới thiệu các ứng dụng phân tán, kiến trúc hướng dịch vụ, Web service & lập trình Web service, giới thiệu Ajax, dùng Ajax với đối tượng XmlHttpRequest, dùng Ajax với thư viện AJax ASP.net. Mời các bạn cùng tham khảo.

Trang 1

Giảng Viên: Th.S Phạm Đào Minh Vũ Email: phamdaominhvu@yahoo.com

1

LẬP TRÌNH WEB ASP.NET VỚI C#

Trang 2

Chương 8 Công Nghệ Và Dịch Vụ Web

8.1 Dịch vụ web – Webservice

8.2 Công nghệ web 2 – Ajax

Trang 4

8.1.1 CÁC ỨNG DỤNG PHÂN TÁN

Máy tính

Dữ liệu

Ứng dụng phân tán

Dữ liệu

Trang 5

327

8.1.1 CÁC ỨNG DỤNG PHÂN TÁN

Khoa CNTT Trường CĐ CNTT TP.HCM

 Xem thông tin thời tiết

 Thông tin ngoại tệ

 Dịch tự động

 Kiểm tra thông tin thẻ

 Xem thông tin sân bay

 Đặt phòng khách sạn

 …

Trang 6

8.1.2 VẤN ĐỀ KHI THIẾT KẾ HỆ PHÂN TÁN

Trang 7

329

8.1.3 WEB SERVICE

Khoa CNTT Trường CĐ CNTT TP.HCM

 WEB SERVICE LÀ GÌ?

Trang 8

8.1.3.1 ĐỊNH NGHĨA

• Là một tập các phương thức được gọi từ xa thông qua một địa chỉ URL do một tổ chức, cá nhân cung cấp

• Giao tiếp theo định dạng chuẩn XML

• Được sử dụng để tạo các ứng dụng phân tán

Trang 9

331

8.1.3.2 ĐẶC ĐIỂM

Khoa CNTT Trường CĐ CNTT TP.HCM

1 Không phụ thuộc vào ngôn ngữ lập trình

3 Hỗ trợ thao tác giữa các thành phần không

đồng nhất

4 Chi phí phát triển thấp

5 Dễ bảo trì

Trang 10

8.1.3.3 KIẾN TRÚC WEBSERVICE

Service Broker

Trang 14

8.1.3.4 Thử nghiệm

 Kết quả :

Trang 15

337

8.1.3.4 ngôn ngữ WSDL

Khoa CNTT Trường CĐ CNTT TP.HCM

WSDL (Web Service Description Languague)

Trang 16

8.1.3.5 SỬ DỤNG WEBSERVICE

 Sử dụng webservice trong ASP.NET

protected void Button1_Click(object sender, EventArgs e) {

CongHaiSo c2s = new CongHaiSo();

Trang 18

8.1.3.5 SỬ DỤNG WEBSERVICE

 Bước 2 : Nhập thông tin đường dẫn

Trang 19

341

8.1.3.4 SỬ DỤNG WEBSERVICE

Khoa CNTT Trường CĐ CNTT TP.HCM

Trang 20

8.1.3.5 SỬ DỤNG WEBSERVICE

 Bước 3 : Thiết kế giao diện

Trang 21

343

8.1.3.4 SỬ DỤNG WEBSERVICE

Khoa CNTT Trường CĐ CNTT TP.HCM

 Bước 4: Xử lý code :

Trang 22

8.1.3.5 SỬ DỤNG WEBSERVICE

 Kết quả được lấy ngày 10/11, luc 12h00

Trang 23

345

8.1.3.6 BÀI TẬP

Khoa CNTT Trường CĐ CNTT TP.HCM

 Tìm hiểu cách viết webservice kết nối CSDL

 Tìm cách sử dụng các nguồn webservice hiện đang

có trên internet

Ứng dụng vào đồ án ASP.NET

Trang 24

8.2 CÔNG NGHỆ WEB AJAX

Trang 25

347

8.2 CÔNG NGHỆ WEB AJAX

Khoa CNTT,Trường CĐ CNTT TP.HCM

Trang 26

8.2.1.1 Giới thiệu Ajax

• Mỗi khi Browser gửi yêu cầu về server, bắt buột phải

reload lại toàn bộ trang web

• Công nghệ Ajax giúp Browser gửi yêu cầu đến server

và nhận respone mà không cần load lại toàn bộ trang

• Công nghệ này có thể thực hiện bất đồng bộ (người

dùng vẫn có thể tương tác với trang web trong khi vẫn chờ nhận response từ server)

Trang 27

349

8.2.1.1 Giới thiệu Ajax

Trường CĐ CNTT TpHCM

Trang 28

8.2.1.2 Ajax là gì?

Ajax : Asynchronous Javascript and XML

(Truy cập dữ liệu không đồng bộ bằng Javascript & XML )

Javascript được các nhà phát triển đánh giá rất cao

trang

Trang 29

351

8.2.1.3 Mô hình AJAX

Trường CĐ CNTT TpHCM

<= Mô hình Client-Server thông thường

Mô hình Client-Server AJAX =>

Trang 30

8.2.1.3 Đặc điểm của Ajax

nội dung trang web với người dùng

cho phép hiển thị nội dung và các tương tác liên quan DOM mở ra nhiều cách thức mạnh cho người dùng khi muốn truy cập và thao tác với đối tượng nằm trong

một văn bản bất kỳ

Trang 31

353

8.2.1.3 Đặc điểm của Ajax

Trường CĐ CNTT TpHCM

kiểu định dạng cho dữ liệu, cho phép thao tác, truyền tải và trao đổi giữa client và server

một cách hiệu quả (JavaScript ở đây là ECMAScript, chuẩn của ECMA, không phải của MS)

Trang 32

Web Application truyền thống

webserver sẽ gửi trả response chứa các thông tin yêu cầu dưới dạng HTML và CSS

mới có thể thao tác tiếp

Trang 33

355

Web AJAX Application

Trường CĐ CNTT TpHCM

=> giảm tải rất nhiều cho Server

tức thời (không cần nạp lại trang)

giao diện tốt hơn nhiều và giảm đáng kể dung lượng phải nạp

Trang 34

Web AJAX Application

tiếp này

AJAX Engine thực hiện Thay vì gửi trả dữ liệu về dưới dạng HTML và CSS cho trình duyệt, web server sẽ gửi trả về dạng XML và AJAX Engine sẽ tiếp nhận, phân

tách và chuyển hóa thành XHTML và CSS cho trình

Trang 38

DOM – Document Object Model

• Mô hình đối tượng tài liệu (thường có dạng cây), dùng

để mô tả và truy xuất các thành phần trong tài liệu

Trang 41

363

Trường CĐ CNTT TpHCM

Trang 42

8.2.3 Đối tượng XmlHttpRequest

• Một đối tượng Javascript cho phép tạo các HTTP

request không đồng bộ

• XmlHttpRequest sẽ tạo các request từ một sự kiện

Javascript

• Một hàm gọi ngược (call back) của Javascript được

gọi tại mỗi trạng thái của Request và nhận đáp trả Response từ Server

Trang 44

Các phương thức của XmlHttpRequest

Trang 45

Các thuộc tính của XmlHttpRequest

Trường CĐ CNTT TpHCM

367

Trang 46

8.2.5 Lập trình AJAX

Các bước thực hiện :

1 Tạo một trang web

2 Tạo một hàm để lấy đối tượng XmlHttpRequest

3 Viết hàm để bắt tình trạng của XmlHttpRequest

4 Tạo một hàm xử lý kết quả trả về

5 Kết nối tất cả vào trang web

Trang 47

369

Ví dụ 1 : Thay đổi ngày giờ

Trường CĐ CNTT TpHCM

369

Trang 48

Ví dụ 1 : Thay đổi ngày giờ

Tạo trang web hello.html

Trang 49

function Hello () { … }

function GetXmlHttpObject () { … }

</script>

</head>

<body>

<a href="javascript:Hello();">Click here to load data</a>

<div id="result" align="center">Content of hello file</div>

</body>

</html>

Trang 52

}

}

Trang 54

Ví dụ 1 : (tt)

Kết quả :

Khi click vào liên kết nội dung trong thẻ div được tải lại từ server nhưng không tải cả trang web

Trang 55

377

Chú ý

Trường CĐ CNTT TpHCM

• Nếu dữ liệu từ server gửi về là dữ liệu có cấu trúc :

Xml, DataTable, Array,… thì hàm handle phải được viết lại để phân tích dữ liệu đó rồi mới xuất ra màn hình

Trang 56

var thamso = "a=" + a + "&b=" + b;

var url = "Conghaiso.aspx?"+thamso;

Trang 57

function Tinhtong()

{ … } function GetXmlHttpObject() { … }

</script>

</head>

<body>

<div>Nhập số A :</div> <input id="txt_a" type="text" /><br />

<div>Nhập số B :</div> <input id="txt_b" type="text" /><br />

<input id="Button1" type="button" value="Tính tổng" onclick="Tinhtong()" />

Trang 58

3 Ajax với đối tượng ASP.NET AJAX

• ASP.NET AJAX là một thành phần mở rộng của

ASP.NET 2.0, cho phép phát triển các ứng dụng web với tính năng AJAX

• ASP.NET bao gồm một framework các script client, các

control server, …

• Việc sử dụng ASP.NET đơn giản nhất là sử dụng bộ

thư viện control của ASP.NET

Trang 59

• Hiện tại bộ control AJAX có 3 phiên bản

• Toolkit 2.0 : Net Framework 1.1, 2.0 (VS 2003, 2005)

• Toolkit 3.5 : Net Framework 3.0, 3.5 (VS 2008)

• Toolkit 4 : Net Framework 4.0 (VS 2010)

Trang 60

Cài đặt ASP.NET AJAX control toolkit (tt)

• Sau khi tải bộ Toolkit, mở VS tương

ứng và kéo file AjaxControlToolkit.dll

vào trong thanh toolbox

• Tạo một project Website với

Framework tương ứng và mở thanh

toolbox (sẽ thấy các control AJAX)

Trang 61

383

Ứng dụng 1 : Sách theo giá

Trường CĐ CNTT TpHCM

• Trang liệt kê sách theo giá khi chưa sử dụng AJAX

• Mỗi khi chọn giá, trang web phải thực hiện mã lệnh ở server,

rồi load toàn bộ trang web lại để hiện thị danh sách mới

Trang 62

• Kéo thả control Script Manager vào trang web

(các trang web có sử dụng AJAX cần phải có control Script Manager để quản lý script)

• Kéo thả control Update Panel vào trang web

• Kéo các control là nguyên nhân của việc load lại trang web và

Trang 64

Ứng dụng 1 : CHÚ Ý

làm thêm các bước sau :

hiện hành

Website->ASP.NET AJAX-Enabled Web Site->OK

 sau đó copy nội dụng của file Webconfig ở Website mới vào file WebConfig của Website củ (chỉnh lại chuỗi kết nối

Ngày đăng: 09/05/2021, 14:54

TỪ KHÓA LIÊN QUAN

🧩 Sản phẩm bạn có thể quan tâm

w