Thaimisc.com : เรียน PHP จากโปรเจ็คเว็บแอปพลิเคชั่น :: หน้าจอล็อกอิน ตอนที่ 1
ThaiMisc.Com : Free Webboard | Free GuestBook | Free Poll | Free Ecard Server | Free Java Chat Room | Advertising | Contact Us | Colocation | Web Hosting | เปิดร้านค้าฟรี


Category : Php Developer Print Article Only Print Aticle With Comment
เรียน PHP จากโปรเจ็คเว็บแอปพลิเคชั่น :: หน้าจอล็อกอิน ตอนที่ 1
เขียนโดย เดอะกาฝากไดอารี่ (channelv_on_mobile@hotmail.com) , 12-12-2004
หายหน้าไปนานพอดู (อีกแล้ว) ช่วงนี้อยู่ในช่วงกำลังพยายามจัดเวลาของตัวเองครับ เรื่องงานก็พยายามจะกำหนดหน้าที่ของตัวเองให้แน่นอนยิ่งขึ้น จากที่ทำอยู่ในปัจจุบัน จับกังเราดีๆ นี่เอง เพราะรับทำโน่นทำนี่ไปหมด จนหาเวลาให้ส่วนตัว มาอัพเดตเนื้อหาไม่ได้เลย เหอๆ

ผมขอจบเรื่องราวเกี่ยวกับการเล่นกับไฟล์ไปในตอนที่ผ่านมาซะเลยนะครับ จากตรงนี้ผมจะเปลี่ยนแนวทางของเนื้อหาไปเป็น การเรียนรู้ PHP จากการสร้างเว็บแอปพลิเคชั่นจริงๆ ดีกว่า ผมคิดว่าน่าจะได้อะไรมากกว่าด้วย สำหรับตอนเก่าๆ ที่ผมเคยเขียนถึงไป ก็ถือว่าเป็นพื้นฐานที่น่าจะเรียนรู้เอาไว้

สำหรับมือใหม่ ที่ไม่อาจทนอ่านพื้นฐานยาวๆ ได้ อยากจะลองเชิงกับการพัฒนาเว็บแอปพลิเคชั่นจริงๆ ไปพร้อมๆ กับการเรียนรู้ PHP เลย ผมว่าเริ่มอ่านจากตรงนี้ก็น่าจะโอเค... น้ำอาจจะเยอะไปหน่อยนะครับ เพราะว่าผมอยากให้มือใหม่ อ่านบทความในส่วนนี้เข้าใจไปพร้อมๆ กันด้วยกัน ผมอาจจะมาอธิบายเรื่องราวเกี่ยวกับฟังก์ชันอีกครั้ง ณ จุดนี้อีกที

ก้าวแรกของการทำเว็บแอปพลิเคชั่น สำหรับผมแล้วคงหนีไม่พ้นเรื่องราวของหน้าจอล็อกอิเข้าสู่ระบบ ของเว็บแอปพลิเคชั่นละครับ เป็นอะไรที่หลายต่อหลายคน อยากรู้มากที่สุด

ทำไมต้องมีหน้าจอล็อกอิน?!?
คำถามนี้ตอบได้ง่ายมากครับ ที่ต้องมีหน้าจอล็อกอินก็เพราะว่า เราคงไม่อยากให้ใครต่อใครก็เข้ามาใช้แอปพลิเคชั่นของเราได้ จริงไหมล่ะครับ ดังนั้นจึงต้องมีการป้องกันเอาไว้ ด้วยการให้ล็อกอิน หรือพูดง่ายๆ ก็คือ ต้องใส่ username และ password (ชื่อผู้ใช้งาน และรหัสผ่าน) ก่อนทุกครั้งที่จะเข้ามาใช้งาน (หรือบางแอปพลิเคชั่นอาจจะให้ใส่เฉพาะ password ก็เป็นได้)

การทำหน้าจอล็อกอินนั้น มีด้วยกัน 2 วิธีหลักๆ ก็คือ

  • การใช้ฟีเจอร์ HTTP Authentication
  • การสร้างหน้าจอล็อกอินเอง

ความแตกต่างของทั้ง 2 วิธีก็ไม่มีอะไรมากครับ คือ

การใช้ฟีเจอร์ HTTP Authentication นั้นจะเป็นการใช้ฟังก์ชัน header() ของ PHP ในการส่ง Authentication Required ไปยังบราวเซอร์ เพื่อให้ทำการ pop up หน้าจอให้กรอก username และ password ขึ้นมา รูปแบบนี้มีข้อดีตรงที่เราไม่ต้องลงแรงออกแบบหน้าล็อกอินอะไรเลย และการตรวจสอบการล็อกอิน จะทำตั้งกะโหลด header ของเว็บเพจ ทำให้รวดเร็วครับ

การสร้างหน้าจอล็อกอินเอง นั้นจะเป็นการใช้ PHP ร่วมกับ HTML ในการออกแบบหน้าเว็บ เพื่อให้ผู้เข้ามาเยี่ยมชม ได้ใส่ username และ password เพื่อทำการล็อกอินเข้าไปใช้งานเว็บแอปพลิเคชั่นครับ ข้อดีของวิธีนี้คือ สวยครับ หลักๆ เลยคือสวยงาม ทั้งนี้ก็เพราะว่าเราสามารถที่จะทำการใส่ลูกเล่นอะไรได้มากมาย เช่นเดียวกับการออกแบบเว็บไซต์นั่นเอง เราจะใช้รูปภาพ flash หรืออะไรต่อมิอะไรมาช่วยได้หมดครับ

ทีนี้ถามผมว่าแบบไหนดีกว่า?!? ผมไม่มีคำตอบหรอกนะครับ มันอยู่ที่ความต้องการของเรามากกว่าครับ หากต้องการความสวยงามก็ควรที่จะออกแบบหน้าจอล็อกอินเอง แต่ถ้าขี้เกียจมากๆ ก็ใช้วิธี HTTP Authentication ดีกว่าครับ

วิธีการทำหน้าจอล็อกอินด้วย HTTP Authentication
ทีนี้มาพูดถึงวิธีแรกกันก่อน ว่าจะเขียนโค้ดยังไง วิธีพื้นที่สุด ขอให้ไปดูใน PHP Manual ครับ (อ้าว!) เขาจะมีตัวอย่างไว้ให้ดังนี้

<?php
  if (!isset($_SERVER['PHP_AUTH_USER'])) {
    header('WWW-Authenticate: Basic realm="My Realm"');
    header('HTTP/1.0 401 Unauthorized');
    echo 'Text to send if user hits Cancel button';
    exit;
  } else {
    echo "<p>Hello {$_SERVER['PHP_AUTH_USER']}.</p>";
    echo "<p>You entered {$_SERVER['PHP_AUTH_PW']} as your password.</p>";
  }
?>

ก่อนที่จะดูว่าโค้ดแต่ละบรรทัดมีความหมายยังไง ขอให้ดูตัวแปร 2 ตัวก่อนคือ $_SERVER['PHP_AUTH_USER'] และ $_SERVER['PHP_AUTH_PW'] ครับ (สำหรับ PHP เวอร์ชันเก่า จะเรียกเป็น $HTTP_SERVER_VARS['PHP_AUTH_USER'] และ $HTTP_SERVER_VARS['PHP_AUTH_PW']) ทั้ง 2 ตัวแปรนี้ ก็คือตัวแปรสำหรับช่องกรอก username และ password ตามลำดับนั่นเอง เป็นตัวแปรระบบของ PHP เลยนะครับ ไม่สามารถเปลี่ยนเป็นอย่างอื่นได้

เอาละ มาดูว่าโค้ดแต่ละบรรทัดนั้นทำอะไรได้บ้างกัน

if (!isset($_SERVER['PHP_AUTH_USER']))
ฟังก์ชัน isset(ชื่อตัวแปร) มีเอาไว้เพื่อตรวจสอบว่ามีตัวแปรตามที่ระบุหรือไม่... หากมีการระบุค่าให้กับตัวแปรนี้ ฟังก์ชัน isset() จะทำการ return ค่าเป็น true แต่หากไม่มีก็จะทำการ return ค่าเป็น false กลับมาครับ อนึ่ง ความหมายของการไม่ระบุค่านั้นหมายถึง ไม่ได้มีการกำหนดค่าให้กับตัวแปรนั้นนะครับ แต่การกำหนดค่าตัวแปรให้เป็นค่าว่า เช่น

$a = "";
if (isset($a)) { echo "มีตัวแปร $a"; }
else { echo "ไม่มีตัวแปร $a"; }

เมื่อเรารันโค้ด เราจะได้ผลลัพธ์ว่า มีตัวแปร $a ครับ แต่หากเราเขียนแค่

if (isset($a)) { echo "มีตัวแปร $a"; }
else { echo "ไม่มีตัวแปร $a"; }

เราจะได้ผลลัพธ์เป็น ไม่มีตัวแปร $a ครับ

เอาละ มาดูที่ตรงโค้ดต่อ... จากที่อธิบายการใช้งานฟังก์ชัน isset() แล้ว ทำให้เรารู้ว่า เงื่อนไขที่กำหนดก็คือ ถ้า ตัวแปร $_SERVER['PHP_AUTH_USER'] ไม่มีการระบุมา (เครื่องหมาย ! ที่อยู่หน้าฟังก์ชัน isset() มีความหมายว่า not หรือ แปลเป็นไทยก็คือ ไม่ นั่นเอง)

header('WWW-Authenticate: Basic realm="My Realm"');
header('HTTP/1.0 401 Unauthorized');

ฟังก์ชัน header เป็นฟังก์ชันของ PHP ที่ใช้สำหรับส่งข้อความ HTTP header ไปยังบราวเซอร์... ไอ้ header ที่ว่านี่เหมือนกับเป็นจดหมายปะหน้าของเอกสาร HTML ครับ บราวเซอร์จะทำการรันข้อมูลส่วนนี้ก่อนเสมอ เช่น หากเราเขียนโค้ดแบบนี้

<?php
  header("HTTP/1.0 404 Not Found");
?>

เวลาที่เรารันผลโค้ด เราจะได้หน้าเว็บแบบนี้ครับ

บราวเซอร์จะคิดว่า ไม่มีไฟล์นี้อยู่ในเว็บเซิร์ฟเวอร์ไปซะนี่ เหอๆ

เอาละ มาอธิบายโค้ดกันต่อ... ดังนั้น ไอ้ header() ที่เราเห็นในโค้ด มันจึงมีความหมายว่า ให้สร้างหน้าจอ pop up เป็น WWW-Authenticate แบบ Basic โดยตั้งชื่อ realm ว่า My Realm ครับ โดยหากเราคลิกปุ่ม cancel ไป เราจะได้ข้อความกลับมาว่า Text to send if user hits Cancel button

แต่ถ้ามีคลิก OK แทน และกรอก (หรือไม่กรอก) username และ password เราจะได้ข้อความ

Hello username ที่กรอก.
You entered password ที่กรอก as your password.

ครับ

(ติดตามตอนต่อไป)

<- Back | Next ->

ThaiMisc.Com : Free Webboard | Free GuestBook | Free Poll | Free Ecard Server | Free Java Chat Room | Advertising | Contact Us
Copyright 1999-2006 Thailand Miscellaneous. Allrights reserved. webmaster@thaimisc.com