Site icon Li-Edward

第4節 PHP 表單處理與資料驗證 – 5個小時學會 PHP

li edward
5個小時學會 PHP

5個小時學會 PHP

學會建立 HTML 表單並用 PHP 處理資料，驗證使用者輸入（必填、格式、長度）。使用 htmlspecialchars() 防止 XSS 攻擊，這是 PHP 最常見的應用場景之一，適合用來接收使用者輸入、處理資料並進行安全性驗證。

1. HTML 表單與 PHP 處理

1.1 建立一個 HTML 表單

我們先建立一個簡單的 HTML 表單，讓使用者輸入名稱和電子郵件。

程式碼：form.html

<!DOCTYPE html>
<html lang="zh-Hant">
<head>
    <meta charset="UTF-8">
    <title>表單輸入範例</title>
</head>
<body>
    <h2>使用者資料輸入</h2>
    <form action="process.php" method="POST">
        姓名：<input type="text" name="name"><br><br>
        電子郵件：<input type="email" name="email"><br><br>
        <input type="submit" value="提交">
    </form>
</body>
</html>

1.2 處理表單資料

程式碼：process.php

<?php
// 檢查是否有資料傳送過來
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    // 使用 $_POST 接收表單資料
    $name = $_POST['name'];
    $email = $_POST['email'];

    // 輸出資料
    echo "姓名：" . htmlspecialchars($name) . "<br>";
    echo "電子郵件：" . htmlspecialchars($email) . "<br>";
} else {
    echo "未提交資料！";
}
?>

程式碼解釋：

  1. $_POST：用來接收 POST 方法傳送的表單資料。
  2. htmlspecialchars()：
    • 防止 XSS 攻擊，將特殊字元轉換為 HTML 實體。
    • 範例：< 會轉換成 &lt;，> 轉換成 &gt;。
  3. $_SERVER["REQUEST_METHOD"]：檢查傳送方式是否為 POST。

1.3 表單執行結果

假設使用者輸入：

輸出結果：

姓名：LiEdward  
電子郵件：test@example.com

2. 資料驗證

2.1 驗證必填欄位

確保使用者有輸入資料，否則顯示錯誤訊息。

程式碼：process.php（更新版）

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    // 接收資料並移除空白
    $name = trim($_POST['name']);
    $email = trim($_POST['email']);

    // 驗證資料
    if (empty($name)) {
        echo "姓名欄位是必填的！<br>";
    } else {
        echo "姓名：" . htmlspecialchars($name) . "<br>";
    }

    if (empty($email)) {
        echo "電子郵件欄位是必填的！<br>";
    } elseif (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
        echo "電子郵件格式不正確！<br>";
    } else {
        echo "電子郵件：" . htmlspecialchars($email) . "<br>";
    }
} else {
    echo "未提交資料！";
}
?>

程式碼解釋：

  1. trim()：去除輸入字串兩端的空白。
  2. empty()：檢查欄位是否為空。
  3. filter_var()：
    • 使用 FILTER_VALIDATE_EMAIL 驗證電子郵件格式。

2.2 表單執行結果

使用者輸入輸出結果
姓名：空白姓名欄位是必填的！
電郵：test電子郵件格式不正確！
姓名：LiEdward，電郵正確顯示姓名和電子郵件的輸出結果

3. 表單安全性 – 防止 XSS 攻擊

問題：XSS 攻擊

解決方法：使用 htmlspecialchars()

htmlspecialchars() 會將特殊字元轉換成 HTML 實體，確保網頁安全。

範例：

<?php
$name = "<script>alert('XSS 攻擊');</script>";
$safe_name = htmlspecialchars($name);

echo "未處理輸出：$name<br>";
echo "處理後輸出：$safe_name";
?>

輸出結果：

未處理輸出：<script>alert('XSS 攻擊');</script>
處理後輸出：&lt;script&gt;alert('XSS 攻擊');&lt;/script&gt;

4. 綜合練習 – 使用者註冊表單

需求：

  1. 建立一個註冊表單，讓使用者輸入姓名、電子郵件與密碼。
  2. 驗證：
    • 姓名必填
    • 電子郵件必填且格式正確
    • 密碼長度至少 6 個字元

程式碼：form.html

<!DOCTYPE html>
<html lang="zh-Hant">
<head>
    <meta charset="UTF-8">
    <title>註冊表單</title>
</head>
<body>
    <h2>註冊表單</h2>
    <form action="register.php" method="POST">
        姓名：<input type="text" name="name"><br><br>
        電子郵件：<input type="email" name="email"><br><br>
        密碼：<input type="password" name="password"><br><br>
        <input type="submit" value="註冊">
    </form>
</body>
</html>

程式碼：register.php

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    // 接收並處理資料
    $name = trim($_POST['name']);
    $email = trim($_POST['email']);
    $password = trim($_POST['password']);

    // 驗證欄位
    if (empty($name)) {
        echo "姓名欄位是必填的！<br>";
    }

    if (empty($email) || !filter_var($email, FILTER_VALIDATE_EMAIL)) {
        echo "請輸入有效的電子郵件！<br>";
    }

    if (strlen($password) < 6) {
        echo "密碼必須至少 6 個字元！<br>";
    }

    if (!empty($name) && filter_var($email, FILTER_VALIDATE_EMAIL) && strlen($password) >= 6) {
        echo "註冊成功！<br>";
        echo "姓名：" . htmlspecialchars($name) . "<br>";
        echo "電子郵件：" . htmlspecialchars($email) . "<br>";
    }
} else {
    echo "未提交資料！";
}
?>

執行結果範例：

輸入資料結果
姓名空白，電郵正確，密碼 12345姓名欄位是必填的！
密碼長度不足！
姓名：LiEdward，電郵格式錯誤請輸入有效的電子郵件！
姓名、電郵、密碼正確註冊成功，顯示輸入的資訊
5個小時學會 PHP：第3節 PHP 陣列與 PHP 字串操作
5個小時學會 PHP：第5節 PHP 文件處理與 PHP MySQL 資料庫操作



主頁 » PHP » 第4節 PHP 表單處理與資料驗證 – 5個小時學會 PHP
對您有幫助的話，請我喝杯咖啡吧，Have a good day ʕ•ᴥ•ʔ
Exit mobile version