Bài giảng Công nghệ Web và ứng dụng (GV Nguyễn Minh Vi)

Ứng dụng web dựa trên Workflow  Được tổ chức để xử lý các công việc giữa các bộ phận trong các tổ chức xã hội hoặc các doanh nghiệp  Ví dụ: Chính phủ điện tử e-Government  Vai trò củ

Trang 1

Tổng quan về Web

Trang 2

Phân loại trang web

 Trang web tĩnh:

 Là trang được lưu trữ sẵn trên server

 Khi có yêu cầu từ phía client, trang này sẽ được tải về và hiển thị trên browser

Trang 3

Phân loại trang web

 Trang web có nhúng các Applet và Script:

Trang 4

Mô hình web tĩnh

Trang 5

Mô hình Web động

Trang 6

N gôn ngữ phía Server

Trang 7

ASP.NET

 Ví dụ một đoạn code

Trang 9

Ruby

trợ Ruby, phải cấu hình thêm nếu sử dụng

Trang 10

Python

(đặc biệt trên Linux)

 Ví dụ một đoạn code:

Trang 11

Sự phát triển của công nghệ Web

Trang 12

Công nghệ Web

dùng để phân tích, thiết kế, thực hiện,

kiểm thử, vận hành và bảo trì các ứng

dụng Web với chất lượng cao nhất

trên nền web

Trang 13

 Thu thập yêu cầu

Trang 14

Sự phát triển của công nghệ Web

Trang 15

Các loại Web

Doc-Centric

Interactive, Transactional

Workflow Based

Social Web

Portal Oriented

Semantic Web

Development History

Trang 17

Web tương tác & giao dịch

(Interactive/Transactional)

tạo ra trang web động

 Cập nhật nội dung thông qua phiên giao dịch

 Không tập trung (Decentralized)

 Kết nối với cơ sở dữ liệu

Trang 18

Ứng dụng web dựa trên Workflow

 Được tổ chức để xử lý các công việc giữa các bộ phận trong các tổ chức xã hội hoặc các doanh nghiệp

 Ví dụ: Chính phủ điện tử (e-Government)

 Vai trò của Web services: khả năng cộng tác, kết nối mềm

 Độ phức tạp rất cao

Trang 20

Cổng thông tin điện tử

 Một điểm truy cập với rất nhiều thể loại thông tin khác nhau

Trang 21

Web ngữ nghĩa (Semantic Web)

 Các hệ thống thông tin có thể giao tiếp với nhau, phân tích và diễn giải ý nghĩa của

mọi dữ liệu

 VD: wolframalpha

 Giúp dữ liệu có thể được chia sẻ và tái sử dụng xuyên suốt nhiều ứng dụng

 Một số định dạng chung cho lưu trữ, chia

sẻ dữ liệu: XML, JSON, OWL, RDF

Trang 22

Web ứng dụng ở Việt Nam

 Quản lý nội dung

 Các trang tin tức trực tuyến, tin tức doanh nghiệp, tin tức của các tổ chức đoàn thể

 Các trang bán hàng trực tuyến

 Dịch vụ Web (web service)

 Dịch vụ web của ngân hàng

 Cổng thông tin điện tử

Trang 23

Others

Trang 24

Kiến trúc Web

Trang 25

Nội dung

 Kiến trúc web

Trang 26

Kiến trúc Web

 Kiến trúc Web Platform

 Platform

• Hardware

• Software modules & configurations

• Choice of software platform (e.g., J2EE, NET)

 Kiến trúc Web Application

 Mô hình hóa các tiến trình xử lý

 Trong một lĩnh vực cụ thể

 Module hóa và phức tạp

Trang 27

Kiến trúc Web Platform

 Web platform dựa trên các thành phần sau

 Các thành phần của intranet (web server,

application server, database, web services)

Trang 28

HTTP Server

HTTP for transport

URL/URI for addressing

HTML/XHTML

for display

PHP, python etc

for interaction

Trang 29

Mô hình Web (các tầng giao thức)

SONET interface

IP

SONET interface

Ethernet interface

Trang 31

Giao dịch của HTTP

một response (một phản hồi của một request nào đó) giữa web client và web server

GET / HTTP/1.1 Accept: image/gif, image/x-xbitmap, image/ jpeg, image/pjpeg, */*

Accept-Language: en-us Accept-Encoding: gzip, deflate User-Agent: Mozilla/4.0 (compatible;

MSIE 5.01; Windows NT) Host: www.eurecom.fr Connection: Keep-Alive

Client Origin

server

HTTP/1.1 200 OK Date: Mon, 15 Jul 2002 08:49:00 GMT Server: Apache/1.3.26 (Unix) PHP/4.2.1 Last-Modified: Wed, 12 Jun 2002 08:49:49 GMT

ETag: "2a-50ea-3d070b2d"

Accept-Ranges: bytes Content-Length: 20714 Keep-Alive: timeout=15, max=100 Connection: Keep-Alive

Content-Type: text/html

<html>

HTML

Trang 32

HTTP Message

 HTTP message ở dạng ASCII text, gồm:

Method Request-URI HTTP-Version (Request-Line)

HTTP-Version Status-Code Reason-Phrase (Status-Line)

Trang 33

Accept-Encoding: gzip, deflate

User-Agent: Mozilla/4.0 (compatible; MSIE 5.01; Windows NT)

Host: www.eurecom.fr

Connection: Keep-Alive

<CR>

GET /foo.html HTTP/1.1 — request "/foo.html" using HTTP version 1.1

Accept: — types of documents accepted by browser

Accept-Language: — preferred language is english

Accept-Encoding: — browser understands compressed documents

User-Agent: — identification of browser (real type is IE 5.01)

Host: — what the client thinks the server host is

Connection: — keep TCP connection open until explicitly disconnected

Trang 34

HTTP Response

 Ví dụ:

HTTP/1.1 200 OK

Date: Mon, 15 Jul 2002 08:49:00 GMT

Server: Apache/1.3.26 (Unix) PHP/4.2.1

Last-Modified: Wed, 12 Jun 2002 08:49:49 GMT

HTTP/1.1 200 OK — document found (code 200); server is using HTTP 1.1

Date: — current date at the server

Server: — software run by the server

Last-Modified: — most recent modification of the document

ETag: — entity tag (unique identifier for the server resource, usable for caching)

Accept-Ranges: — server can return subsections of a document

Content-Length: — length of the body (which follows the header) in bytes

Connection: — the connection will close after the server's response

Content-Type: — what kind of document is included in the response

<html> — document text (follows blank line)

Trang 35

Client Methods

 GET

Retrieve a resource from the

server (static file, or

dynamically-generated data)

Get information about a

resource (but not the actual

resource)

Client provides some

information to the server, e.g.,

through forms (may update

the state of the server)

 PUT

Provide a new or replacement

resource to put on the server

Ask proxies to declare themselves in the headers (used for debugging)

Used for HTTPS (secure HTTP) through a proxy

Trang 36

HTTP Caching

 Dữ liệu Cache gần người dùng hơn

GET http://origin/

Client 1

Cache server Origin server

Trang 37

HTTP Client Authentication

 Cơ chế bảo mật đơn giản thông qua username/password

echo - n “user:password" | openssl base64

echo "c2NvdHQ6dGlnZXI=" | openssl base64 -d

HTTP/1.1 401 Unauthorized WWW-Authenticate: Basic realm="secret"

GET /private/ HTTP/1.1 Authorized: Basic SHY3GH7D3SH==

Username: joe Password: ********

Trang 38

Cookies

 Cho phép Web servers lưu

trạng thái của Client

 Dùng cặp khóa – giá trị

phiên giao dịch session

 Cookie có thể truy xuất bởi

một site/domain

 Server có thể định thời gian

hết hạn

 Client có thể từ chối cookie,

giới hạn kích thước, thời

gian…

Client

Origin server

GET http://origin/

200 OK Set-Cookie: ABC=XYZ

GET http://origin/

Cookie: ABC=XYZ

200 OK

Trang 39

Mô hình: Model View Controller

 Mô hình được sử dụng trong Smalltalk

(1979)

 Tách riêng giữa tầng dữ liệu và hiển thị

 Dễ dàng phát triển

Trang 40

Mô hình: Model View Controller

 Model

 Tượng trưng cho dữ liệu trong phần mềm

ứng dụng

 View

 Tầm nhìn hay khung nhìn (view) bao gồm các

thành phần của giao diện người dùng

 Controller

 Q uản lý sự trao đổi dữ liệu

 C ác nguyên tắc nghề nghiệp trong các thao

tác liên quan đến mô hình

Trang 41

Model-View-Controller 2 cho

Web

 Kết nối không bền vững giữa client và server

 Thông báo những thay đổi

 Truy vấn lại server để phát hiện những thay đổi

Trang 43

Client/Server (2-Layer)

Trang 44

N-Layer Architectures

Client

Application Server (Business Logic, Connectors, Personalization, Data Access)

Presentation Layer

Firewall Proxy Web Server

DBMS B2B

Backend (Legacy Application, Enterprise Info System)

Business Layer

Data Layer

Trang 45

N-Layer Architectures

Trang 46

Vì sao dùng N-Layer Architecture?

Trang 47

JSP-Model-1 Architecture

Trang 50

Trang 51

2

Nội dung

 Giới thiệu về công nghệ Web

 Công nghệ trên Server

 Công nghệ trên Client (browser)

Trang 52

Giới thiệu công nghệ Web

3

Client-side

Programming

Clients (browsers)

HTTP for transport

URL/URI for addressing

HTML

for display

WML

XML dialects XSLT (Transformations)

FML

XHTML

Server Side Programming

(X)HTML XML

HTTP Server

Trang 53

Từ Web 1.0 đến Web 3.0

 Trang chứa các liên kết

 Nội dung: text, images, media

 Mục đích Web2.0 hướng tới cộng đồng, xã

hội: YouTube, Wikipedia

 Công nghệ: Ajax, Adobe Flash, XHTML,

SOA…

4

Trang 55

Web 2.0

6

Trang 58

Apache

rãi nhất thế giới

 Chạy trên các hệ điều hành: Windows,

Linux, Unix, FreeBSD, Solaris, …

 Các tính năng: chứng thực người dùng,

virtual hosting, hỗ trợ CGI, FCGI, SCGI,

WCGI, SSI, ISAPI, HTTPS, Ipv6, …

Trang 59

Nginx

định, cấu hình đơn giản và hiệu suất cao

 Chạy trên các hệ điều hành: Linux,

FreeBSD, Windows, Solaris, MacOS…

 Các tính năng: chứng thực người dùng,

hỗ trợ HTTPS, virtual hosting, hỗ trợ

FastGCI, hỗ trợ Ipv6…

Trang 60

Internet Information Services

(IIS)

 IIS do Microsoft phát triển, tích hợp cùng

hệ điều hành Windows IIS bao gồm nhiều dịch vụ như: dịch vụ Web Server, dịch vụ FTP Server

 IIS hỗ trợ chứng thực người dùng, virtual hosting, CGI, FCGI, ISAPI, php, hỗ trợ

Ipv6, …

Trang 61

Apache Tomcat

 Apache Tomcat là một Java Servlet được

phát triển bởi Apache Software Foundation

 thi hành các ứng dụng Java Servlet và

Trang 62

Lighttpd

 Lighttpd là một phần mềm mã nguồn mở,

chiếm ít tài nguyên

 C hạy trên hệ điều hành Linux, Windows, Mac OS,…

 Lighttpd hỗ trợ FastCGI, SCGI, CGI cho phép

nó chạy được các ứng dụng web được viết bằng bất cứ ngôn ngữ nào

 Các tính năng như chứng thực, hỗ trợ

HTTPS, virtual hosting, hỗ trợ Ipv6,…

 Lighttpd không hỗ trợ ISAPI (Internet Service

Application Programming Interface)

Trang 63

Database

14

Trang 66

Tương tác ở phía Client

17

Trang 67

Công nghệ dùng trên Client

Code sẽ được thực hiện

bên ngoài trình duyệt (a

Trang 68

Java vs Applets vs Java Plug-in

19

 Java Plug-in extends the browser

 Applets or Java Beans run under JRE

Java bytecode

Server

JVM (browser)

Java bytecode

Client

Network File

system

 An Applet is a class that

extends Applet , executed in a browser

JRE

System

Trang 69

PHP

Trang 70

Giới thiệu về PHP

 PHP (Hypertext Preprocessor)

 Là ngôn ngữ script chạy trên server (Server Scripting)

 Là mã nguồn mở, chạy được trên nhiều

platforms (Unix, Linux, Windows)

 PHP scripts:

• chứa text, thẻ HTML, script

• trả về kết quả cho trình duyệt một plain HTML

2

Trang 71

Giới thiệu về PHP (tt)

 Lịch sử phát triển

 PHP (1994): được phát triển để phát sinh các form đăng nhập sử dụng giao thức HTTP của Unix

 PHP 2 (1995): script server, h ỗ trợ CSDL, upload file,

khai báo biến, mảng, hàm đệ quy, câu điều kiện, biểu

thức, …

 PHP 3 (1998): h ỗ trợ ODBC, đa hệ điều hành, giao thức email (SNMP, IMAP)

 PHP 4 (2000): tr ở thành một thành phần độc lập cho các webserver

 PHP 5 (2005): bổ sung Zend Engine II hỗ trợ lập trình HĐT, XML, SOAPcho Web Services, SQLite

 PHP 7.1.0: Phiên bản mới nhất 8/2016

3

Trang 72

Generic ODBC, etc

 Dễ học và phát triển nhanh các ứng dụng trên Web

 Được sử dụng rộng rãi trong môi trường phát triển ứng dụng Web 4

Trang 73

5

Trang 75

7

Trang 76

PHP nâng cao

Trang 77

HTTP header

Trang 78

HTTP header

 Http header là các thông tin điều khiển

nằm trong các http request, http response

 Chứa các chỉ thị báo cho trình

duyệt/server

 Chuyển qua trang khác

 Không hiển thị file php

 Không lưu vào cache

10

Trang 79

HTTP header

 Mở firefox, nhấn F12 để bật FireBug

 Gõ địa chỉ 1 trang web

 Xem header trong cửa sổ FireBug

11

Trang 80

HTTP header

(tiện ích mở rộng của Firefox)

http://livehttpheaders.mozdev.org

Trang 81

Request header

liệu

Trang 82

Reponse header

không

14

Trang 83

HTTP status code

 2xx : request thành công

 3xx : chuyển hướng đến trang khác

 4xx : có lỗi xảy ra trong request

 5xx : server bị lỗi

 Một số status code thường gặp

 200 : OK, được gửi trong response thì request

thành công

 302 : tạm chuyển đến trang khác

 400: bab request; 401: unauthorized;

403: forbidden; 404 : trang không tìm thấy

 500 : internal server error

15

Trang 85

Ứng dụng của HTTP Header

 Chuyển hướng (redirection):

 VD:

Nếu browser là IE thì chuyển đến trang welcome.html,

ngược lại chuyển đến welcome1.html

Trang 86

Ứng dụng của HTTP Header

 Content-type: dùng để báo cho browser kiểu

dữ liệu mà webserver đang trả về cho

browser

 Cú pháp:

18

Trang 87

// Chuẩn bị xuất 1 file pdf

header( 'Content-type: application/pdf' );

Trang 88

application/vnd.ms-excel File excel

Application/zip File zip

Trang 89

Cookie

Trang 90

COOKIE

 Dùng để lưu thông tin của người dùng

Cookie được lưu ở máy client, browser

quản lý

 Mỗi biến cookie có 1 thời gian quá hạn

Vượt qua thời điểm đó, browser sẽ xóa

biến cookie

 Mỗi lần thực hiện request 1 trang, browser

sẽ gửi lại các biến cookie chưa hết hạn

 Được đặt trước thẻ <html>

2

Trang 92

COOKIE

 setcookie.php

<?php

$value = "something from somewhere" ;

setcookie( "TestCookie" , $value , time() +

3600 ); /* hết hạn trong 1 giờ */

?>

 viewcookie.php

<?php

if(isset( $_COOKIE [ "TestCookie" ]==true))

echo $_COOKIE [ "TestCookie" ];

?>

4

Trang 93

COOKIE

<?php

setcookie( "cookie[three]" , "cookiethree" );

setcookie( "cookie[two]" , "cookietwo" );

setcookie( "cookie[one]" , "cookieone" );

if (isset( $_COOKIE [ 'cookie' ])){

foreach ( $_COOKIE [ 'cookie' ] as $name => $value ){

$name = htmlspecialchars( $name );

$value = htmlspecialchars( $value );

echo "$name : $value <br />\n";

}

?>

5

Trang 94

Nhớ thông tin này <br/>

</form>

6

Trang 95

COOKIE – ví dụ

 xuly.php

<?php

if(isset( $_POST [ "chknho" ]) == true){

setcookie ( "ten" , $_POST [ "txtten" ],time()+ 3600 )

setcookie ( "ten" , $_POST [ "txtten" ],- 1 );

setcookie ( "matkhau" , $_POST [ "txtmatkhau" ],- 1 ); }

?>

7

Trang 96

Session

Trang 97

SESSION

 Session là đối tượng trên server, chứa

thông tin của từng user

 Mỗi user có vùng session riêng biệt

trong php

9

Trang 99

$_SESSION[ "name" ]= "abc" ;

header( "Location: index.php" );

?>

11

Trang 100

Ứng dụng Session

dùng truy cập vào các trang web nếu chưa đăng nhập?

 Ý tưởng: dùng các biến Session để lưu

trạng thái đăng nhập của người dùng

 $_SESSION[“Login”] = 0/1: lưu trạng thái

đăng nhập

 $_SESSION[ “Username”]: lưu tên đăng nhập

 $_SESSION[ “Authentication”]: lưu loại quyền đăng nhập

 …

12

Trang 101

Ứng dụng Session

 Tạo trang login.htm yêu cầu người dùng đăng nhập

 Tạo trang validateuser.php xử lí thông tin đăng nhập từ

 N ếu đúng thì dùng một biến Session để lưu trạng thái

login thành công lại

• Ví dụ $_SESSION["IsLogin“] = 1;

 Tạo trang logout.php là trang xử lý khi người dùng logout

 Reset trạng thái login là chưa đăng nhập

• Ví dụ unset($_SESSION[“IsLogin”]);

13

Trang 102

Tập tin, thư mục

Trang 103

Quản lý file & thư mục

 Hàm thao tác trên file

 res fopen(string $filename, string

$mode)

 bool fclose(res $handle)

 int fpassthru (res $handle)

gửi toàn bộ nội dung file đang mở cho browser

(binary)

 int readfile (string $filename)

gửi toàn bộ nội dung file đang mở cho browser (text)

 string fread(res $handle, int $length)

đọc một khối dữ liệu dài tối đa length (binary)

 int fwrite(res $handle, string $str [,

int $length])

ghi nội dung của chuỗi ra file

15

Trang 104

Quản lý file & thư mục

 Hàm thao tác trên thư mục

Chuyển thư mục hiện hành

một thư mục trước khi đọc nội dung

Trang 105

closedir($dir); rmdir($dir);

printf("Directory %s removed", $dir);

}

Trang 106

<h2> A simple form for uploading a file </h2>

<form action =" upload.php " method =" post

Định dạng
Số trang	112
Dung lượng	5,15 MB