Web services (2) - Hoạt động của web services

-----

2         Hoạt động của web services

Web services hoạt động dựa trên mô hình client-server. Vì vậy, chúng ta cùng tìm hiểu một chút về mô hình này.

2.1       Mô hình client-server

Ý tưởng của mô hình này, đơn giản chỉ là: máy khách (client) gửi một yêu cầu (request) đến máy chủ (server), máy chủ sẽ xử lý và trả kết quả về cho máy khách.

Xem hình minh họa về mô hình client-server:


Mô hình client-server gồm một số thành phần:

– Client: khởi phát yêu cầu, gửi yêu cầu tới server, nhận kết quả từ server trả về. Client có thể là trình duyệt, ứng dụng viết bằng python/javascript hoặc bất kỳ ứng dụng nào mà có phát sinh ra HTTP request.

– Server: có vai trò cung cấp dịch vụ, xử lý và trả về kết quả cho máy client.

– Môi trường truyền thông tin: hạ tầng mạng (LAN, Internet), bao gồm cả phần cứng và phần mềm

– Giao thức truyền thông tin: các chuẩn công nghệ giúp giao tiếp và truyền thông tin giữa server-client. Ví dụ HTTP, HTTPS

Trong mô hình client-server, khi môi trường truyền đã được kết nối và sẵn sàng, thì client luôn là nơi khởi phát của ứng dụng. Client sẽ gửi một HTTP request tới server. Khi server nhận được request, nó sẽ xử lý và trả kết quả về cho client bằng một HTTP response.

Client là thành phần chủ động. Server là thành phần bị động.

Chúng ta sẽ thấy cách hoạt động của một ứng dụng web rất khác so với cách hoạt động của chương trình trên máy cục bộ (ví dụ Microsoft Word). Trong Microsoft Word, mọi thao tác đều được thực hiện ngay trên máy người dùng, từ việc ra lệnh, xử lý và trả về kết quả. Cũng là chương trình xử lý văn bản, nhưng Google Docs là một ứng dụng hoạt động theo mô hình client-server. Nếu không có kết nối mạng thì Google Docs sẽ không hoạt động được.

Để hiểu rõ hơn về mô hình client-server, chúng ta sẽ cùng quan sát các bước của quá trình mở một ứng dụng web:

Do ứng dụng web hoạt động theo mô hình client-server, nên để có trang web trên trình duyệt, cần trải qua các bước sau:

Bước 1: Người dùng nhập địa chỉ trang web (URL) vào thanh địa chỉ. Ví dụ: http://example.com/hello.php

Bước 2: Trình duyệt dựa vào URL trong thanh địa chỉ, kết nối tới máy web server, gửi yêu cầu tới web server (ví dụ yêu cầu: gửi cho nội dung trang web hello.php)

Bước 3: Web server xử lý yêu cầu, gửi trả kết quả về cho trình duyệt (ví dụ nội dung trang web dưới dạng mã nguồn HTML, CSS và JavaScript)

Bước 4: Trình duyệt thực thi mã HTML, CSS, JavaScript và hiển thị trang web ra màn hình.

Xem hình minh họa:


Chúng ta cùng thực hành, quan sát trình duyệt mở một ứng dụng web trên máy tính:

Bước 1. Mở trình duyệt web. Ví dụ Chrome

Bước 2. Nhập vào đường dẫn của trình duyệt địa chỉ một trang web, bấm Enter để trình duyệt lấy trang web từ máy server, và hiển thị nội dung ra màn hình. Ví dụ thanhnien.vn

Bước 3. Mở Developer tools của trình duyệt bằng một số cách sau:

– Bấm tổ hợp ba phím Ctrl+Shift+I,

– hoặc bấm phím F12,

– hoặc vào menu của trình duyệt tìm tới mục Developer tools,

– hoặc bấm chuột phải vào trang web, chọn Inspect.

Bước 4. Trong cửa sổ của Developer tools, bấm chuột vào mục Network.

Bước 5. Quan sát sẽ thấy các tập tin HTML (thanhnien.vn), CSS (các tập tin có phần mở rộng là css), JavaScript (các tập tin có phần mở rộng là js) được server gửi về cho client.

Bước 6. Bấm chuột vào các tập tin do server gửi về và quan sát nội dung của nó ở cửa sổ bên phải. Nhớ chọn mục Response.

Hình minh họa:


2.2       Cơ chế hoạt động của web services

Hệ thống web services cũng hoạt động dựa trên mô hình client-server. Hoạt động của web services được thể hiện ở hình sau:



Trong đó,

– Một hệ thống web services gồm hai thành phần chính là client (service consumer) và server (service provider). Chúng giao tiếp với nhau bằng giao thức HTTP, lấy hạ tầng Internet làm môi trường truyền. Lưu ý, client trong web services không phải là trình duyệt mà là ứng dụng web do lập trình viên đang xây dựng. Ví dụ, ứng dụng đọc RSS ở phần trước chính là client.

– Server luôn ở trạng thái sẵn sàng đáp ứng các yêu cầu từ phía client

– Client gửi yêu cầu thông qua HTTP request tới server

– Server xử lý và gửi kết quả về client, thông qua HTTP response

– Có hai loại công nghệ web services được sử dụng là SOAP và REST. Hiện nay, REST được sử dụng phổ biến hơn.

– Định dạng dữ liệu dùng để giao tiếp giữa client và server có thể ở dạng XML, JSON, text…v.v

Phần tiếp theo chúng ta sẽ tìm hiểu về giao thức HTTP.

2.3       Giao thức HTTP

Giao thức (protocol) là cách thức dùng để giao tiếp. Như một pha giao tiếp thông thường, để giao tiếp, chúng ta cần có: quy tắc, văn hóa, địa điểm, thời gian, phương tiện, ngôn ngữ, tính riêng tư (bảo mật).

Trong giao tiếp của mạng máy tính cũng vậy, 2 máy tính muốn giao tiếp với nhau, chúng cũng cần có quy tắc, phương tiện, ngôn ngữ, bảo mật, thời gian.

Dịch vụ web sử dụng giao thức HTTP làm phương tiện giao tiếp giữa client và server.

Giao thức HTTP nằm ở tầng Application của mô hình OSI, và TCP/IP. Các bạn nên quan tâm nhiều hơn đến mô hình TCP/IP vì nó là mô hình của hệ thống mạng đang vận hành. Trong khi mô hình OSI là mô hình tham chiếu (mô hình lý thuyết).

HTTP viết tắt của HyperText Transfer Protocol – giao thức truyền tải siêu văn bản. HTTP là nền tảng của truyền thông dữ liệu cho WWW. HTTP đang có ba phiên bản là HTTP/1.1 (ra đời 1999), HTTP/2 (chính thức 2015), và HTTP/3 (đang phát triển). Xem hình minh họa.

Khi client và server sử dụng giao thức HTTP để giao tiếp, chúng gửi qua lại cho nhau các gói tin, gọi là gói HTTP. Gói HTTP gồm 3 phần: Header, Body và Trailer. Xem hình minh họa.

Gói HTTP gồm 2 loại là: HTTP Request và HTTP Response. Chúng ta sẽ tìm hiểu kĩ hơn các thành phần của mỗi loại gói tin này.

Như đã biết, trong mô hình client-server, client và server giao tiếp với nhau bằng cách gửi thông điệp (gọi là HTTP message). HTTP message gồm hai loại là HTTP request message (thường được gọi tắt là HTTP request) và HTTP response message (thường được gọi tắt là HTTP response).

HTTP request được client tạo ra, ví dụ khi người dùng nhập một URL vào thanh địa chỉ của trình duyệt và bấm phím Enter.

Hình sau là cấu trúc của một HTTP request,

Cụ thể hơn,



Cấu trúc một HTTP request gồm bốn phần:

– Request line

– Request headers

– Blank line

– Request body

Request line

Request line là hàng đầu tiên trong HTTP request, có cú pháp [request-method-name request-URI HTTP-version], tạm dịch là [loại-request đường-dẫn-của-tài-nguyên phiên-bản-của-HTTP]

Ví dụ:

GET /rssreader/index.php HTTP/1.1

Các loại request (request-method-name): GET, HEAD, POST, PUT, DELETE, CONNECT, OPTIONS, TRACE

Request headers

Gồm các hàng từ thứ hai đến dòng trắng (dòng dùng để ngăn cách phần request header và phần request body).

Request headers là các thông tin bổ sung thêm cho thông điệp gửi tới server, ví dụ: host, accept, accept-language, user-agent, cookies.

Cú pháp của request headers:

[request-header-name1: value1, value2,…

request-header-name2: value1, value2,…

…]

Ví dụ:

Host: localhost

Accept: text/html, image/avif

Accept-Language: en-US

Contem-Lenght: 79

Blank line

Đây là một hàng trắng, dùng để ngăn cách giữa phần header và phần body trong một HTTP request.

Request body

Chứa dữ liệu được client gửi về server để xử lý.

Ví dụ:

feedurl=https%3A%2F%2Fvnexpress.net%2Frss%2Fthe-gioi.rss&submit=L%E1%BA%A5y+tin

Lab 3. Sử dụng tab Network trong Developer tools của trình duyệt để phân tích chi tiết các thành phần (request line, request headers, request message body (nếu có)) của một HTTP request khi truy cập vào trang https://www.thegioididong.com/ và tuoitre.vn.

Lab 4. Viết một ứng dụng web cho người dùng đăng nhập bằng email và mật khẩu, server sẽ kiểm tra:

­– nếu có sinh viên đó có tồn tại trên server thì trả về họ tên, điểm môn học;

– ngược lại báo là không tồn tại sinh viên đó.

Dữ liệu của sinh viên được lưu trong một mảng. Sử dụng tab Network để quan sát kết quả do client gửi lên server.

HTTP response

HTTP response là thông điệp do server gửi về cho client.

HTTP response có cú pháp như sau:


Cụ thể hơn,




Cấu trúc một HTTP response gồm bốn phần:

– Status line

– Response headers

– Blank line

– Response body

Status line

Dòng đầu tiên của HTTP response, gọi là dòng trạng thái, có cấu trúc như sau:

[HTTP-version status-code reason-phrase]

­– HTTP-version: phiên bản của giao thức HTTP

– status-code: mã trả về của server

– reason-phrase: giải thích ngắn gọn mã trả về của server

Mã trả về của server gồm một bộ-ba-số, trong đó số đầu tiên cho biết kết quả xử lý của server, hai số kế tiếp là thông tin bổ sung cho kết quả xử lý.

Ví dụ:

– 1xx: thông tin, có nghĩa là server đã nhận được yêu cầu, và tiến trình đang tiếp tục

+ 100: cho biết máy chủ đã nhận được phần đầu tiên của yêu cầu và đang chờ đợi cho các phần còn lại

– 2xx: thành công, server đã nhận được yêu cầu, hiểu và xử lý thành công

+ 200 OK: request đã được xử lý thành công

+ 202 Accepted: request đã được nhận, nhưng không có kết quả nào trả về, thông báo cho client tiếp tục chờ đợi

+ 204 No Content: request đã được xử lý nhưng không có thành phần nào được trả về

+ 205 Reset: giống như 204 nhưng mã này còn yêu cầu client reset lại document view

+ 206 Partial Content: server chỉ gửi về một phần dữ liệu, phụ thuộc vào giá trị range header của client đã gửi

– 3xx: cần chuyển hướng, client phải thực hiện thêm thao tác để hoàn tất request

            + 301 Moved Permanently: tài nguyên đã được chuyển hoàn toàn tới địa chỉ Location trong HTTP response

+ 303 See other: tài nguyên đã được chuyển tạm thời tới địa chỉ Location trong HTTP response

+ 304 Not Modified: tài nguyên không thay đổi từ lần cuối client request, nên client có thể sử dụng nội dung đã lưu trong cache

– 4xx: lỗi bên client, cho biết HTTP request bị lỗi cú pháp hoặc không thực hiện được

            + 400 Bad Request: request không đúng dạng, không đúng cú pháp

+ 401 Unauthorized: client chưa xác thực

+ 403 Forbidden: client không có quyền truy cập

+ 404 Not Found: không tìm thấy tài nguyên

+ 405 Method Not Allowed: phương thức không được server hỗ trợ

– 5xx: lỗi bên server, cho biết server không thể xử lý được yêu cầu

            + 500 Internal Server Error: có lỗi trong quá trình xử lý của server

+ 501 Not Implemented: server không hỗ trợ chức năng client yêu cầu

+ 503 Service Unavailable: server bị quá tải, hoặc bị lỗi xử lý

Đọc thêm: https://www.stdio.vn/cyber-security/http-request-va-http-response-uve8H

https://vi.wikipedia.org/wiki/Hypertext_Transfer_Protocol

Response headers

Gồm các hàng từ thứ hai đến dòng trắng (dòng dùng để ngăn cách phần response headers và phần response body).

Response headers là các thông tin bổ sung thêm cho thông điệp (mà không thể để trong status line) do server gửi tới client,

Cú pháp của response headers:

[response-header-name1: value1, value2,…

response-header-name2: value1, value2,…

…]

Ví dụ:

Date: Sat, 13 Mar 2021 01:12:18 GMT

Server: Apache/2.4.46 (Win64) OpenSSL/1.1.1g PHP/7.4.11

X-Powered-By: PHP/7.4.11

Content-Length: 5443

Keep-Alive: timeout=5, max=100

Connection: Keep-Alive

Content-Type: text/html; charset=UTF-8

Blank line

Đây là một hàng trắng, dùng để ngăn cách giữa phần header và phần body trong một HTTP response.

Response body

Các byte dữ liệu nằm ngay sau phần header của thông điệp (nếu có) được server gửi về client.

Ví dụ (một phần của response body, trong Developer tools\tab Network\ tab Response):

!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

</head>

<body>

    <form method='post' action="">

        <input type="text" name="feedurl" placeholder="Nhap feed url cua website">

        <input type="submit" name="submit" value="Lấy tin">

    </form>

<h1>Thế giới - VnExpress RSS</h1>            <div class="post">

...

2.4       Xem và đọc thêm

[1] How Web Services Work:

https://www.youtube.com/watch?v=ktl57lfw-68&list=PLhW3qG5bs-L9E2KV6vVdB-YTk-sRxmRAB&index=3

[2] Tìm hiểu về web services: https://gpcoder.com/5572-tim-hieu-ve-web-service/

[3] Giao thức HTTP: https://www.youtube.com/watch?v=SdcdneSdoV4

[4] HTTP protocol: https://www.youtube.com/watch?v=0OrmKCB0UrQ

[5] Giao thức HTTP:  https://vi.wikipedia.org/wiki/Hypertext_Transfer_Protocol

[6] RFC7231:  https://tools.ietf.org/html/rfc7231

[7] HTTP request: https://documentation.help/DogeTool-HTTP-Requests-vt/http_request.htm

[8] HTTP request và HTTP response: https://www.stdio.vn/cyber-security/http-request-va-http-response-uve8H

[9] Status line: https://www.w3.org/Protocols/rfc2616/rfc2616-sec6.html

[10] HTTP message: https://developer.mozilla.org/en-US/docs/Web/HTTP/Messages

2.5       Bài tập và thực hành

Bài tập 1. Sử dụng tab Network trong Developer tools của trình duyệt để phân tích chi tiết các thành phần của HTTP request (request line, request headers, request body) và HTTP response (status line, response headers, response body) khi truy cập vào trang https://www.thegioididong.com/ và tuoitre.vn. Chụp hình kết quả của quá trình phân tích.

Bài tập 2. Sử dụng chương trình Wireshark, bắt các gói tin trao đổi khi bạn sử dụng trình duyệt để mở trang web tuoitre.vn. Ghi chép và chụp hình lại quá trình thực hiện.

Bài tập 3. Viết một ứng dụng web cho người dùng đăng nhập bằng email và mật khẩu, server sẽ kiểm tra nếu có sinh viên đó trên server thì trả về họ tên, điểm môn học; ngược lại báo là sinh viên không có trong hệ thống. Dữ liệu của sinh viên được lưu trong một mảng. Sử dụng tab Network để quan sát kết quả do server gửi về cho client.

Bài tập 4. Sử dụng ứng dụng trong Bài tập 3, sửa lại mã nguồn hoặc thực hiện các điều chỉnh cần thiết để client nhận được năm loại mã (1xx, 2xx, 3xx, 4xx, 5xx) trả về từ server. Ghi lại quá trình làm, kết quả thực hiện của từng trường hợp.

[Gợi ý làm bài tập:]

Bài tập 1.

Bài tập 2.

Bài tập 3.

Bài tập 4.

2.6       Câu hỏi ôn tập

Câu 1. The Hypertext Transfer Protocol (HTTP) is an application _____  protocol in the Internet protocol suite model for distributed, collaborative, hypermedia information systems.

A. of

B. programming

C. interface

D. layer

Câu 2. What does RFC stand for in tech?

A. Radio frequency channel

B. Request for comments

C. Read frequently content

D. Require for command

Câu 3. The format of a request HTTP includes?

A. Request line, Request message, Blank line, Request body

B. Request line, Request headers, Blank line, Request body

C. Request input, Request headers, Blank line, Request body

D. Request line, Request headers, Blank line, Request data

Câu 4. The format of a response HTTP includes?

A. Status line, Response headers, Blank line, Response body

B. Response error, Response headers, Blank line, Response body

C. Status line, Response headers, Blank space, Response body

D. Status line, Response headers, Blank line, Response code 

-----

Cập nhật: 9/11/2023

Đọc thêm: Web services (3) - Trải nghiệm làm một web services