--Selamat Berkunjung. Jika Ingin Mendapatkan Update Artikel Dari KetikSpasi, Klik Button Follow Disebelah Kanan--

Masih Kosong

Sabtu, 29 Mei 2021

Script PHP Form upload file dari website ke google drive (Gdrive)

 Kemajuan cloud storage sudah tidak dapat dihindari lagi. Sekarang masih terbatasnya penyimpanan pada hosting dan masih mahalnya sewa hosting, sehingga perlu solusi untuk mensiasatinya supaya storage atau ruang penyimpanan hosting tidak membebani jasa sewa yang harus ditanggung oleh webmaster setiap tahunnya. Maka ada solusi storage atau penyimpanan yang mungkin unlimited bagi pemilik email institusi atau corporate yang dapat digunakan sebagai penyimpanan data yaitu melalui google drive (g-Drive).

Saya akan memaparkan cara membuat form upload file dari sebuah website atau blog, dimana file penyimpanannya pada google drive (g-drive).

Lagkah-langkahnya sebagai berikut:

Langkah awal. Silahkan anda masuk ke sini dengan menggunakan akun yang akan e-mail anda: https://script.google.com/.
1. Setelah masuk di https://script.google.com/, lalu buat lah sebuah Project Baru (1), seperti gambar berikut:




2. Buatlah script di Code.gs seperti point (2) dan (3) Pada gambar di atas.
Berikut script yang harus di tuliskan:


function doGet() {
  var html = HtmlService.createHtmlOutputFromFile('uploadfile');
  return html.setXFrameOptionMode(HtmlServices.XFrameOptionsMode.ALLOSWALL);
}
function uploadFiles(Data)
{
 var file = data.myFile;
 var folder = DriveApp.getFolderById('1gOmiE_PYtHT9iMyehuwusdHN4zryMdUT');
 var createFile = folder.createFile(file);
 return createFile.getUrl();
}

catatan : huruf yang berwarna merah ganti dengan ID-FOLDER di google drive yang akan anda jadikan tempat penyimpanan, misal:

              https://drive.google.com/drive/folders/1gOmiE_PYtHT9iMyehuwusdHN4zryMdUT?usp=sharing


3.  Buat lah sebuah file dengan nama : UploadFile.html
Caranya perhatikan gambar berikut:

Pada gambar di atas: 1. Buatlah file baru dengan mengklik tanda (+), kemudian pilih HTML (2) dan (3) ketik nama filenya (Disini saya contohkan UploadFile.html). (4) Ketikan script HTML yang nantinya akan jadi form penguploadan file. Berikut script yang harus ditulis pada UploadFile.html:


<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <title>Upload File RKD-BKD Dosen</title>
  </head>
  <body>
    <h1>Upload File</h1>
    <form>
        <input type="file" name="myFile" mulitple>
        <br>
        <br>
        <input type="button" id="submitBtn" value="Upload Files">
        <label id="resp"></label>
    </form>
    <script>
      document.getElementById('submitBtn').addEventListener('click',
        function(e){
          google.script.run.withSuccessHandler(onSuccess).uploadFiles(this.parentNode)
        })
        
        function onSuccess(data){
          document.getElementById('resp').innerHTML = "Copykan Ini : " +data;
        }
       
    </script>
  </body>
</html>


4. Langkah berikutnya  yaitu mempublisnya. Tapi jangan lupa untuk menyimpan (save) sebelum publish. Berikut cara Publish:




Ikuti langkah-langkah di atas berurutan sesuai gambar yang telah ditunjukan di atas. Dan jangan lupa setelah mengklik DEPLOY maka akan ditampilkan URL yang akan dijadikan link upload nya. Misal : https://script.google.com/a/macros/hagiaquantumsurya.ac.id/s/UYAfycbzPizeOBP2Hd0sHHGNjx1QvBbxldsdulXY3GIRINKIKrrVMaNIDJI/exec

Ciri link nya diakhir ada exec.

5. Supaya link tersebut dapat menampilan form upload file, maka harus ditambahkan pada iFrame pada website yang anda gunakan sebagai tempat form upload file. Berikut script iFrame-nya:

<iframe src="https://script.google.com/a/macros/hagiaquantumsurya.ac.id/s/UYAfycbzPizeOBP2Hd0sHHGNjx1QvBbxldsdulXY3GIRINKIKrrVMaNIDJI/exec" id="iframe" width="80%" height="250px">
</iframe>

catatan ; URL yang berwarna merah, ganti dengan URL yang anda dapatkan ketika mempublish UploadFile.html.

6. Berikut hasil penampakannya setelah dipasang di website dengan metode iFrame:





Sekian tutor dari saya mengenai cara membuat form upload file dari website kepada penyimpanan di google drive (gdrive)



Jika ada pertanyaan silahkan berkomentar !

Berikut script hasilnya jika dipasang di blog:
Mewakili Perguruan Tinggi/Lembaga

Upload Bukti SK atau Bukti Penugasan




Tidak ada komentar:

Posting Komentar