Skip to main content

Membuat session Login dan Logout Sistem menggunakan Java web JSP


Membuat Session Login/Logout Sistem Java web ( JSP )

Sore-sore daripada bengong mending buat tutorial yang bermanfaat, aamiin... mudah-mudahan yah.. BIsmillah... yuk mulai dibahas..
Dalam pembuatan sistem/aplikasi pasti ada hak akses yang biasa di sebut Login sistem agar data yang diinputkan aman dan tidak bisa diambil atau dilihat sembarang user. Berikut langkah-langkah pembuatan Login sistemnya.
1. Buatlah database dengan nama latihan dan nama tabelnya admin, isi fieldnya :
- id = int (10) => primary key
- username = varchar (30)
- password = varchar (30)

2. Buat 3 Source Packages dengan cara klik kanan pada Source Packages project nya – pilih New – pilih Java Package.


setelah muncul form berikan nama masing-masing Source Package nya dengan nama masing-masing sess.ion.bean, sess.ion.dao, sess.ion.test dan sess.ion.util.


3. Pada sess.ion.bean buat sebuah Servlet/class dengan cara klik kanan pada sess.ion.bean – pilih New – pilih Servlet dan setelah muncul form berikan class name nya dengan User kemudian klik Finish. Lakukan dengan langkah yang sama pada sess.ion.dao dengan class name servlet UserDao, sess.ion.test dengan class name servlet Main dan sess.ion.util dengan class name servlet ConMain. Sehingga tampilan tab Project Source Package nya seperti berikut :


4. Kemudian kembali ke file Servlet User.java dan ubah/ketikkan source code nya seperti berikut :
package sess.ion.bean;
public class User {
private int id;
private String username;
private String password;
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
}

5. Kembali ke file Servlet ConMain.java dan ubah juga sorce codenya dengan code berikut :
package sess.ion.util;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.SQLException;
public class ConMan {
private Connection conn;
private String url = "jdbc:mysql://localhost:3306/sik";
private String user = "root";
private String password = "";
public ConMan(String url, String user, String password) {
this.url = url;
this.user = user;
this.password = password;
}
public ConMan() {
}
public void logOff() {
try {
if (conn != null) {
conn.close();
System.out.println("Connection Closed");
}
} catch (SQLException e) {
System.out.println("Connection Error : " + e.getMessage());
}
}
public static void main(String args[]){
ConMan cm = new ConMan();
cm.logOn();
}
public Connection logOn() {
conn = null;

try {
DriverManager.registerDriver(new com.mysql.jdbc.Driver());
conn = DriverManager.getConnection(url, user, password);
System.out.println("Connected Successded");
} catch (SQLException e) {
System.out.println("Connection Error : " + e.getMessage());
}
return conn;
}
}

6. Kembali ke file Servlet UserDao.java dan ubah juga sorce codenya dengan code berikut :
package sess.ion.dao;
import java.sql.*;
import sess.ion.util.*;
import sess.ion.bean.*;
public class UserDao {
private ConMan conn = new ConMan();
public String cek(User user) {
String Hasil = "0";
Connection conDB = null;
try {
conDB = conn.logOn();
String query = "SELECT * from admin where username=? and password=?";
PreparedStatement st = conDB.prepareStatement(query);
st.setString(1, user.getUsername());
st.setString(2, user.getPassword());
try {
ResultSet rs = st.executeQuery();
if (rs.next()) {
Hasil = "1";
}
} catch (SQLException e) {
System.out.println("Error " + e.getMessage());
Hasil = "0";
}
} catch (SQLException e) {
System.out.println("Error" + e.getMessage());
Hasil = "0";
}
return Hasil;
}
}

7. Kembali ke file Servlet Main.java dan ubah juga sorce codenya dengan code berikut :
package sess.ion.test;
import sess.ion.bean.User;
import sess.ion.dao.UserDao;
public class Main {
public static void main(String args[]) {
UserDao sd = new UserDao();
User s = new User();
String user = "admin";
String password = "admin";
s.setUsername(user);
s.setPassword(password);
System.out.println(sd.cek(s));
}
}

8. Kembali ke file Servlet ConMain.java dan ubah juga sorce codenya dengan code berikut :
package sess.ion.util;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.SQLException;
public class ConMan {
private Connection conn;
private String url = "jdbc:mysql://localhost:3306/latihan";
private String user = "root";
private String password = "";
public ConMan(String url, String user, String password) {
this.url = url;
this.user = user;
this.password = password;
}
public ConMan() {
}
public void logOff() {
try {
if (conn != null) {
conn.close();
System.out.println("Connection Closed");
}
} catch (SQLException e) {
System.out.println("Connection Error : " + e.getMessage());
}
}
public static void main(String args[]){
ConMan cm = new ConMan();
cm.logOn();
}
public Connection logOn() {
conn = null;
try {
DriverManager.registerDriver(new com.mysql.jdbc.Driver());
conn = DriverManager.getConnection(url, user, password);
System.out.println("Connected Successded");
} catch (SQLException e) {
System.out.println("Connection Error : " + e.getMessage());
}
return conn;
}
}

9. Pada index.jsp ketikkan source code program berikut sebagai coding pembuatan tampilan untuk Login User.
<html>
<head>
<style>
a{
font: bold 13px Verdana;
padding: 2px;
padding-left: 4px;
display: block;
width: 100px;
color: black;
text-decoration: underline;
}
a:hover{
color: black;
text-decoration: none;
}
</style>
<script type="text/javascript" >
function validate()
{
if(document.frm.username.value=="")
{
alert("Please enter username");
document.frm.username.focus();
return false;
}
if(document.frm.password.value=="")
{
alert("Please enter username");
document.frm.password.focus();
return false;
}
return true;
}
function trim(stringToTrim) {
return stringToTrim.replace(/^\s+|\s+$/g,"");
}
</script>
<meta http-equiv="Content-Type" content="text/html;
charset=UTF-8">
<title>Login</title>
</head>
<body>
<div id="wrap">
<%
String errmsg = "";
if (request.getParameter("errmsg") != null
&& request.getParameter("errmsg") != "") {
errmsg = "Invalid username and password";
}else{
errmsg=" ";
}
%>
<form name="frm" onSubmit="return validate();"
action="checkLogin.jsp" method="post">
<table border="0" width="400px" align="center"
bgcolor="#1e90ff">
<tr><td colspan=2 align="center"
style="color:red;"><%=errmsg%></td></tr>
<tr><td colspan=2
align="center"> </td></tr>
<tr><td colspan=2 align="center"><b>User
Login</b></td></tr><br>
<tr><td>Username : </td><td><input
type="text" name="txtUsername" id="username"></td></tr>
<tr><td>Password : </td><td><input
type="password" name="txtPassword"
id="password"></td></tr>
<tr><td colspan=2 align="center">
<!--
<tr><td colspan=2 align="center"><input type="button"
name="submit" value="Submit"
onclick="login();"></td></tr>
<a href="user_register.jsp">New User</a>-->
<br><input type="submit" name="sSubmit"
value="Login" /><br>
</td><br/></tr><br>
</table>
</form>
</div>
</body>
</html>

10. Buat file checkLogin.jsp dan ketikkan source code program berikut sebagai coding untuk pengecekkan login apakah sesuai dengan data admin yang sudah diinputkan atau tidak.
<%@page import="sess.ion.dao.UserDao"%>
<%@page import="sess.ion.bean.User"%>
<%
UserDao sd = new UserDao();
User s = new User();
String user = request.getParameter("txtUsername");
String password = request.getParameter("txtPassword");
s.setUsername(user);
s.setPassword(password);
String hasil = sd.cek(s);
if (hasil == "1") {
out.println(hasil);
String sUserName = s.getUsername() + s.getPassword();
out.println("Berhasil : " + sUserName);
session.setAttribute("username", s.getUsername());
response.sendRedirect("success.jsp");
} else {
//out.println(hasil);
//String sUserName = s.getUsername() + s.getPassword();
//out.println("Gagal : " + sUserName);
response.sendRedirect("index.jsp?errmsg=error");
}
%>

11. Buat file logout.jsp dan ketikkan source code program berikut :
<%
session.removeAttribute("username");
session.invalidate();
response.sendRedirect("index.jsp");
%>
12. Buat file success.jsp dan ketikkan source code program berikut :
<%@ page contentType="text/html; charset=iso-8859-1" language="java"%>
<html>
<head>
<title>Login JSP</title>
</head>
<body>
Berhasil Login menggunakan bahasa pemrograman java JSP<br />
<%
if (session.getAttribute("username")!= null){
out.print("UserName :" + session.getAttribute("username") + "<br>");
%>
<a href= "logout.jsp"><b>Logout</b></a>
<%
}else {
response.sendRedirect("index.jsp");
}
%>
<br/>
</body>
</html>

13. Jangan lupa Add Library Driver MySQL nya.

14. Coba jalankan programnya, jika sukses dan tidak error maka ketika pertama kali program yang dijalankan tampilannya seperti gambar berikut :

setelah sukses login akan masuk ke Beranda dengan tampilan berikut :

jika login gagal, tampilannya akan kembali ke tampilan login dengan peringatan gagal login :

dan jika melakukan logout, maka tampilan akan kembali ke tampilan login user.

Mau source codenya ?? Download SC ajah hehee
Mau tutorial e-Book nya?? Download e-Book juga deh.. hehee

Thanks to Referensi (no copas Loh..) >> http://www.maribelajar.web.id/2013/10/membuat-session-login-dengan-jsp.html


Comments

  1. Replies
    1. ehh dek fandy, mksh kunjungannya.. keren juga tuh ilmuminati.com (y)

      Delete
  2. izin dipelajari ilmu nya kk :D

    ReplyDelete
  3. Mau nanya nih, itu tabel admin field id nya itu buat apa ya?

    ReplyDelete
    Replies
    1. sebagai PK aja.. kalau username udah mewakili sebagai PK tidak perlu dg ID gak apa2

      Delete
  4. This comment has been removed by the author.

    ReplyDelete
  5. ka cara nambah login user na gimana?

    ReplyDelete
  6. sis, this is exactly work! tapi username sama passwordnya apaan ya? soalnya di atas kaga di jelaskan. thnks

    ReplyDelete
  7. Replies
    1. weyy.. belum ada.. mudah2an nanti bisa ya

      Delete

Post a Comment

Popular posts from this blog

Source Code Program Sistem Informasi Rekam Medis Pada KLinik Rawat Jalan Berbasis Java Web (JSP, Servlet, JSTL)

Bismillah... Mencoba lagi meskipun masih sederhana.. Source code program ini menggunakan Netbeans 7.2 berbasis java web (JSP, JSTL, Servlet) dan menggunakan perintah SQL inner join untuk mempermudah User dalam menggunakan sistem/aplikasi ini. Bisa melakukan simpan, edit, hapus dan pencarian data. Design web nya menggunakan bahasa HTML dan CSS. Berikut hasil screen shoot tampilan program setelah di Run di Google Chrome : 1. Tampilan Home/Beranda ketika pertama kali di Run. 2. Tentang Program (Tampilan yang muncul ketika klik Menu About.) 3. Input Data Obat (tampilan ketika menu Obat di klik) 4. Input Data Dokter (tampilan ketika menu Dokter di klik) 5. Input Data Petugas (tampilan ketika menu Petugas di klik) 6. Input Data Pasien (tampilan ketika menu Pasien di klik) 7. Input Data Tarif Tindakan (tampilan ketika menu Tarif Tindakan di klik) 8. Input Data Pemberian Obat (tampilan ketika menu Pemberian Obat di klik)     Berrelasi dengan tabel Obat...

Tutorial atau Cara Menambahkan Palette yang Belum Tersedia di Netbeans

Ini juga gak kalah mudahnya, tapi semoga bermanfaat karena berbagi itu gak ada yang sia-sia. (yang di praktekkan menambahkan palette jDateTimePicker. Berikut langkah-langkahnya : 1.      Pada menu bar Tools pilih Palette > pilih Swing/AWT Components. 2.        Setelah muncul tampilan seperti dibawah klik Add From Jar. 3.        Cari file Calendar.jar yang sudah anda download/simpan, jika belum punya silahkan temen2 download dulu di >> Download Kemudian klik Next. 4.        Pilih Available Components JDateTimePicker, Kemudian klik Next. 5.        Pilih palette categories tempat untuk menyimpan hasil penambahan palette jDateTimePicker nya, disini saya pilih Swing Controls Klik Finish. Form yang masih terbuka close saja.  6.        Cek di palette Swing Contr...

source code program pembuatan sistem informasi posyandu menggunakan netbeans IDE 7.2 berbasis java web

Source code program ini menggunakan Netbeans 7.2 berbasis java web (JSP, JSTL, Servlet) dan menggunakan perintah SQL inner join untuk mempermudah User dalam menggunakan sistem/aplikasi ini. Bisa melakukan simpan, edit, hapus dan pencarian data, dan juga ada fasilitas Presensi Petugas. Berikut hasil screen shoot tampilan program : 1. Menu Utama 2. Menu input data Berat Badan Bayi Timbang 3. Menu input data Petugas 4. Menu input data Posyandu (inner join dengan tabel data Kelurahan) 5. Menu input data Puskesmas (inner join dengan tabel data Kecamatan) 6. Menu input data Kelurahan (inner join dengan tabel data Puskesmas) 7. Menu input data Kecamatan 8. Menu input data Ibu (inner join dengan tabel data Posyandu) 9. Menu input data Anak (inner join dengan tabel data Ibu) 10. Menu input data Ibu Hamil (inner join dengan tabel data Ibu) 11. Menu input data Layanan Anak ( inner join dengan tabel data Anak) 12. Menu Presensi Petugas (inner join d...