Pertemuan 13 PWEB - Menambah Fitur Upload Image

Nama : Kadek Fajar Pramartha Yasodana
NRP : 5025231185
Kelas : PWEB E

Menambah Fitur Upload Image
Pada tugas kali ini untuk menambahkan fitur upload image saya tinggal menambahkan input type file. Pada backend nantinya akan dilakukan validasi untuk memastikan format file sudah benar, dan jika benar maka akan dilakukan insert ke database dengan column image tipe blob.

Source Code : GitHub

Migrasi Tabel Menambahkan blob
    CREATE TABLE calon_siswa (
        id INT NOT NULL AUTO_INCREMENT,  
        nama VARCHAR(255) NOT NULL,  
        alamat VARCHAR(255) NOT NULL,  
        jenis_kelamin VARCHAR(16) NOT NULL,  
        agama VARCHAR(16) NOT NULL,  
        sekolah_asal VARCHAR(64) NOT NULL,
        image MEDIUMBLOB NOT NULL,
        image_type VARCHAR(100) NOT NULL,
        pegawai_pendaftar_id INT NOT NULL,
        FOREIGN KEY(pegawai_pendaftar_id) REFERENCES pegawai(id),
        PRIMARY KEY (id)
    );

Penambahan pada form
<label for="image" class="font-bold">Pas Foto</label><br>
<input class="w-full p-2 mb-2 border border-solid rounded-md" type="file" name="image" required>

proses-pendaftaran.php
<?php
include("config.php");

if($_SERVER["REQUEST_METHOD"] == "POST")
{
    $nama = htmlspecialchars(trim($_POST["nama"]));
    $jenis_kelamin = htmlspecialchars(trim($_POST["jenis_kelamin"]));
    $agama = htmlspecialchars(trim($_POST["agama"]));
    $alamat = htmlspecialchars(trim($_POST["alamat"]));
    $sekolah_asal = htmlspecialchars(trim($_POST["sekolah_asal"]));
    $pendaftar_id = htmlspecialchars(trim($_POST["petugas_id"]));

    if(!isset($_FILES["image"]))
    {
        header("Location: index.php?status=invalid");
    }
    $image = mysqli_real_escape_string($db, file_get_contents($_FILES["image"]["tmp_name"]));
    $image_type = $_FILES["image"]["type"];

    if(empty($nama) || empty($jenis_kelamin) || empty($agama) || empty($alamat) || empty($sekolah_asal) || empty($pendaftar_id) || empty($image) || empty($image_type) || ($image_type != 'image/png' && $image_type != 'image/jpg' && $image_type != 'image/jpeg'))
    {
        header("Location: index.php?status=invalid");
    }
    else
    {
        $sql = "INSERT INTO calon_siswa (nama, alamat, jenis_kelamin, agama, sekolah_asal, pegawai_pendaftar_id, image, image_type) VALUE ('$nama', '$alamat', '$jenis_kelamin', '$agama', '$sekolah_asal', '$pendaftar_id', '$image', '$image_type');";
        $query = mysqli_query($db, $sql);

        if($query)
        {
            header("Location: index.php?status=success");
        }
        else
        {
            header("Location: index.php?status=fail");
        }
    }
}
else
{
    die("Forbidden!");
}
?>
mengambil image dalam bentuk binary dengan file_get_contents($_FILES["image"]["tmp_name"]).

update-pendaftaran.php
<?php
include("config.php");

if($_SERVER["REQUEST_METHOD"] == "POST")
{
    $id = htmlspecialchars(trim($_POST["id"]));
    $nama = htmlspecialchars(trim($_POST["nama"]));
    $jenis_kelamin = htmlspecialchars(trim($_POST["jenis_kelamin"]));
    $agama = htmlspecialchars(trim($_POST["agama"]));
    $alamat = htmlspecialchars(trim($_POST["alamat"]));
    $sekolah_asal = htmlspecialchars(trim($_POST["sekolah_asal"]));
    $petugas_id = htmlspecialchars(trim($_POST["petugas_id"]));

    if(!isset($_FILES["image"]))
    {
        header("Location: index.php?status=invalid");
    }
    $image = mysqli_real_escape_string($db, file_get_contents($_FILES["image"]["tmp_name"]));
    $image_type = $_FILES["image"]["type"];

    if(empty($nama) || empty($jenis_kelamin) || empty($agama) || empty($alamat) || empty($sekolah_asal) || empty($petugas_id)  || empty($image) || empty($image_type) || ($image_type != 'image/png' && $image_type != 'image/jpg' && $image_type != 'image/jpeg'))
    {
        header("Location: index.php?update=invalid");
    }
    else
    {
        $sql = "UPDATE calon_siswa SET nama='$nama', jenis_kelamin='$jenis_kelamin', agama='$agama', alamat='$alamat', sekolah_asal='$sekolah_asal', pegawai_pendaftar_id='$petugas_id', image='$image', image_type='$image_type' WHERE id=$id;";
        $query = mysqli_query($db, $sql);

        if($query)
        {
            header("Location: list-siswa.php?update=success");
        }
        else
        {
            header("Location: list-siswa.php?update=fail");
        }
    }
}
else
{
    die("Forbidden!");
}
?>
mengambil image dalam bentuk binary dengan file_get_contents($_FILES["image"]["tmp_name"]).

image-siswa.php
<?php
include("config.php");

$uri = parse_url($_SERVER['REQUEST_URI']);
if(!isset($uri['query']))
{
    http_response_code(404);
    return;
}

$queries = [];
parse_str($uri['query'], $queries);
if(!isset($queries['id']))
{
    http_response_code(404);
}

$id = $queries['id'];

$sql = "SELECT image, image_type from calon_siswa WHERE id=$id";
$query = mysqli_query($db, $sql);

if($query)
{
    $data = mysqli_fetch_all($query);
    http_response_code(200);
    header("Content-Type: ".$data[0][1]);
    echo $data[0][0];
}
else
{
    http_response_code(500);
}
?>
File ini nantinya akan digunakan untuk memfetching image dari database.

Hasil









Comments

Post a Comment

Popular posts from this blog

Pertemuan 6 KPPL - Implementasi Web ChatBot Tech Support System, Web & Prototipe & Metodologi

Image
Nama : Kadek Fajar Pramartha Yasodana NRP : 5025231185 Kelompok : 7 Nama Kelompok : - I Gusti Ngurah Arya Sudewa (5025231030) - Randi Palguna Artayasa (5025231020) - Kadek Fajar Pramartha Yasodana (5025231185) Kelas : KPPL E Mengimplementasikan Applikasi Nama Aplikasi : HelpThink Internet Chat Bot Support System Link Hosting :  Vercel Source Code :  GitHub Metode : Waterfall Setelah kita menguraikan hasil studi kasus pada Paper tugas sebelumnya, kita juga sudah menguraikan tahapan tahapan yang akan kita lakukan untuk membuat aplikasi support system berdasarkan ilmu yang telah didapatkan. Seperti tugas sebelumnya aplikasi yang kita buat bernama HelpThink . HelpThink merupakan aplikasi web chatbot technical support system, yang bisa digunakan oleh pengguna untuk bertanya mengenai permasalahannya terhadap suatu jaringan internet. Applikasi ini menggunakan metode waterfall. Selain itu tahapan-tahapan pembuatan applikasi antara lain: Requirement tahapan Requirement pada aplikasi He...
Read more

Pertemuan 13 OOP - Abstraksi & Simulasi Fox & Rabit

Image
Nama : Kadek Fajar Pramartha Yasodana NRP : 5025231185 Kelas : PBO A Abstraksi & Simulasi Fox & Rabit 1. Tuliskan implementasi dari program kecil Abstract Class Makhluk hidup yang diwariskan kepada manusia, hewan, dan tumbuhan Source Code :  GitHub Pada soal nomor ini, kita hanya perlu membuat sebuah abstract class makhluk hidup dengan beberapa metode abstrak juga. Setelah itu kita inherit classnya menjadi beberapa subclass Manusia, Hewan, dan Tumbuhan. Terdapat beberapa class seperti MakhlukHidup.java public abstract class MakhlukHidup { protected String name ; public MakhlukHidup (String name) { this . name = name ; } public abstract void doSomething () ; public abstract void grow () ; public abstract void breathe () ; } Class ini merupakan class yang sebagai template sebuah class makhluk hidup. dengan beberapa method yang harus di override oleh subclassnya yaitu doSomething, grow, dan breathe Manusia.java public class Manusia extends M...
Read more

Pertemuan 7 KPPL - Studi Kasus Pembuatan Aplikasi dengan Agile

Image
Nama : Kadek Fajar Pramartha Yasodana NRP : 5025231185 Kelompok :7 Nama Kelompok : - Randi Palguna Artayasa (5025231020) - I Gusti Ngurah Arya Sudewa (5025231030) - Kadek Fajar Pramartha Yasodana (5025231185) Kelas : KPPL E   Studi Kasus Pembuatan Aplikasi dengan menggunakan Metode Agile Develepment Judul Paper :  Design and Development of a Web-Based Complaints Management System at Syiah Kuala University Integrated Laboratory Sumber Paper :  International Journal Software Engineering and Computer Science (IJSECS) Pendahuluan Sistem Manajemen Pengaduan Berbasis Web di Universitas Syiah Kuala (USK) dibuat untuk mempercepat proses penanganan komplain di Unit Laboratorium Teknis Terpadu (ILTMU) yang sebelumnya dilakukan secara manual. Proses manual ini dinilai tidak efisien karena memerlukan waktu dan tenaga lebih dari staf untuk menangani keluhan yang masuk. Sistem ini bertujuan untuk meningkatkan kualitas layanan dan kinerja ILTMU dengan ...
Read more