Chương 5 : Thực hành tạo trang mini chat
-
Trong chương này:
Tạo chương trình mini chat trên web
Tuy không vui bằng Shoutbox mà các trang web "lớn" hay dùng, nhưng dù sao cũng giúp bạn tiêu khiển tí chút với vốn kiến thức PHP mà bạn đã học được !Bước 1 : Kiến thức cần có
- Chuyển biến thông qua một trình đơn (qua một form)
- Đọc dữ liệu trong bảng CSDL
- Ghi dữ liệu vào bảng CSDL
Bước 2: Chuẩn bị viết Script
Nếu bạn không muốn suy nghĩ mà đọc thẳng vào bài giải dưới đây thì … không vui lắm! Hãy suy nghĩ cơ chế hoạt động của nó một tí nhé, mình sẽ mô tả cái trang chat của mình như thế này:
- Một vùng text để nhập nickname
- Một vùng text để gõ vào nội dung chat
- Một nút Send để gửi
- Bên dưới là nội dung chat (mình sẽ cho hiển thị 10 nội dung chat mới nhất, theo thứ tự mới nhất trước, từ từ xuống dưới là nội dung cũ dần, cũ dần …)
Xong, lí thuyết chỉ đơn giản thế thôi, khi bắt tay vào nấu nướng bạn sẽ thấy mùi vị của nó như thế nào mà tùy bạn thêm mắm hay thêm muối!
Bước 3: Hoàn chỉnh code
Dạo này mình hơi lười, nên không thay đổi màu sắc cho nó dễ nhìn, nhưng không sao, chỉ cần bạn copy paste vào notepad++ là nó sẽ tự động đổi màu ý mà!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang ="fr" lang="fr" >
<head>
<title>Mini-chat</title>
<meta http-equiv=" Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<?php
if (isset($_POST['nickname']) AND isset($_POST['message']))
{
if ($_POST['nickname'] != NULL AND $_POST['message'] != NULL)
{
// Trước hết, đăng nhập vào MySQL
mysql_connect("localhost", "root", "");
mysql_select_db("tên_CSDL");
//Dùng lệnh sau đây để đề phòng kẻ gian dùng mã HTML độc hại
$message = mysql_real_escape_string(htmlspecialchars($_POST['message']));
$nickname = mysql_real_escape_string(htmlspecialchars($_POST['nickname']));
// Lưu nội dung vào CSDL (mình đã tạo một table mới tên là minichat)
mysql_query("INSERT INTO minichat VALUES('', '$nickname', '$message')");
// Đóng CSDL lại
mysql_close();
}
}
?>
<form action="minichat.php" method= "post">
<p>
Nickname : <input type="text" name= "nickname" /><br>
Message : <input type="text" name= "message" /><br>
<input type="submit" value="Send">
</p>
</form>
<?php
//Cho hiển thị 10 nội dung mới nhất
mysql_connect("localhost", "root", "");
mysql_select_db("tên_CSDL");
$source = mysql_query("SELECT * FROM minichat ORDER BY ID DESC LIMIT 0,10");
mysql_close();
while ($data = mysql_fetch_array($source) )
{
?>
<p>
<strong><?php echo $data['nickname']; ?> </strong> : <?php echo $data['message']; ?>
</p>
<?php
}
// Xong
?>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang ="fr" lang="fr" >
<head>
<title>Mini-chat</title>
<meta http-equiv=" Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<?php
if (isset($_POST['nickname']) AND isset($_POST['message']))
{
if ($_POST['nickname'] != NULL AND $_POST['message'] != NULL)
{
// Trước hết, đăng nhập vào MySQL
mysql_connect("localhost", "root", "");
mysql_select_db("tên_CSDL");
//Dùng lệnh sau đây để đề phòng kẻ gian dùng mã HTML độc hại
$message = mysql_real_escape_string(htmlspecialchars($_POST['message']));
$nickname = mysql_real_escape_string(htmlspecialchars($_POST['nickname']));
// Lưu nội dung vào CSDL (mình đã tạo một table mới tên là minichat)
mysql_query("INSERT INTO minichat VALUES('', '$nickname', '$message')");
// Đóng CSDL lại
mysql_close();
}
}
?>
<form action="minichat.php" method= "post">
<p>
Nickname : <input type="text" name= "nickname" /><br>
Message : <input type="text" name= "message" /><br>
<input type="submit" value="Send">
</p>
</form>
<?php
//Cho hiển thị 10 nội dung mới nhất
mysql_connect("localhost", "root", "");
mysql_select_db("tên_CSDL");
$source = mysql_query("SELECT * FROM minichat ORDER BY ID DESC LIMIT 0,10");
mysql_close();
while ($data = mysql_fetch_array($source) )
{
?>
<p>
<strong><?php echo $data['nickname']; ?> </strong> : <?php echo $data['message']; ?>
</p>
<?php
}
// Xong
?>
</body>
</html>
Bước 5 : Hoàn thiện code
Nếu dừng tại đây thì trông cái trang chat nó chán chán sao ấy nhỉ, chả màu mè hoa lá cành chi cả ! Bạn thử trang trí thêm cho đẹp đi ! Hay là có lỗi gì đó xuất hiện thì bạn thử sửa nhé ! Nếu không được, hãy post câu hỏi của bạn trong trang lưu bút nhé !
Hết chương 5