Tutorial Cara Menciptakan Form Login Dengan Php Dan Mysql

Cara menciptakan form login dengan php dan mysql - ketika gres mengenal bahasa pemrograman php, hal yang fundamental untuk diketahui ialah bagamana cara menciptakan form login dengan php yang data login menurut data yang tersimpan di database.

Bagaimana tidak, login ialah mirip pintu masuk untuk masuk kedalam rumah tersebut yang  jikalau data tidak dikenali maka pintu tersebut tidak akan terbuka.

Ketika akan menciptakan aplikasi terkadang atau bahkan setiap aplikasi mempunyai form login, terlebih jikalau menciptakan kegiatan aplikasi yang berbasis web. 

Gambaran kasarnya, jikalau sahabat tidak terdaftar kedalam sistem maka hingga kapan pun anda tidak akan berhasil melawati form login.

jikalau demikian maka form login sangat bermamfaatkan untuk melindungi data yang ada di dalam aplikasi.

Oke mari kita mulai untuk membuat form login dengan php dan mysql, pertama jangan lupa sahabat start dulu xampp nya yaa.

Disini aku asumsikan sahabat sudah menciptakan databasenya.

Database yang aku buat terdiri dari dari….

ID – Nama – User – Password – Email – Akses

Dan coba eksklusif sahabat masukan satu data untuk login kita nanti…atau ini aku berikan script Sql nya nanti tinggal di copas

 -- phpMyAdmin SQL Dump -- version 4.5.1 -- http://www.phpmyadmin.net -- -- Host: 127.0.0.1 -- Generation Time: 07 Mar 2017 pada 07.12 -- Versi Server: 10.1.9-MariaDB -- PHP Version: 5.6.15  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: `login` --  -- --------------------------------------------------------  -- -- Struktur dari tabel `admin` --  CREATE TABLE `admin` (   `ID` int(3) NOT NULL,   `nama` varchar(30) NOT NULL,   `user` varchar(20) NOT NULL,   `password` varchar(20) NOT NULL,   `email` varchar(30) NOT NULL,   `akses` varchar(20) NOT NULL ) ENGINE=InnoDB DEFAULT CHARSET=latin1;  -- -- Dumping data untuk tabel `admin` --  INSERT INTO `admin` (`ID`, `nama`, `user`, `password`, `email`, `akses`) VALUES (1, 'ardy', 'admin', 'admin', 'email@gmail.com', 'administrator');  -- -- Indexes for dumped tables --  -- -- Indexes for table `admin` -- ALTER TABLE `admin`   ADD PRIMARY KEY (`ID`);  -- -- AUTO_INCREMENT for dumped tables --  -- -- AUTO_INCREMENT for table `admin` -- ALTER TABLE `admin`   MODIFY `ID` int(3) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=2; /*!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 */;  

Jangan lupa buat folder gres di dalam htdocs dan beri nama tutorlogin, silahkah sahabat simpan semua file .php di dalamnya..

Pertama sahabat buka arahan editor, dapat memakai notepad++ atau Codelobster…

Jangan lupa untuk menciptakan koneksi ke database sobat, jikalau masih galau menciptakan koneksinya dapat kembali ke postingan saya sebelumnya…

Jika sahabat rasa koneksi ke database berhasil, maka yang selanjutnya untuk dibentuk ialah form login untuk menampung inputan user, copy saja script di bawah ini dan simpan dengan nama form login. Simpan dan berinama formlogin.php

 <div id="login"> <form method="post" action="ceklog.php"> <table>  <tr>   <th colspan="3">Login</th>  <tr>   <td>User</td>   <td>   <input type="text" name="user" placeholder="User" autofocus required/>   </td>  </tr>  <tr>   <td>Password</td>   <td>   <input type="password" name="pass" placeholder="Password" autofocus required/>   </td>  </tr>  <tr>        <td colspan="3" align="center">   <button name="login" class="btn btn-small btn-primary" type="submit" ><i class="icon-ok icon-white"></i><strong>Login</strong></button>    <button type="reset" class="btn btn-small btn-danger"><i class="icon-remove icon-white"></i><strong>Reset</strong></button>        </td>  </tr>  </tr> </table> </form> </div> 

Jangan lupa copy juga script CSS di bawah ini dan paste didalam formlogin.php di atas code <div id="login"> untuk mempercantik tammpilannya..

Baca : Check dan Uncheck box di php dan mysql

 <style> #login{  margin-top:50px;  margin-left:500px;  margin-bottom:10px;  float:left;  width:600px;  height: 150px;  border:1px solid #cccccc; }  #login table{  width:600px;  height: 150px;  box-shadow:   5px 10px 5px #ccc;  -webkit-box-shadow: 5px 10px 5px #ccc;  -moz-box-shadow:  5px 10px 5px #ccc;  }  #login table th{  background:#353535;  color:#ffffff; }  #login table td{  padding-left:20px; } </style> 

Silahkan run formlogin tersebut, jikalau berhasil maka form tampilannya akan sperti ini

Setelah berhasil menciptakan form nya, maka langkah selanjutnya kita akan menciptakan pengecekan login….

Silahkan menciptakan lembar kerja gres lagi dan copy script di bawah ini…

  <?php  session_start(); mysql_connect("localhost","root",""); mysql_select_db("login");//koneksi DB  function anti_injection($data){ //membuat pencegahan Sql injection   $filter = mysql_real_escape_string(stripslashes(strip_tags(htmlspecialchars($data,ENT_QUOTES))));   return $filter; } $user = anti_injection($_POST['user']);//ambil data inputan didalam form login ...anti_injecton ialah fungsi pencegahan Sql injection $pass = anti_injection($_POST['pass']); if(isset($_POST['login'])){ //jika tombol login form login diklik maka script dibawah akan berjalan   if (!ctype_alnum($user) OR !ctype_alnum($pass)){//percabangan jikalau terjadi Sql injection  //pesan error  echo"<script>alert('SQL Injection Terdeteksi');window.location.href='formlogin.php';</script>"; }else{//script dibawah ini akan berjalan jikalau tidak terjadi error Sql injectio   //cek database  $query=mysql_query("select * from admin WHERE user='$user' and password='$pass'")or die(mysql_error());  $ambil=mysql_fetch_array($query);  $cek=mysql_num_rows($query);  extract($ambil);  if($cek > 0){   //$_SESSION['ID'] = ID di isi terserah,,,$ID = harus sama dengan nama field database   $_SESSION['IDuser'] = $ID;   $_SESSION['Nama'] = $nama;   $_SESSION['User']=$user;   $_SESSION['Password']=$password;   $_SESSION['Email']=$email;   $_SESSION['Akses']=$akses;   //mengalihkan halaman jikalau login berhasil   echo "<meta http-equiv='refresh' content='0; url=home.php'>";    }else{//jika user dan password tidak terdaftar di database  echo"<script>alert('Anda tidak terdaftar ke dalam sistem');window.location.href='formlogin.php';</script>";  }  }  } ?> 

Simpanlah script tersebut dengan nama ceklog.php

Oke sehabis melaksanakan beberapa tahapan, mari kita buat tampilan halamn yang akan di tampilkan jikalau seorang user berhasil login.. halaman ini tampilan home aplikasi. Tampila dimana halaman pertama yang akan mencul dikala user berhasil login..

Baca : Membuat jam digital sesuai waktu server di web

Silahkan sahabat copy arahan dibawah ini dan beri nama home.php...

 <style> #loginsukses{  margin-top:50px;  margin-left:600px;  margin-bottom:50px;  float:left;  width:500px;  height: 200px;  border:1px solid #cccccc; }  #loginsukses table{  width:500px;  height: 200px;  box-shadow:   5px 10px 5px #ccc;  -webkit-box-shadow: 5px 10px 5px #ccc;  -moz-box-shadow:  5px 10px 5px #ccc;   }  #loginsukses table th{  background:#353535;  color:#ffffff; }  #loginsukses table tr td{  padding-left:10px;  width: 1px; } </style> <?php session_start(); ?> <div id="loginsukses">  <table align="center">   <tr>    <th colspan="3">     Informasi Login    </th>   </tr>    <tr>    <td>     ID    </td>    <td>     :    </td>    <td>     <?php echo $_SESSION['IDuser']; ?>    </td>   </tr>   <tr>    <td>     Nama    </td>    <td>     :    </td>    <td>     <?php echo $_SESSION['Nama']; ?>    </td>   </tr>   <tr>    <td>     User    </td>    <td>     :    </td>    <td>     <?php echo $_SESSION['User']; ?>    </td>   </tr>   <tr>    <td>     Password    </td>    <td>     :    </td>    <td>     <?php echo $_SESSION['Password']; ?>    </td>   </tr>   <tr>    <td>     Email    </td>    <td>     :    </td>    <td>     <?php echo $_SESSION['Email']; ?>    </td>   </tr>   <tr>    <td>     Akses    </td>    <td>     :    </td>    <td>     <?php echo $_SESSION['Akses']; ?>    </td>   </tr>  </table> </div> 

Jika sudah selesai, keselurah yang kita buat td sudah tinggal di run saja..untuk menjalankannya, sahabat panggil saja file formlogin.php dengan mengetikan alamat di browser localhost/tutorlogin/formlogin.php

Berikut ialah tampilan awal dikala berhasil login/halaman home aplikasi..

Oke berhasil, bahwasanya untuk login itu ada yang multiuser juga. Dan yang kita bikin hari ini untuk single login. Untuk multiuser mungkin nanti aku akan share juga caranya semoga sahabat yang gres berguru dengan php dan database dapat lebih memahami…

Tweet

Subscribe to receive free email updates: