SMART LOGIN PADASITUSWEB MENGGUNAKANQR-CODE. Masdito Bachtiar Pembimbing 1 : Ary Mazharuddin S., S.Kom., M.Comp.Sc

Transkripsi

1 SMART LOGIN PADASITUSWEB MENGGUNAKANQR-CODE Masdito Bachtiar Pembimbing 1 : Ary Mazharuddin S., S.Kom., M.Comp.Sc

2 PENDAHULUAN

3 INTERNET SEBAGAI KEBUTUHAN HIDUP Social Networks Blogs Forums

4 LOGIN MEMBUTUHKAN BANYAK WAKTU BANYAK ACCOUNT LUPA USERNAME DAN PASSWORD

5 SOLUSI Cepat Rapi Mudah?

6 SMART LOGIN PADA SITUS WEB MENGGUNAKAN QR-CODE

7 MENGAPA? MAMPU MENGENCODE BANYAK KARAKTER KEMAMPUAN ERROR CORRECTION DESAIN MENARIK

8 MENGAPA? LIBRARY BARCODE GENERATOR DAN QR-CODE READER JAVA MEDIA FRAMEWORK

9 Batasan Masalah Aplikasi smart login yang dibangun berbasis desktop. Bahasa pemrograman yang digunakan adalah Java, maka program bisa berjalan jika perangkat yang digunakan memiliki Java Runtime Environment (JRE). Aplikasi membutuhkan Java Media Framework (JMF) yang terinstal untuk bisa tersambung dengan kamera. Aplikasi membutuhkan XAMPP sebagai server Apache dan MySQL lokal untuk menjalankan halaman PHP redirect. Program hanya bisa mengenali QR-code yang dibuat oleh program tersebut, karena QR-code berfungsi sebagai sarana untuk menyimpan indeks database saja. Program dapat melakukan multiple login ke beberapa situs web sekaligus menggunakan 1 QR-code.

10 Tujuan Merancang suatu sistem smart login untuk memanajemen informasi login, sekaligus melakukan login ke situs web. Menginplementasikan penggunaan QR-code sebagai media smart login. Merancang suatu sistem yg dapat melakukan penginjeksian data login dari aplikasi java ke web browser.

11 PERANCANGAN DAN IMPLEMENTASI

12 - Simpan Data Profil - Simpan Data Login - Kirimkan Data Login ke Halaman PHP Redirect - Scan QR-code - Redirrect - Tampilkan dan Baca List Profil dan Data Login PENGGUNA APLIKASI DATABASE WEB SERVER BROWSER

13 Mendaftarkan profil dan QR-code <include> Mengisi data login <include> Menghapus data login Melakukan smart login dengan QR-code PENGGUNA

14 Mendaftarkan profil dan QR-code

15 Mendaftarkan profil dan QR-code Pseudocode mendaftarkan profil () { Buka file "user_list.txt"; Boolean valid = true; if(textbox nama profil kosong){ Tampilkan pesan "Please enter the user name!"; valid = false; } else{ Periksa isi file "user_list.txt" if(ditemukan nama yang sama dengan nama profil) { Tampilkan pesan "Name is already taken!"; valid = false; break; } if(valid bernilai true){ Tulis ("~~"+nama profil yang didaftarkan) pada file; Buat QR code dengan isi nama profil; Tampilkan pesan ("A new user '" + nama profil + "' has been added."); } }

16 Mendaftarkan profil dan QR-code Pseudocode hapus profil () { Buka dan baca file "user_list.txt"; if(bukan nama profil yang dihapus){ Simpan nama profil; } else{ Hapus file database dan QR-code milik profil; Tampilkan pesan ("User '" + nama profil yang dihapus + "' has been deleted."); } Tulis kembali nama profil yang disimpan ke "user_list.txt"; }

17 Mengisi data login

18 Mengisi data login Pseudocode mengisi data login () { Buka file database milik profil; if(textbox url & username & password tidak kosong) { Simpan data login yang di-input-kan ke file database milik profil; } else { Tampilkan pesan ("Can't add data. Fill all the required informations!"); } }

19 Menghapus data login

20 Menghapus data login Pseudocode menghapus data login () { Hapus file database milik profil; Buat file baru dengan nama profil; Tampilkan pesan ("All login data of user '" + nama profil + "' have been cleared." ); } }

21 Melakukan smart login dengan QR-code User Sistem Memindai gambar QR-code Menyimpan gambar QR-code ke dalam file Decode QR-code Mencari file txt database sesuai nama di dalam QR-code Membaca isi file txt per baris Memecah - mecah string teks menjadi informasi login Mengirimkan informasi login ke halaman php dummy Melakukan login ke situs web melalui halaman php dummy Redirrect ke halaman situs web tujuan [else] [seluruh isi file txt telah terbaca]

22 Melakukan smart login dengan QR-code Pseudocode smart login () { capture image (); read QRcode(); login(); } Pseudocode capture image() { Tangkap salah satu frame gambar kamera, simpan di buffer; Buat file image dengan nama "capture.jpg" dari frame yang disimpan di buffer; } Pseudocode membaca QR-code() { Buka file "capture.jpg"; Panggil fungsi decoder dari library "QR code"; if (file berhasil di-decode){ Tampilkan pesan ("[Success]"); Kembalikan pesan hasil pembacaan QR-code; } else { Tampilkan pesan("[failure] "); } }

23 Melakukan smart login dengan QR-code Pseudocode login() { Buka file database profil, baca data login; Baca halaman web yang didapat dari data login; Tangkap lokasi field untuk meng-input-kan username dan password, serta tombol submit; Buka halaman php redirect untuk menginjeksikan username, password dan mengirim perintah submit; }

24 UJI COBA

25 PLAY ALL VIDEO!!!

26

27

28

29

30

31

32

33 PENUTUP

34 Kesimpulan Aplikasi Smart Login pada Situs Web menggunakan QR-code telah berhasil mengimplementasikan sistem smart login. Aplikasi dapat meng-generate dan men-decode QR-code dengan bantuan dua buah library, yaitu java barcode generator dan java QR-code. Aplikasi dapat mengirimkan data ke situs web yang bersangkutan untuk login dengan menggunakan halaman php sebagai redirect untuk menginjeksikan script login. Smart login tidak berhasil di seluruh situs web yang dijadikan sasaran eksperimen, dikarenakan terdapat proteksi proteksi yang dipasang di situs web tersebut.

35 SARAN Pembuatan versi mobile dari aplikasi ini, agar dapat diakses dengan lebih mudah melalui ponsel. Pengembangan script agar dapat menembus proteksi situs web. Pembenahan tampilan antarmuka agar tampilan aplikasi lebih menarik dan easy to use.

36 TERIMA KASIH [End of Slide]