MODUL 5 GET & POST Pemograman Web Teknik Informatika Universitas Pasundan Bandung 2016/2017

Ukuran: px

Mulai penontonan dengan halaman:

Download "MODUL 5 GET & POST Pemograman Web Teknik Informatika Universitas Pasundan Bandung 2016/2017"

Hadi Agusalim
7 tahun lalu
Tontonan:

1 MODUL 5 GET & POST Pemograman Web Teknik Informatika Universitas Pasundan Bandung 2016/2017

2 Konten Post dan Get Request... 2 Isset dan Empty... 5 Sanitasi input... 6 Latihan... 7 Teknik Informatika Universitas Pasundan Bandung 1

3 Post dan Get Request PEMBUKAAN Pada modul sebelumnya, kita telah mengenal proses assignment. Kita dapat mengassign suatu nilai kepada suatu variabel. Proses assignment yang telah kita pelajari adalah dengan cara memberikan perintah seperti dibawah ini. images 1 script assignment Nah sekarang kita coba kembangkan sedikit. Pada script di atas kita hanya bisa menjumlahkan bilangan 2 dan 6. Kalaupun kita ingin menjumlahkan bilangan yang lain, maka kita harus mengedit scriptnya dan mengubah kedua bilangan. Bagaimana kalau kita kembangkan script di atas supaya bisa menjumlahkan bilangan- bilangan lain tanpa mengubah scriptnya supaya lebih interaktif. Untuk bisa melakukan hal di atas, Kita terlebih dahulu harus telah memahami POST dan GET Request. Teknik Informatika Universitas Pasundan Bandung 2

POST REQUEST POST request adalah proses mengirim data (submit) melalui form Karena PHP adalah bahasa program atau scripting, maka PHP bisa digunakan untuk menerima data hasil submit tersebut.

4 POST REQUEST POST request adalah proses mengirim data (submit) melalui form Karena PHP adalah bahasa program atau scripting, maka PHP bisa digunakan untuk menerima data hasil submit tersebut. Data yang diterima nantinya bisa diproses dalam script PHP. Untuk menerima/menangkap data dari proses submit form dalam PHP, kita gunakan statement assignment berikut ini. Dalam hal ini, nama variabel boleh sama atau tidak sama dengan nama komponen dalam form. Namun sangat disarankan, Kalian membuat nama variabel yang berbeda dari nama komponen formnya untuk lebih membedakan mana variabel mana nama nama komponen dari form. Dalam contoh ini, kita coba membuat form HTML yang di dalamnya terdapat satu buah input elemen lalu valuenya ditangkap di selamat_datang.php images 2 form nama anda(index.php) images 3 selamat datang Teknik Informatika Universitas Pasundan Bandung 3

5 GET REQUEST Apabila POST request adalah proses merequest data melalui form, maka GET request adalah melalui URL Terkadang ketika browsing di internet, kita temukan URL atau link yang berbentuk misalnya seperti berikut ini. Perhatikan bagian URL yang saya kasih bold tersebut. Bagian tersebut dinamakan parameter. Konsep GET Request pada prinsipnya mirip dengan POST. Pada contoh URL di atas maksudnya adalah mensubmit atau mengirim data ke script bernama proses.php. Apa yang dikirim? Yang dikirim adalah nilai a = 4 dan b = 6. Nilai yang dikirim tersebut nantinya akan dijadikan sebagai input pada proses yang terjadi di proses.php. Selanjutnya bagaimana membaca/menangkap input dari GET request tersebut? Caranya adalah menggunakan CONTOH PENGGUNAAN GET images 4 Temanku.php images 5 ucapkan_salam.php Teknik Informatika Universitas Pasundan Bandung 4

6 Isset dan Empty Isset() dan empty() merupakan default function PHP yang memiliki fungsi berbeda, apakah kegunaan dari kedua fungsi tersebut? ISSET isset akan menentukan apakah suatu variabel telah didefinisikan dan variabel tersebut isinya bukan NULL? EMPTY Fungsi empty berguna untuk mengetahui apakah variabel yang dituju kosong atau berisi Expressi empty() isset() $x = ""; TRUE TRUE $x = null; TRUE FALSE var $x; TRUE FALSE $x is undefined TRUE FALSE $x = array(); TRUE TRUE Teknik Informatika Universitas Pasundan Bandung 5

7 Sanitasi input 8 April 2017 Modul 5 GET & POST Setelah mempelajari post, get dan action pada form selanjutnya adalah melakukan sanitas terhadap input. Proses sanitasi berfungsi untuk mengamankan website yang kita buat dari hack seperti html injection. Pernahkan kalian melakukan keisengan memasukan tag- tag html pada inputan sebuah website, kita lihat contoh dibawah ini. saya masih menggunakan index.php dan selamat_datang.php yang sudah dibahas dibagian sebelumnya, mari kita coba lakukan inputan dengan memasukan tag html. Kira- kira apa yang terjadi? Maka pada saat saya klik tombol kirim, akan keluar hasilnya seperti ini. Tapi, pada kenyataanya user tidak akan selalu menginputkan nama dengan benar, bagaimana kalo saya menginputkan <h1>ichabod</h1> Seperti apakah hasilnya? Silahkan anda coba sendiri. Jika sudah, bagaimanakah kita mengatasi itu? Gunakan fungsi htmlspecialchars() Penggunaan fungsi htmlspecialchars() untuk mengubah karakter- karakter khusus html seperti < menjadi < dan > menjadi > Teknik Informatika Universitas Pasundan Bandung 6

8 Latihan - Buat folder dengan nama NRP kalian masing- masing di dalam folder htdocs XAMPP kalian, lalu di dalamnya buat folder modul5 untuk menyimpan latihan- latihan dibawah ini. - Jangan lupa untuk menjalankan server apache di XAMPP kalian. latihan1.php - Buatlah sebuah aplikasi yang dapat menampilkan rangkaian angka terurut, seperti contoh dibawah ini : - Jumlah baris dan jumlah angka pada baris pertama diambil dari variabel angka yang dikirim melalui URL, lihat contoh dibawah ini (gunakan variabel global $_GET untuk menangkap nilainya): Teknik Informatika Universitas Pasundan Bandung 7

- Tangani apabila tidak ada variabel angka yang dikirimkan pada URL.

org/modul5/latihan1/index.php?angka=15 Latihan2.php - Modifikasi Tugas4.

mengubah array), lihat contoh di bawah ini: - Buat agar nama (atau data apapun yang kalian pilih)

9 - Tangani apabila tidak ada variabel angka yang dikirimkan pada URL. (gunakan fungsi isset()) - Contoh hasilnya dapat dilihat di unpas.org/modul5/latihan1/index.php?angka=15 Latihan2.php - Modifikasi Tugas4.php ( yang dikerjakan di pertemuan sebelumnya), agar data yang ditampilkan hanya 3 saja (tanpa mengubah array), lihat contoh di bawah ini: - Buat agar nama (atau data apapun yang kalian pilih) menjadi sebuah link yang terhubung ke file latihan3.php dengan mengirimkan seluruh data pada array pada URLnya, lihat contoh dibawah ini: Teknik Informatika Universitas Pasundan Bandung 8

- Buat agar nama (atau data apapun yang kalian pilih) menjadi sebuah link yang terhubung ke file - Contoh hasilnya dapat dilihat di http://pw2.

php - Halaman ini menampilkan seluruh data yang ada pada array dari halaman sebelumnya - Tambahkan link untuk kembali ke halaman latihan3.

10 - Buat agar nama (atau data apapun yang kalian pilih) menjadi sebuah link yang terhubung ke file - Contoh hasilnya dapat dilihat di unpas.org/modul5/latihan3/ Latihan3.php - Buat sebuah halaman yang menampilkan detail dari data dipilih di latihan3.php - Halaman ini menampilkan seluruh data yang ada pada array dari halaman sebelumnya - Tambahkan link untuk kembali ke halaman latihan3.php - Lihat contoh hasilnya sebagai berikut: - Contoh hasilnya dapat dilihat di unpas.org/modul5/latihan3/ (klik salah satu nama pada datanya) Teknik Informatika Universitas Pasundan Bandung 9

11 Latihan4.php - Modifikasi latihan1.php agar jumlah angka dan baris yang ditampilkan diambil dari textfield dan angkanya diinputkan oleh user - Angkat tersebut diambil menggunakan metode post sehingga data tidak tampil di URL - Contoh hasilnya dapat dilihat di unpas.org/modul5/latihan5/ Teknik Informatika Universitas Pasundan Bandung 10

12 Tugas 5 Buatlah sebuah halaman login.php dimana halaman tersebut menerima inputan username dan password, jika data yang diinputkan benar maka halaman tersebut akan di-redirect ke halaman admin. Jika data yang dimasukan tidak benar maka ada pesan kesalahan yang muncul. Gambar 2. 1 Form login di login.php Gambar 2. 2 Tampilan halaman admin Gambar 2. 3 Muncul pesan kesalahan pada form login bila data yang diinputkan tidak cocok Selamat mengerjakan, Jangan malu bertanya kepada asisten bila ada materi yang kurang dipahami Teknik Informatika Universitas Pasundan Bandung 11

dokumen-dokumen yang mirip

MODUL GET DAN POST

MODUL GET DAN POST MODUL 5-2015 GET DAN POST Daftar Isi Post dan Get Request 1 Isset dan Empty 5 Latihan 7 Post dan Get Request PEMBUKAAN Pada modul sebelumnya, kita telah mengenal proses assignment. Kita dapat mengassign