Tương tác với server bằng form
Việc tương tác với server bằng form có lẽ là một trong những công việc mà các bạn rất hay gặp khi lập trình web. Hãy nghĩ đơn giản, dưới góc độ một user trong UDS, bạn đã phải tương tác với bao nhiêu là form: form register, form login, form post bài nhanh - post bài advance, form để report cho mod... Nhiều quá hóa... chóng mặt
Các form đó đều có điểm chung: Đều được viết bằng HTML. Hãy cùng nhắc lại đôi chút về cách tạo form với HTML:
Trước hết, bạn hãy dành 30 giây trong quỹ thời gian "ít ỏi" của mình để ngẫm lại: HTML có cấu trúc như thế nào?
Nói một cách ngắn gọn, một file HTML có cấu tạo như sau:
HTML Code:
- Code:
[code]<html>
<head>
<title><!-- Tiêu đề --></title>
</head>
<body>
<!-- Nội dung -->
</body>
</html>
Form trong HTML được đặt trong phần <body></body>. Ví dụ như sau:
HTML Code:
<form action="process.php" method="GET">
Tên: <input type="text" name="name" /><br />
Tuổi: <input type="text" name="age" /><br />
<input type="submit" value="Submit!" />
<[/code]/form>
Đoạn code HTML trên có tác dụng gì? Rất đơn giản, nó giúp tạo ra 1 form với 2 ô để nhập dữ liệu: Tên và tuổi. Kèm theo đó là 1 nút lệnh mang chữ Submit. Rất giản dị và ko có gì khó hiểu ở đây cả.
À, có 1 điều này cần giải thích: Ở dòng đầu tiên của đoạn code, thẻ form có 2 thuộc tính: action và method. Hai thuộc tính này có mục đích gì?
1. action="process.php" nghĩa là sau khi bấm submit, dữ liệu sẽ được chuyển qua file process.php nằm cùng thư mục với file HTML này
2. method="GET" nghĩa là phương thức truyền dữ liệu sẽ là GET.
Vậy, bạn đã biết dữ liệu sẽ được chuyển qua file process.php, mà hiển nhiên file process.php này chưa tồn tại, nên một điều rất tự nhiên là ta sẽ tạo file process.php với nội dung sau:
PHP Code:
$name = $_GET["name"];
$age = $_GET["age"];
echo "Tên bạn: $name";
echo "Tuổi của bạn: $age";
?>
Hai dòng cuối của ví dụ trên có lẽ chẳng có j` để bàn. Chỉ đơn giản là echo 2 biến $name và $age ra màn hình. Vấn đề nằm trong 2 dòng đầu.
Ta lấy dòng thứ 1 để mổ xẻ: $name = $_GET["name"]; Ở đây ai cũng biết giá trị của $name được gán từ $_GET["name"]. Vậy là chỉ còn duy nhất 1 điều cần thắc mắc: $_GET là gì?
$_GET là mảng để chứa các giá trị được chuyển từ form sang. Ở đây $_GET gồm 2 phần tử: $_GET["name"] và $_GET["age"].
Mọi vấn đề đến đây được giải quyết.
Giờ ta thử xét form ở Ví dụ ban đầu. Bạn hãy làm một phép thay đổi nhỏ: Đổi method="GET" bằng method="POST".
Khi đó hiển nhiên process.php sẽ ko hoạt động
Nếu suy diễn một cách educated, bạn sẽ ngay lập tức sửa sai bằng cách thay đổi $_GET bằng $_POST. Kết quả? Đúng goài
Đến đây ta có thể sung sướng rút ra kết luận: Để nhận biến từ form chuyển sang, có thể sử dụng mảng $_GET hoặc $_POST, tùy vào phương thức truyền dữ liệu của form.
Bài học kết thúc ở đây được rồi nhỉ?
Chưa đâu bạn ạ. Còn một điều chưa nói đến: Sự khác nhau giữa $_GET và $_POST là j`? Hay đúng hơn, sự khác nhau giữ method GET và POST là gì?
Nói đến GET và POST, trước hết ta sẽ nói đến HTTP Request.
Một HTTP Request được gửi tới server có định dạng như sau:
Code:
[]
Một HTTP Request được gửi tới trang web [You must be registered and logged in to see this link.] từ trình duyệt Firefox sẽ tương tự như ví dụ sau:
Code:
GET / HTTP/1.1
Host: [You must be registered and logged in to see this link.]
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.6)
Gecko/20050225 Firefox/1.0.1
Connection: Keep-Alive
Tương tự, một Request gửi đến trang [You must be registered and logged in to see this link.] sẽ có dạng như sau:
Code:
GET /def/ HTTP/1.1
Host: [You must be registered and logged in to see this link.]
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.6)
Gecko/20050225 Firefox/1.0.1
Connection: Keep-Alive
Như các bạn có thể thấy, 2 ví dụ trên đều dùng phương thức GET để request dữ liệu.
Giờ hãy tưởng tượng, sau khi điền vào form 1 giá trị name là admin, age là 20, bạn bấm nút submit để gửi dữ liệu đến file process.php.
Trên thanh address sẽ hiện ra url: process.php?name=admin&age=20
Nếu xem xét một cách kỹ lưỡng HTTP Request, ta sẽ thấy nó như sau:
Code:
GET /process.php?name=admin&age=20 HTTP/1.1
Host: [You must be registered and logged in to see this link.]
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.6)
Gecko/20050225 Firefox/1.0.1
Connection: Keep-Alive
Tóm lại, khi dùng phương thức GET, trình duyệt sẽ gửi Request tới server với các tham số đặt trong dòng đầu tiên (request-line).
Còn với phương thức POST thì sao? Thay nằm trong request-line, những tham số này được đặt trong phần request-body.
Ví dụ ta giữ nguyên form trên, chỉ thay method="GET" bằng method="POST" và bấm Submit. Khi đó đây sẽ là HTTP Request "behind the scene":
Code:
POST / HTTP/1.1
Host: [You must be registered and logged in to see this link.]
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.6)
Gecko/20050225 Firefox/1.0.1
Content-Type: application/x-www-form-urlencoded
Content-Length: 40
Connection: Keep-Alive
name=admin&age=20
Có thể dễ dàng thấy rằng, ngoài việc thêm một số dòng vào phần header:
Code:
Content-Type: application/x-www-form-urlencoded
Content-Length: 40
Connection: Keep-Alive
thì phương thức POST đã "cất" các tham số của mình trong phần request-body. Điều này hiển nhiên khác hẳn phương thức GET.
Bài học hôm nay chính thức được kết thúc ở đây <:-P
(và tớ cũng đi xem phim smallville tiếp đây )
identical(UDS)