การสร้างระบบ Login (ล็อคอิน) และ logout (ล็อคเอ้าท์) อย่างง่าย

PHP Knowledge เป็น บอร์ดรวามความรู้ php เน้นบทความ แนวทางการเขียนโปรแกรม บันทึกกันลืม เพื่อให้สมาชิกได้เขียนความรู้ที่ตัวเองมีให้สมาชิกท่านอื่นๆ ได้ เข้ามาอ่าน และ ไว้อ่านเองกันลืมด้วย

Moderator: mindphp, ผู้ดูแลกระดาน

ภาพประจำตัวสมาชิก
pprn
PHP Super Hero Member
PHP Super Hero Member
โพสต์: 565
ลงทะเบียนเมื่อ: 02/07/2018 10:45 am

การสร้างระบบ Login (ล็อคอิน) และ logout (ล็อคเอ้าท์) อย่างง่าย

โพสต์ที่ยังไม่ได้อ่าน โดย pprn »

  • ในที่นี้จะยกตัวอย่างการส่งข้อมูลจากจากฟอร์ม (form) แบบ POST นั้น จะส่งข้อมูลไม่แสดงข้อมูลที่ส่งไปให้เห็นผ่าน URL เหมาะสำหรับการส่งข้อมูลแบบยาวๆ
เพราะไม่มีข้อจำกัดของเรื่องขนาดของข้อมูลที่ส่ง ต้องการความปลอดภัย เพราะมีหน้า Login (ล็อคอิน) - Logout (ล็อคเอาท์) ที่ต้องการส่งข้อมูลแบบเป็นความลับ
  • โดยเราจะแบ่งหน้าออกเป็น 1 หน้า หน้าแรกคือ หน้า index.php ซึ่งเป็นหน้า login เข้าระบบซึ่งเราจะเป็นคนตั้ง username และ password ไว้แล้ว หน้า 2 คือ
หน้า header.html ซึ่งเป็นหน้าที่เอาไว้โชว์ส่วน Navigation Bars (เนวิเกชั่น บาร์)
  • โดยเราจะตั้งให้ username คือ admin และ password คือ 123
รูปแบบการส่งข้อมูลฟอร์ม (form) แบบ POST
  • โค้ด: เลือกทั้งหมด

    <form action="ไฟล์ปลายทางที่ใช้สำหรับเขียนสคิปต์ PHP" method="post">>

หน้าผลลัพธ์
  • 1.หน้า index.php ซึ่งเป็นหน้า login เข้าระบบ
  • หน้า index.php ซึ่งเป็นหน้า login เข้าระบบ
    หน้า index.php ซึ่งเป็นหน้า login เข้าระบบ
  • 2.หน้า index.php ซึ่งเป็นหน้า login เข้าระบบเมื่อเข้าระบบผิด
  • หน้า index.php ซึ่งเป็นหน้า login เข้าระบบเมื่อเข้าระบบผิด
    หน้า index.php ซึ่งเป็นหน้า login เข้าระบบเมื่อเข้าระบบผิด
  • 3.หน้า index.php ซึ่งเป็นหน้า logout เมื่อเข้าระบบได้แล้ว
  • หน้า index.php ซึ่งเป็นหน้า logout เมื่อเข้าระบบได้แล้ว
    หน้า index.php ซึ่งเป็นหน้า logout เมื่อเข้าระบบได้แล้ว
รูปแบบโค้ด หน้า Index.php
  • โค้ด: เลือกทั้งหมด

    <html>
    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    
    <!-- Optional theme -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <!-- Latest compiled and minified JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
    
    <title>Work</title>
    </head>
    
    <body>
    <div class="container-fluid">
        
        
    	<?php session_start(); // ถ้า login ไปแล้วจะ ย้อนกลับมาใหม่ err (ตัวแปรที่สามารถเรียกใช้งานได้ตลอดเวลา)
    	
            //login name = admin password = 123;
            
    	if ( isset($_POST['loginButton'] ) && ($_POST['uname'] == "admin") && ($_POST['pw'] == "123") ) { //isset ตรวจตัวแปรว่ามีไหม post[แอตทริบิวต์ชื่ออิลิเมนต์]
    			$_SESSION['sid'] = session_id();  // session_id() จะทำการเก็บตัวแปรทั้งหมดที่ถูกประกาศ Session ในหน้าปัจจุบันที่กำลังทำงานอยู่
    	}
            
    	if ( isset($_POST['logout'] ) ){        // logout
    		session_destroy( );             
    		header('Location: '.$_SERVER['REQUEST_URI']);
    	}
    	
            
    	include "header.php";
    
        
    	if ( isset($_POST['loginButton'] ) && ($_POST['uname'] != "admin" || $_POST['pw'] != "123") ) { ?> 
    		<div class='alert alert-danger' >
    			Username and/or Password ไม่ถูกต้อง
    		</div>
    	<?php } ?>
        
        
        
    	<?php 
    		if ( isset($_SESSION['sid']) ) { ?>
    			<div>
    				<form class="form-horizontal" method="post">
    					<div class="form-group">
    						<center>
    							ออกจากระบบ<br>
    							<button type="submit" name="logout" class="btn btn-default" >Logout</button>
    						</center>
    					</div>
    				</form>
    			</div>
    		<?php } else { ?>
    			<div>
    				<form class="form-horizontal" method="post">
    					<div class="form-group">
    						<label class="control-label col-sm-1">Username</label>
    						<div class="col-sm-5">
    							<input type="text" class="form-control" name="uname" placeholder="Username">
    						</div>
    					</div>
    					<div class="form-group">
    						<label class="control-label col-sm-1">Password</label>
    						<div class="col-sm-5">
    							<input type="password" class="form-control" name="pw" placeholder="Password">
    						</div>
    					</div>
    					<div class="form-group">
    						<div class="col-sm-offset-1 col-sm-5">
    							<button type="submit" name="loginButton" class="btn btn-default"><span class="glyphicon glyphicon-pencil"></span> Login</button>
    						</div>
    					</div>
    				</form>
    			</div>
    		<?php } ?>
        
    
    </div>
    </body>
    </html>
  • อธิบายโค้ด
  • - session_start(); คือ ถ้า login ไปแล้วจะ ย้อนกลับมาใหม่ error (ตัวแปรที่สามารถเรียกใช้งานได้ตลอดเวลา)
    - if ( isset($_POST['loginButton'] ) && ($_POST['uname'] == "admin") && ($_POST['pw'] == "123") ) คือ การตั้ง username คือ admin และ password คือ 123
    - $_SESSION['sid'] = session_id(); คือ session_id() จะทำการเก็บตัวแปรทั้งหมดที่ถูกประกาศ Session ในหน้าปัจจุบันที่กำลังทำงานอยู่
    - session_destroy( ); คือ การทำลาย session ทิ้ง
    - include "header2.php"; คือ ส่วนการเรียนหน้า include.html มา
    - if ( isset($_POST['loginButton'] ) && ($_POST['uname'] != "admin" || $_POST['pw'] != "123") ) {} คือ การแจ้งเตือนถ้า username และ password ผิดจะแจ้งเตือนตามเงือนไขในวงเล็บ
รูปแบบโค้ด หน้า header.php
  • header.JPG
  • โค้ด: เลือกทั้งหมด

    <nav class="navbar navbar-default">
    	<div class="navbar-header">
    		<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#collapse">
    		<span class="icon-bar"></span>
    		<span class="icon-bar"></span>
    		<span class="icon-bar"></span>
    		</button>
    		<a class="navbar-brand" href="#"><span class="glyphicon glyphicon-briefcase"></span> Work</a>
    	</div>
    	<div class="collapse navbar-collapse" id="collapse">
    		<ul class="nav navbar-nav">
    			<?php if (isset($_SESSION['sid']) ) {?>
    				<li><a href="#">จัดการข้อมูล</a></li>
    			<?php } else { ?>  
    				<li><a href="#">จัดการข้อมูล</a></li>   <?php // หน้าเดิม ?>
    			<?php } ?>
    			<li><a href="#">ช่วยเหลือ</a></li>
    		</ul>
    	</div>
    </nav>
  • อธิบายโค้ด
    - if (isset($_SESSION['sid']) ) คือ ถ้าสามารถเข้าระบบมาได้แล้วจะทำตามเงือนไขหลัง if ถ้าไม่ใช่จะทำตามเงือนไข else
----------------------------------------------------------------------------------------------------------------------------------------------------------------
_____________________________________________________________________________________________
บทความนี้เเป็นบทความที่จัดทำขึ้นเพื่อเนะนำเครื่องมือช่วยสำหรับนักพัฒนา PHP ซึ่งเป็นความรู้พื้นฐานในการพัฒนา PHP OOP ต่อไป เเละขอเเนะนำความรู้ที่เกี่ยวข้องกับโดยสามารถศึกษาได้จากบทเรียน PHP ได้ที่นี่ เพื่อเพิ่มความเข้าใจในการใช้งานเครื่องมือต่างๆ ค่ะ
_____________________________________________________________________________________________

----------------------------------------------------------------------------------------------------------------------------------------------------------------
  • Similar Topics
    ตอบกลับ
    แสดง
    โพสต์ล่าสุด

ผู้ใช้งานขณะนี้

สมาชิกกำลังดูบอร์ดนี้: ไม่มีสมาชิกใหม่ และบุคลทั่วไป 67