ساخت فرم با انتخاب نام کاربری

ساخت فرم با انتخاب نام کاربری – راهنمای جامع با PHP

ساخت فرم با انتخاب نام کاربری – راهنمای جامع با PHP

در این مقاله، به بررسی نحوه ساخت یک فرم HTML که به کاربران امکان انتخاب نام کاربری را می‌دهد و سپس این اطلاعات را با استفاده از PHP پردازش می‌کند، می‌پردازیم. این فرآیند شامل طراحی فرم، اعتبارسنجی ورودی‌ها، اتصال به پایگاه داده (اختیاری) و نمایش نتایج است. هدف این مقاله، ارائه یک راهنمای عملی و قابل فهم برای توسعه‌دهندگان وب است.

بخش اول: طراحی فرم HTML

اولین قدم در ساخت این سیستم، طراحی فرم HTML است. این فرم باید شامل یک فیلد ورودی برای نام کاربری و یک دکمه ارسال باشد. همچنین، می‌توان از ویژگی‌های HTML5 برای بهبود تجربه کاربری و اعتبارسنجی اولیه استفاده کرد.

<form action="process_username.php" method="post">
  <label for="username">نام کاربری:</label>
  <input type="text" id="username" name="username" required pattern="[a-zA-Z0-9_]{3,20}" title="فقط حروف، اعداد و زیرخط مجاز است. طول نام کاربری باید بین 3 تا 20 کاراکتر باشد.">
  <br><br>
  <input type="submit" value="ثبت نام کاربری">
</form>

در این کد:

  • action="process_username.php": مشخص می‌کند که فرم پس از ارسال، به فایل process_username.php ارسال شود.
  • method="post": مشخص می‌کند که داده‌ها با استفاده از متد POST ارسال شوند.
  • <label for="username">: یک برچسب برای فیلد ورودی نام کاربری ایجاد می‌کند.
  • <input type="text" id="username" name="username">: یک فیلد ورودی متنی برای نام کاربری ایجاد می‌کند.
  • required: مشخص می‌کند که این فیلد اجباری است و کاربر باید آن را پر کند.
  • pattern="[a-zA-Z0-9_]{3,20}": یک الگوی regex را تعریف می‌کند که نام کاربری باید با آن مطابقت داشته باشد. این الگو فقط حروف، اعداد و زیرخط را مجاز می‌کند و طول نام کاربری را بین 3 تا 20 کاراکتر محدود می‌کند.
  • title="فقط حروف، اعداد و زیرخط مجاز است. طول نام کاربری باید بین 3 تا 20 کاراکتر باشد.": یک پیام راهنما را برای کاربر نمایش می‌دهد در صورتی که نام کاربری وارد شده با الگو مطابقت نداشته باشد.
  • <input type="submit" value="ثبت نام کاربری">: یک دکمه ارسال ایجاد می‌کند.

بخش دوم: پردازش فرم با PHP

پس از ارسال فرم، داده‌ها به فایل process_username.php ارسال می‌شوند. در این فایل، باید داده‌ها را دریافت، اعتبارسنجی کنید و سپس اقدامات لازم را انجام دهید. در اینجا یک مثال از نحوه پردازش فرم با PHP آورده شده است:

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
  $username = $_POST["username"];

  // اعتبارسنجی نام کاربری
  if (empty($username)) {
    echo "نام کاربری نمی‌تواند خالی باشد.";
  } elseif (!preg_match("/^[a-zA-Z0-9_]+$/", $username)) {
    echo "نام کاربری فقط می‌تواند شامل حروف، اعداد و زیرخط باشد.";
  } elseif (strlen($username) < 3 || strlen($username) > 20) {
    echo "طول نام کاربری باید بین 3 تا 20 کاراکتر باشد.";
  } else {
    // نام کاربری معتبر است.
    // در اینجا می‌توانید نام کاربری را در پایگاه داده ذخیره کنید یا اقدامات دیگری انجام دهید.
    echo "نام کاربری '" . htmlspecialchars($username) . "' با موفقیت ثبت شد.";
  }
} else {
  echo "دسترسی غیرمجاز.";
}
?>

در این کد:

  • if ($_SERVER["REQUEST_METHOD"] == "POST"): بررسی می‌کند که آیا فرم با متد POST ارسال شده است یا خیر.
  • $username = $_POST["username"];: مقدار فیلد نام کاربری را از آرایه $_POST دریافت می‌کند.
  • empty($username): بررسی می‌کند که آیا فیلد نام کاربری خالی است یا خیر.
  • preg_match("/^[a-zA-Z0-9_]+$/", $username): بررسی می‌کند که آیا نام کاربری فقط شامل حروف، اعداد و زیرخط است یا خیر.
  • strlen($username) < 3 || strlen($username) > 20: بررسی می‌کند که آیا طول نام کاربری بین 3 تا 20 کاراکتر است یا خیر.
  • htmlspecialchars($username): کاراکترهای خاص HTML را در نام کاربری تبدیل می‌کند تا از حملات XSS جلوگیری شود.

بخش سوم: اتصال به پایگاه داده (اختیاری)

اگر می‌خواهید نام کاربری را در پایگاه داده ذخیره کنید، باید یک اتصال به پایگاه داده ایجاد کنید و یک کوئری SQL برای درج نام کاربری اجرا کنید. در اینجا یک مثال از نحوه اتصال به پایگاه داده MySQL با استفاده از PDO آورده شده است:

<?php
$servername = "localhost";
$username = "your_username";
$password = "your_password";
$dbname = "your_database";

try {
  $conn = new PDO("mysql:host=$servername;dbname=$dbname", $username, $password);
  // تنظیم PDO error mode به exception
  $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

  if ($_SERVER["REQUEST_METHOD"] == "POST") {
    $username = $_POST["username"];

    // اعتبارسنجی نام کاربری (همانند بخش قبل)
    if (empty($username)) {
      echo "نام کاربری نمی‌تواند خالی باشد.";
    } elseif (!preg_match("/^[a-zA-Z0-9_]+$/", $username)) {
      echo "نام کاربری فقط می‌تواند شامل حروف، اعداد و زیرخط باشد.";
    } elseif (strlen($username) < 3 || strlen($username) > 20) {
      echo "طول نام کاربری باید بین 3 تا 20 کاراکتر باشد.";
    } else {
      // نام کاربری معتبر است.
      // درج نام کاربری در پایگاه داده
      $sql = "INSERT INTO users (username) VALUES (:username)";
      $stmt = $conn->prepare($sql);
      $stmt->bindParam(':username', $username);
      $stmt->execute();

      echo "نام کاربری '" . htmlspecialchars($username) . "' با موفقیت در پایگاه داده ثبت شد.";
    }
  } else {
    echo "دسترسی غیرمجاز.";
  }
} catch(PDOException $e) {
  echo "Connection failed: " . $e->getMessage();
}
?>

در این کد:

  • $servername, $username, $password, $dbname: اطلاعات اتصال به پایگاه داده را مشخص می‌کنند.
  • new PDO("mysql:host=$servername;dbname=$dbname", $username, $password): یک اتصال به پایگاه داده MySQL ایجاد می‌کند.
  • $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION): حالت مدیریت خطا را به exception تنظیم می‌کند.
  • $sql = "INSERT INTO users (username) VALUES (:username)": یک کوئری SQL برای درج نام کاربری در جدول users ایجاد می‌کند.
  • $stmt = $conn->prepare($sql): کوئری SQL را آماده می‌کند.
  • $stmt->bindParam(':username', $username): مقدار نام کاربری را به پارامتر :username در کوئری SQL متصل می‌کند.
  • $stmt->execute(): کوئری SQL را اجرا می‌کند.

بخش چهارم: نمایش نتایج و بهبود تجربه کاربری

پس از پردازش فرم و ذخیره نام کاربری (در صورت نیاز)، باید نتایج را به کاربر نمایش دهید. این نتایج می‌توانند شامل پیام موفقیت، پیام خطا یا سایر اطلاعات مرتبط باشند. همچنین، می‌توانید از CSS برای بهبود ظاهر فرم و پیام‌ها استفاده کنید.

برای بهبود تجربه کاربری، می‌توانید از جاوااسکریپت برای اعتبارسنجی فوری ورودی‌ها در سمت کاربر استفاده کنید. این کار می‌تواند به کاهش بار سرور و ارائه بازخورد سریع‌تر به کاربر کمک کند.

همچنین، می‌توانید از یک سیستم مدیریت خطا قوی برای مدیریت خطاها و نمایش پیام‌های مناسب به کاربر استفاده کنید. این کار می‌تواند به بهبود قابلیت اطمینان و پایداری سیستم شما کمک کند.

نتیجه‌گیری

در این مقاله، به بررسی نحوه ساخت یک فرم HTML که به کاربران امکان انتخاب نام کاربری را می‌دهد و سپس این اطلاعات را با استفاده از PHP پردازش می‌کند، پرداختیم. این فرآیند شامل طراحی فرم، اعتبارسنجی ورودی‌ها، اتصال به پایگاه داده (اختیاری) و نمایش نتایج است. با استفاده از این راهنما، می‌توانید یک سیستم ثبت نام کاربری ساده و کارآمد را ایجاد کنید.