upload ukuran 5gb xampp

Juli 31, 2024 By SNH NET , , 0 Comments


Untuk mengubah kode agar dapat mengunggah file hingga 5 GB menggunakan jQuery AJAX dan PHP, Anda perlu memastikan beberapa hal:

  1. Pengaturan di PHP:

    • Ubah pengaturan upload_max_filesize dan post_max_size di file php.ini agar mendukung ukuran file besar.
    • Pastikan max_execution_time cukup tinggi untuk menghindari timeout selama pengunggahan file besar.

  2. Kode JavaScript dan HTML:

    • Tidak perlu perubahan signifikan di JavaScript atau HTML kecuali Anda ingin menambahkan validasi ukuran file di sisi klien.

Berikut adalah langkah-langkah detailnya:

1. Ubah Pengaturan di PHP

Edit file php.ini dan tambahkan atau ubah baris berikut:

ini
upload_max_filesize = 5G
post_max_size = 5G
max_execution_time = 6000
max_input_time = 6000

Setelah mengubah php.ini, pastikan untuk me-restart server web Anda (misalnya, Apache atau Nginx) agar perubahan diterapkan.

2. Validasi Ukuran File di Sisi Klien (Opsional)

Anda dapat menambahkan validasi ukuran file di sisi klien untuk memastikan file tidak lebih besar dari 5 GB sebelum diunggah.

Kode Lengkap dengan Validasi Ukuran File

html
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>Upload File dengan Progress Bar menggunakan jQuery AJAX di PHP</title>
	<link href="style.css" rel="stylesheet">
	<link href="progress-bar.css" rel="stylesheet">
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>

<body id="top">

	<header id="header">
		<div class="content">
			<h1>Demo</h1>
			<p>Upload File dengan Progress Bar<br />
			menggunakan jQuery AJAX di PHP</p>
			<ul class="actions">
				<!-- Form upload file -->
				<form id="uploadForm" enctype="multipart/form-data">
					<input type="file" name="file" id="fileInput">
					<input type="submit" name="submit" value="UPLOAD"/>
				</form>
				
				<!-- Progress bar -->
				<div class="progress">
					<div class="progress-bar"></div>
				</div>
				
				<!-- Menampilkan status upload (sukses/gagal) -->
				<div id="uploadStatus"></div>
				
			</ul>
			<small><a href="http://codingan.com/upload-file-dengan-progress-bar-menggunakan-jquery-ajax-di-php">Tutorial</a></small><br><br>
		</div>
	</header>

</body>

<script>
$(document).ready(function(){
    // upload file via AJAX
    $("#uploadForm").on('submit', function(e){
        e.preventDefault();
        var file = $('#fileInput')[0].files[0];
        var maxSize = 5 * 1024 * 1024 * 1024; // 5 GB
        
        if(file.size > maxSize){
            alert('File terlalu besar. Ukuran maksimum adalah 5 GB.');
            return false;
        }
        
        $.ajax({
            xhr: function() {
                var xhr = new window.XMLHttpRequest();
                xhr.upload.addEventListener("progress", function(evt) {
                    if (evt.lengthComputable) {
                        var percentComplete = ((evt.loaded / evt.total) * 100);
                        $(".progress-bar").width(percentComplete + '%');
                        $(".progress-bar").html(percentComplete.toFixed(2) + '%');
                    }
                }, false);
                return xhr;
            },
            type: 'POST',
            url: 'upload.php',
            data: new FormData(this),
            contentType: false,
            cache: false,
            processData: false,
            beforeSend: function(){
                $(".progress-bar").width('0%');
                $('#uploadStatus').html('<img src="loading.gif"/>');
            },
            error: function(){
                $('#uploadStatus').html('<p style="color:#EA4335;">Upload file gagal, silakan coba lagi.</p>');
            },
            success: function(resp){
                if(resp == 'ok'){
                    $('#uploadForm')[0].reset();
                    $('#uploadStatus').html('<p style="color:#28A74B;">File berhasil diupload!</p>');
                }else if(resp == 'err'){
                    $('#uploadStatus').html('<p style="color:#EA4335;">Silakan pilih file yang valid untuk diupload.</p>');
                }
            }
        });
    });
	
    // memvalidasi file
    $("#fileInput").change(function(){
        var allowedTypes = [
            'application/pdf', 'application/msword', 'application/vnd.ms-office', 
            'application/vnd.openxmlformats-officedocument.wordprocessingml.document', 
            'image/jpeg', 'image/png', 'image/jpg', 'video/mp4', 'image/gif', 
            'application/x-iso9660-image', 'application/vnd.rar'
        ];
        
        var file = this.files[0];
        var fileType = file.type;
        if(!allowedTypes.includes(fileType)){
            alert('Silakan pilih file yang valid (PDF/DOC/DOCX/JPEG/JPG/PNG/GIF/ISO/RAR).');
            $("#fileInput").val('');
            return false;
        }
    });
});
</script>

</html>

upload.php Contoh Sederhana

Berikut adalah contoh sederhana untuk upload.php:

php
<?php
if(isset($_FILES['file']['name'])){
    /* Nama file */
    $filename = $_FILES['file']['name'];

    /* Lokasi penyimpanan */
    $location = 'uploads/' . $filename;

    /* Ekstensi file */
    $file_extension = pathinfo($location, PATHINFO_EXTENSION);
    $file_extension = strtolower($file_extension);

    /* Ekstensi file yang diizinkan */
    $valid_ext = array("pdf","doc","docx","jpeg","jpg","png","gif","iso","rar","mp4");

    /* Memeriksa apakah file valid */
    if(in_array($file_extension,$valid_ext)){

        /* Pindahkan file ke lokasi */
        if(move_uploaded_file($_FILES['file']['tmp_name'],$location)){
            echo "ok";
        }else{
            echo "err";
        }

    }else{
        echo "err";
    }
}
?>

Dengan pengaturan ini, Anda harus bisa mengunggah file hingga 5 GB menggunakan jQuery AJAX dan PHP. Pastikan bahwa server Anda memiliki cukup ruang penyimpanan dan bandwidth untuk menangani file sebesar itu.



About the Author

Written by Admin

ChromeGT is a modern, powerful and professional Blogger template made for your Portfolio, Business or almost any other kind of website.


0 Comments:

Langganan: Posting Komentar (Atom)