Bài giảng Công nghệ Web và ứng dụng: Chương 2 - Nguyễn Minh Vi

Bài giảng Công nghệ Web và ứng dụng - Chương 2: Kiến trúc web cung cấp cho người học các kiến thức: Kiến trúc web, giao thức HTTP, mô hình MVC. Đây là một tài liệu hữu ích dành cho các bạn sinh viên ngành Công nghệ thông tin và những ai quan tâm dùng làm tài liệu học tập và nghiên cứu.

Kiến trúc Web Nội dung  Kiến trúc web  Giao thức HTTP  Mơ hình MVC 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 tiến trình xử lý  Trong lĩnh vực cụ thể  Module hóa phức tạp Kiến trúc Web Platform  Web platform dựa thành phần sau  TCP/IP  HTTP  HTML Mơ hình kiến trúc Client/Server  Là mơ hình phức tạp…   Các thành network (firewall, proxy, load balancer)  Các thành phần intranet (web server, application server, database, web services) Mơ hình Web (tầng ứng dụng)  Các thành phần ngữ nghĩa Web  Dịch vụ Web: Nội dung động có tính tương tác  URLs/URIs  HTTP  HTML HTML/XHTML for display  PHP, Python, Java HTTP for transport HTTP Server Clients (browsers) URL/URI for addressing PHP, python etc for interaction Mơ hình Web (các tầng giao thức) Client Web server HTTP message HTTP HTTP TCP segment TCP TCP Router Router IP packet IP Ethernet interface IP packet IP Ethernet interface Ethernet IP packet IP SONET interface SONET link SONET interface IP Ethernet interface Ethernet Ethernet interface Giao thức HTTP  Những bước xử lý browser DNS query http://origin/ DNS server Client Establish TCP connection HTTP request HTTP response Optional parallel connections HTML Origin server HTTP transaction Giao dịch HTTP  Một giao dịch giao thức HTTP request response (một phản hồi request đó) web client web server Client 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 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 Origin server HTTP Message  HTTP message dạng ASCII text, gồm:  Một dòng yêu cầu Method Request-URI HTTP-Version (Request-Line) HTTP-Version Status-Code Reason-Phrase (Status-Line)  Các trường Header field-name ":" [ field-value ]  Một dòng trống  Phần thân thơng báo (tùy chọn) HTTP Request  Ví dụ GET /foo.html 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 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 Client Methods  GET Retrieve a resource from the server (static file, or dynamically-generated data)   Remove a resource from the server  HEAD POST 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 OPTIONS (HTTP 1.1) Request other options for an URI (methods understood by a server or allowed for a given URI) Get information about a resource (but not the actual resource)  DELETE  TRACE (HTTP 1.1) Ask proxies to declare themselves in the headers (used for debugging)  CONNECT (HTTP 1.1) Used for HTTPS (secure HTTP) through a proxy HTTP Caching  Dữ liệu Cache gần người dùng  Improves Web performance, reduces load on server  Cache control directives in HTTP header (no cache, age, etc.) GET http://origin/ Client Cache server GET http://origin/ 200 OK 200 OK Client GET http://origin/ 200 OK Origin server HTTP Client Authentication  Cơ chế bảo mật đơn giản thông qua username/password  Basic scheme: username:password base-64 encoded echo -n “user:password" | openssl base64 echo "c2NvdHQ6dGlnZXI=" | openssl base64 -d GET /private/ HTTP/1.1 Client HTTP/1.1 401 Unauthorized WWW-Authenticate: Basic realm="secret" Username: joe Password: ******** GET /private/ HTTP/1.1 Authorized: Basic SHY3GH7D3SH== HTTP/1.1 200 OK HTML Origin server Cookies  Cho phép Web servers lưu trạng thái Client  Dùng cặp khóa – giá trị  Thường dùng quản lý phiên giao dịch session  Cookie truy xuất site/domain  Server định thời gian hết hạn  Client 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 Mơ hình: Model View Controller Mơ hình sử dụng Smalltalk (1979)  Tách riêng tầng liệu hiển thị  Dễ dàng phát triển  Mơ hình: Model View Controller  Model  Tượng trưng cho liệu phần mềm ứng dụng  View  Tầm nhìn hay khung nhìn (view) bao gồm thành phần giao diện người dùng  Controller  Quản lý trao đổi liệu  Các nguyên tắc nghề nghiệp thao tác liên quan đến mơ hình Model-View-Controller cho Web  Sự thích ứng MVC Web  Kết nối không bền vững client server  Thông báo thay đổi  Truy vấn lại server để phát thay đổi Client/Server (2-Layer) Client Client Server Static HTML Web/App Server Services Database Dynamic HTML Client/Server (2-Layer) N-Layer Architectures Client Firewall Proxy Web Server Presentation Layer Business Layer Application Server (Business Logic, Connectors, Personalization, Data Access) Backend (Legacy Application, Enterprise Info System) Data Layer DBMS B2B N-Layer Architectures Vì dùng N-Layer Architecture?  Tách dịch vụ trình xử lý nhằm tái sử dụng chúng  Kết nối lỏng lẻo nhằm giảm ảnh hưởng lên hệ thống  Dễ bảo trì (in terms of code)  Có thể mở rộng (modular)  Trade-offs  Giảm phức tạp  Tăng khả chịu lỗi JSP-Model-1 Architecture JSP-Model-2 Architecture user request create/change model create/change view generate output server response Struts Architecture user request forwarding to controller create/change model create/change view generate output server response ... HTTP/1.1 20 0 OK Date: Mon, 15 Jul 20 02 08:49:00 GMT Server: Apache/1.3 .26 (Unix) PHP/4 .2. 1 Last-Modified: Wed, 12 Jun 20 02 08:49:49 GMT ETag: "2a-50ea-3d070b2d" Accept-Ranges: bytes Content-Length: 20 714... Connection: Keep-Alive HTTP/1.1 20 0 OK Date: Mon, 15 Jul 20 02 08:49:00 GMT Server: Apache/1.3 .26 (Unix) PHP/4 .2. 1 Last-Modified: Wed, 12 Jun 20 02 08:49:49 GMT ETag: "2a-50ea-3d070b2d" Accept-Ranges:... Một dòng yêu cầu Method Request-URI HTTP-Version (Request-Line) HTTP-Version Status-Code Reason-Phrase (Status-Line)  Các trường Header field-name ":" [ field-value ]  Một dịng trống 