Mô hình hoạt động của ứng dụng web

Một hệ thống web hoạt động tương đối phức tạp và khác biệt rất nhiều với các loại ứng dụng desktop quen thuộc. Mặc dù hằng ngày bạn vẫn sử dụng trình duyệt – một bộ phận của hệ thống web – bạn có thể chưa hiểu được cách thức hoạt động của cả hệ thống này.

Nếu muốn phát triển ứng dụng web (và những loại ứng dụng có liên quan), bạn càng cần biết rõ hơn về cách thức hoạt động của hệ thống web nói chung.

Do đó, nếu bạn chưa từng học hoặc xây dựng ứng dụng web, bạn cần hiểu cách thức hoạt động của hệ thống web, trước khi đi sâu vào lập trình ứng dụng web với PHP.

Cách thức hoạt động của hệ thống web

Một hệ thống web thông thường bao gồm hai loại chương trình chạy trên các máy tính khác nhau:

• trình duyệt – loại chương trình chạy trên máy tính của người dùng;
• chương trình máy chủ web (web server) – loại chương trình chạy trên một máy tính riêng rất mạnh.
• trình duyệt và chương trình máy chủ web tương tác với nhau qua một mạng truyền thông (thường là mạng tcp/ip), sử dụng giao thức HTTP (Hypertext Transfer Protocol).

Trình duyệt phổ biến bạn có thể đang sử dụng hàng ngày như Chrome, Firefox, Edge, Opera, Safari. Chương trình máy chủ ít người biết đến hơn. Có thể kể tên những chương trình máy chủ phổ biến như IIS, Apache, NGinx.

Trình duyệt và chương trình máy chủ “nói chuyện” với nhau bằng cách:

1. trình duyệt gửi đi các “lệnh” (gọi là truy vấn – HTTP Request);
2. chương trình máy chủ nhận “lệnh” và sinh ra dữ liệu tương ứng (ở dạng văn bản viết bằng ngôn ngữ HTML), thu thập các file (mã javascript, css, hình ảnh, v.v.);
3. dữ liệu được “đóng gói” (thành các phản hồi – HTTP Response) và trả lại cho trình duyệt.
4. trình duyệt sẽ hiển thị dữ liệu nhận được, cũng như thực thi các lệnh (do các file javascript phát ra).

Để dễ hình dung, dưới đây là sơ đồ minh họa hoạt động của hệ thống web “truyền thống”.

Tất cả quy trình phức tạp trên được thực hiện tự động và bắt đầu khi người dùng nhập một “địa chỉ web” – Unified Resource Locator hay URL – vào thanh địa chỉ của trình duyệt.

Địa chỉ web hay URL bao gồm một hostname độc nhất trên Internet và đường dẫn tới “tài nguyên” tương ứng (ví dụ, một file) trên máy chủ. Hostname, còn gọi là tên miền (Domain Name), được Dịch vụ Tên miền (Domain Name Service hay DNS) ánh xạ với địa chỉ IP của máy chủ, giúp gói tin HTTP Request đi được từ máy người dùng tới máy chủ.

Trong quá trình trên, nếu trong bất kỳ một thành phần nào có “tham chiếu” tới một file khác, một quy trình mới sẽ được tự động bắt đầu để lấy file tương ứng.

Nói cách khác, để “tải” trọn vẹn những gì cần thiết từ máy chủ về trình duyệt, chương trình trình duyệt có thể phải phát phát đi hàng trăm HTTP Request (và nhận về hàng trăm HTTP Response tương ứng).

Ví dụ, để tải trang web bạn đang xem, nếu không thực hiện bất kỳ kỹ thuật ghép file nào, trình duyệt của bạn sẽ phát về server của chúng tôi khoảng 150 HTTP request để lấy chừng ấy file.

Để xem các truy vấn, bạn có thể mở cửa sổ Developer (F12) của trình duyệt, tab Network và ấn F5 để tải lại trang.

Ứng dụng web

Sau khi đọc phần trên bạn hẳn phân vân, vậy “ứng dụng web” mà bạn viết ra bằng PHP, nằm ở đâu?

Ở phần trên bạn có thể để ý chúng ta đang dùng từ “hệ thống web” để chỉ tổ hợp trình duyệt – chương trình máy chủ web. Chúng ta dùng thuật ngữ đó để giúp bạn phân biệt với “ứng dụng web” mà bạn sẽ xem xét trong phần này.

Hãy nhìn vào bước số 3 trong sơ đồ của hệ thống web: Server giải mã truy vấn và sinh ra HTML tương ứng.

Trên thực tế, mọi chuyện khá phức tạp.

Bạn cần biết rằng, các chương trình máy chủ web (Apache, IIS, NGinx) thực ra không hề biết gì về chương trình của bạn! Chúng cũng không thể thực thi được các lệnh do bạn viết ra, dù là bạn dùng ngôn ngữ lập trình nào đi chăng nữa! Các chương trình này chỉ có khả năng đọc các file (văn bản và ảnh) trên ổ đĩa của máy chủ, đóng gói vào HTTP Response và trả lại trình duyệt!

Đây cũng là cách thức hoạt động thuở ban đầu của web: lưu trữ và trả các file HTML cho trình duyệt khi được yêu cầu. Ngày nay, các trang web như vậy thường được gọi là trang web tĩnh (static page), nhằm phân biệt với các trang web được tính ra tự động bởi các script mà chúng ta quen gọi là các ứng dụng web.

Tuy nhiên, các chương trình máy chủ đều hỗ trợ các chương trình mở rộng (extension hoặc plugin). Các cơ chế thực thi lệnh của người dùng được thực hiện bởi các chương trình mở rộng.

Chương trình dịch của PHP là một chương trình mở rộng như vậy. PHP có hai chế độ hoạt động: hoạt động độc lập với php.exe và hoạt động tích hợp với php.dll.

Căn cứ vào yêu cầu của người dùng (thông qua URL), chương trình máy chủ sẽ biết cần kích hoạt chương trình mở rộng nào và chuyển tiếp truy vấn cho nó. Khi này, chương trình mở rộng sẽ thực thi lệnh (thường là các script – file lệnh mã mở, hoặc các file thư viện đã biên dịch) do người lập trình cung cấp để tự động sinh ra dữ liệu (HTML). Các script/thư viện do người dùng viết như thế chính là ứng dụng web.

Với cơ chế như trên, chương trình máy chủ Apache có thể chạy các script viết bằng ngôn ngữ PHP (qua chương trình PHP).

Đa số các ứng dụng web đều cần tương tác với hệ thống file, làm việc với cơ sở dữ liệu, v.v.. Các thao tác này chỉ có thể được thực hiện thông qua script của PHP. Tự bản thân Apache cũng không làm được.

Sơ đồ đơn giản hóa của quá trình này được minh họa trong hình dưới đây:

Các thành phần của một ứng dụng web

Qua hai phần trên bạn đã thấy, ứng dụng web là dạng ứng dụng client/server tương đối phức tạp. Để xây dựng ra một ứng dụng web hoàn chỉnh đòi hỏi sự kết hợp của nhiều ngôn ngữ và công nghệ khác nhau.

Thành phần server được viết bằng một trong số các ngôn ngữ lập trình hỗ trợ web như PHP, C#, Java, Python, JavaScript (Node.js).

Như đã phân tích, thành phần server tự nó cũng không phải là một chương trình độc lập mà là thành phần mở rộng của một trong số các chương trình máy chủ web. Lựa chọn server và ngôn ngữ lập trình thường đi thành combo. Ví dụ, PHP thường dùng với Apache hoặc Nginx, C# thường đi cùng IIS.

Người chuyên phát triển thành phần server được gọi là backend developer.

Thành phần client của ứng dụng web là loại “chương trình” đặc biệt chạy bên trong trình duyệt. Thành phần client được tạo ra từ 3 thành phần riêng biệt: nội dung (HTML), hình thức (CSS), tương tác (JavaScript).

Nội dung của client được tạo ra bởi HTML – loại ngôn ngữ đánh dấu siêu văn bản. HTML không phải là một ngôn ngữ lập trình. Nó là một ngôn ngữ giúp tạo ra nội dung.

Hình thức của client được chỉ định bởi CSS – Cascading Style Sheet. CSS cũng không phải là một ngôn ngữ lập trình. Nó là ngôn ngữ cho phép áp dụng các định dạng khác nhau cho nội dung (HTML).

Nếu chỉ có nội dung và hình thức, một “ứng dụng” web sẽ chỉ là tập hợp của các trang web “tĩnh”. Các tương tác với người dùng và nội dung động được tạo ra bởi JavaScript. JavaScript là một ngôn ngữ lập trình thực sự. Điểm đặc thù của JavaScript là nó được dịch và thực thi bên trong trình duyệt.

Người chuyên phát triển thành phần client được gọi là front-end developer.

Người đảm nhiệm được cả hai thành phần được gọi là fullstack developer.

Một thành phần không thể thiếu của ứng dụng web là cơ sở dữ liệu. Hầu như ứng dụng “đàng hoàng” nào cũng cần đến một cơ sở dữ liệu thực sự như MySQL, Oracle hay SQL Server. Ngôn ngữ sử dụng chính cho cơ sở dữ liệu là (các biến thể) SQL.

Qua đây bạn cần nhớ rằng, để học phát triển ứng dụng web thì mình PHP là không đủ!

Các loại ứng dụng web

Ở những giai đoạn đầu không có khái niệm “ứng dụng web”. Internet khi đó chỉ có các website cung cấp các trang web “tĩnh” – các trang web chỉ có nội dung với rất ít tương tác với người dùng.

Khi các ngôn ngữ lập trình xuất hiện cho cả client và server, các trang web dần trở nên “động” – chúng không chỉ có nội dung mà còn tương tác với người dùng như các ứng dụng desktop thông thường.

Khi các công nghệ mới xuất hiện liên tục, khái niệm “ứng dụng web” trở nên phức tạp hơn.

Thông thường nhất, ứng dụng web được dùng để chỉ loại chương trình mà nội dung được sinh ra qua việc chạy các script trên server. Nội dung chính của loại ứng dụng này là HTML + CSS, còn Javascript đóng vai trò hỗ trợ. Đây là dạng ứng dụng cơ bản chúng ta sẽ học trong lập trình PHP.

Trong hệ thống web, ở vị trí của trình duyệt có thể là một ứng dụng desktop, ứng dụng mobile. Dữ liệu HTML, CSS và Javascript có thể được thay thế bằng chuỗi văn bản theo định dạng JSON/XML. Tuy nhiên, mô hình làm việc Request – Response là không đổi. Mô hình ứng dụng này được gọi là ứng dụng hướng dịch vụ (Service-Oriented Application hay SOA).

Đây là loại ứng dụng web đặc biệt khi chỉ có thành phần server hoạt động như của ứng dụng web bình thường. Ngoài ra, thành phần server cũng không trả về HTML như thường lệ mà trả về JSON hoặc XML. Do vậy thành phần server cũng thường được gọi là Web API.

Ứng dụng web cũng dùng để chỉ một loại “chương trình” viết hoàn toàn bằng Javascript và thực thi trong trình duyệt. Khi này, các chương trình máy chủ web chỉ làm nhiệm vụ cung cấp file javascript cho trình duyệt.

Nếu HTML/CSS/Javascript chỉ được tải một lần duy nhất, và những lần sau server chỉ trả lại dữ liệu ở dạng JSON/XML (tức là trang không cần tải lại trọn vẹn), bạn thu được một loại ứng dụng chạy trên trình duyệt gọi là ứng dụng đơn trang (Single-page application).

Ứng dụng đơn trang cũng thường kết hợp với thành phần server là một Web API.

Kết luận

Trong bài học này chúng ta đã làm quen với cách thức hoạt động của hệ thống ứng dụng web:

• Ứng dụng web là loại ứng dụng client/server phức tạp tạo ra từ nhiều thành phần và nhiều công nghệ khác nhau.
• Ngôn ngữ và chương trình dịch của PHP tích hợp với chương trình web server tạo ra thành phần server của ứng dụng web.
• Thành phần client kết hợp HTML với các file tĩnh (CSS, Javascript, hình ảnh) chạy trên trình duyệt.
• Thành phần server sinh ra HTML và cung cấp các loại file khác cho client qua giao thức HTTP.
• Ứng dụng web hiện nay cũng được phân chia làm nhiều loại khác nhau.

+ Nếu bạn thấy site hữu ích, trước khi rời đi hãy giúp đỡ site bằng một hành động nhỏ để site có thể phát triển và phục vụ bạn tốt hơn.
+ Nếu bạn thấy bài viết hữu ích, hãy giúp chia sẻ tới mọi người.
+ Nếu có thắc mắc hoặc cần trao đổi thêm, mời bạn viết trong phần thảo luận cuối trang.
Cảm ơn bạn!