Rabu, 20 April 2016

Cara Membuat Kode PHP Login dan Logout Dengan Mudah

Cara membuat kode php login dan logout - kodephp.id | Halo sobat Kodephp.id pada kesempatan kali ini kita akan membahas mengenai cara membuat kode php login dan logout, perlu anda ketahui pada saat kita membuat sebuat aplikasi kita harus membuat keamanan berupa login agar tidak sembarang user dapat masuk kedalam program kita hal ini juga pentinng untuk keamanan sebuat website dan logout di gunakan utuk mengakhiri session user untuk berganti dengan user yang lain dan keluar dari sistem

Pada totorial kali ini kita akan membuat sebuah form login sederhana namun catik dengan bantuan bootstrap dan juga jquery agar form login terlihat lebih elegant dan cantik berikut tampilan login yang akan kita buat nantinya.


Untuk memulai membuat form login terlebih dahulu kita membuat databsenya terlebih dahulu, pada kesempatan kali ini saya membuat nama database dengan nama db_belajar pada phpmyadmin kemudian buat sebuat tabel dengan nama login atau agar lebih mudah anda dapat mengcopy kode di bawah ini.

 -- phpMyAdmin SQL Dump  
 -- version 4.4.12  
 -- http://www.phpmyadmin.net  
 --  
 -- Host: 127.0.0.1  
 -- Generation Time: Apr 20, 2016 at 03:47 PM  
 -- Server version: 5.6.25  
 -- PHP Version: 5.6.11  
 SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";  
 SET time_zone = "+00:00";  
 /*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;  
 /*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;  
 /*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;  
 /*!40101 SET NAMES utf8mb4 */;  
 --  
 -- Database: `db_belajar`  
 --  
 -- --------------------------------------------------------  
 --  
 -- Table structure for table `login`  
 --  
 CREATE TABLE IF NOT EXISTS `login` (  
  `username` varchar(100) NOT NULL,  
  `password` varchar(100) NOT NULL  
 ) ENGINE=InnoDB DEFAULT CHARSET=latin1;  
 --  
 -- Dumping data for table `login`  
 --  
 INSERT INTO `login` (`username`, `password`) VALUES  
 ('kode', 'php');  
 --  
 -- Indexes for dumped tables  
 --  
 --  
 -- Indexes for table `login`  
 --  
 ALTER TABLE `login`  
  ADD PRIMARY KEY (`username`);  
 /*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;  
 /*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;  
 /*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;  

Setalah itu anda buat sebuat file dengan nama index.php di folder htdocs anda kemudian copykan kode berikut ini.

 <!DOCTYPE html>  
 <?php  
 mysql_connect('localhost','root','');  
  mysql_select_db('db_belajar');  
  if(!isset($_SESSION))  
  session_start();  
  if(isset($_POST['username']) && isset($_POST['password']))  
  {  
    if(trim($_POST['username']==""))  
    $errorusername="Isikan username";  
    if(trim($_POST['password']=="" ))  
    $errorpassword="Isikan password";  
    if(trim($_POST['username']!="") && trim($_POST['password']!="" ))  
    {  
     $userpost=addslashes($_POST['username']);  
     $passpost=addslashes($_POST['password']);  
     $exec=mysql_query("select * from login where username='$userpost'");  
     $r=mysql_fetch_array($exec);  
     $userfield=$r[0];  
     $passfield=$r[1];  
     if(mysql_num_rows($exec)<>0)  
     {  
      if($passfield==($passpost))  
      {  
       $_SESSION['username']=$userpost;  
       $_SESSION['nama']=$r['nama'];  
       $_SESSION['udahlogin']="Y";  
       header("location:berhasil.php");  
      }  
      else  
      {  
       $errorall="Login gagal!";  
      }  
     }  
     else  
      $errorall="Login gagal!";  
    }  
  }  
 ?>  
 <!DOCTYPE html>  
 <html lang="en">  
   <head>  
     <meta charset="utf-8" />  
     <title>KODE PHP LOGIN</title>  
     <meta http-equiv="X-UA-Compatible" content="IE=edge">  
     <meta content="width=device-width, initial-scale=1" name="viewport" />  
     <meta content="" name="description" />  
     <meta content="" name="author" />  
   <link href="bootstrap.css" rel="stylesheet" />  
    <link href="lock.min.css" rel="stylesheet" type="text/css" />  
   <link href="style.css" rel="stylesheet" />  
   <body class="">  
     <div class="page-lock">  
       <div class="page-logo">  
       </div>  
       <div class="page-body">  
         <div class="lock-head"> Login Untuk Masuk Ke sistem </div>  
         <div class="lock-body">  
           <div class="pull-left lock-avatar-block">  
             <img src="1.png" class="lock-avatar"> </div>  
           <form class="lock-form pull-left" action="" method="post">  
               <div class="form-group">  
               <span class="error" style="color:red"><?php if(isset($_GET['code'])) echo "Anda berhasil logout!" ?><?php if(isset($errorall)) echo $errorall ?><?php if(isset($errorusername)) echo "* ".$errorusername ?></span>  
               <input class="form-control placeholder-no-fix" type="text" autocomplete="off" placeholder="username" name="username" value="<?php if(isset($_POST['username'])) echo $_POST['username'] ?>" /> </div>  
             <div class="form-group">  
             <span class="error" style="color:red"><?php if(isset($errorpassword)) echo "* ".$errorpassword ?></span>  
               <input class="form-control placeholder-no-fix" type="password" autocomplete="off" placeholder="Password" name="password" value="<?php if(isset($_POST['password'])) echo $_POST['password'] ?>"/> </div>  
             <div class="form-actions">  
               <button type="submit" class="btn red uppercase">Login</button>  
             </div>  
           </form>  
         </div>  
         <div class="lock-bottom">  
           <a href="#">Kembali Ke Home</a>  
         </div>  
       </div>  
       <div class="page-footer-custom"> 2016 &copy; <a href="http://kodephp.id">KODEPHP.id</a>. </div>  
     </div>  
    <script src="bootstrap.js"></script>  
   <script src="custom.js"></script>  
   </body>  
 </html>  

Setelah kode login di atas benar anda copy maka tahap selanjutnya anda tinggal mendownload javascrip yang dibutuhkan agar tampilan form login anda seperti gambar di atas anda dapat mendownloadnya DISINI

Kemudian extract mengguakan winrar dan letakkan file-file tersebut dalam 1 folder seperti gambar di bawah ini.
Setalah file-file yang di butuhkan sudah dalam satu folder maka anda akan mendapatkan tampilan seperti berikut pada form login anda.
GAMBAR : FORM LOGIN
Selanjutnya mari kita membuat halaman setelah kita berhasil login, kita cukup membuat file baru dengan nama berhasil.php dan copykan kode berikut ini.

 ANDA BERHASIL LOGIN <?php  
 if(!isset($_SESSION))  
  session_start();  
 if(!isset($_SESSION['udahlogin']))  
  header("location:index.php");  
 ?>  
 <a href="logout.php">KELUAR</a>  

Setelah anda selesai membuat coa anda login melalui form login dengan Username : kode dan Password : php jika username dan password benar maka anda akan di alihkan ke halaman berhasil.php seperti gambar di bawah ini.
Jika tampilan sudah seperti di atas artinya anda sudah berhasil membuat form login dan juga halaman berhasil login kemudian kita akan membuat file logut.php yang berfungsi untuk menghapus session yang kita buat dengan form login dan juga untuk keluar dari halaman berhasil login.

Untuk membuat logout kita terlebih dahulu membuat file logut.php kemudian kita copykan kode di bawah ini.

 <?php  
 if(!isset($_SESSION))  
  session_start();  
  unset($_SESSION['username']);  
  unset($_SESSION['udahlogin']);  
  header("location:index.php?code=3");  
 ?>  

maka anda sudah dapat logout atau keluar dari halaman berhasil login, jika tidak berhail pastikan file-file yang di butuhkan seperti gambar di bawah ini agar dapat berjalan dengan baik.


Nah jika itulah cara membuat kode php login dan logout bagi sobat yang tidak ingin capek dan ingin mendapatkan source kodenya silahkan mendownloadnya melalui link di bawah, Salam KODEPHP.ID


Jika masih bingung jangan sungkan untuk bertanya melalui form komentar kami siap membantu anda :D

Berkomentarlah dengan baik.
Dilarang meninggalkan link hidup dan mengandung kata-kata yang kasar.
EmoticonEmoticon

:)
:(
hihi
:-)
:D
=D
:-d
;(
;-(
@-)
:P
:o
:>)
(o)
:p
:-?
(p)
:-s
(m)
8-)
:-t
:-b
b-(
:-#
=p~
$-)
(y)
(f)
x-)
(k)
(h)
cheer