Cara Upload File dengan Google Drive API pada Browser Client

Saat kuliah dulu dan belajar pemrograman saya mendapatkan ide untuk menggunakan google drive sebagai media penyimpanan untuk website, ide ini muncul saat saya ingin membuat aplikasi web yang menggunakan banyak konten gambar didalamnya.

Mengingat menyewa penyimpanan cloud dirasa cukup mahal, dan saya mempunyai keterbatasan dalam biaya, muncullah ide untuk memanfaatkan google drive unlimited yang diberikan oleh kampus secara gratis.

Setelah mendapatkan ide tersebut, lalu saya cari-cari cara bagaimana upload file google drive menggunakan pemrograman PHP namun sampai lulus kuliah pun fitur upload file ke google drive ini tidak pernah terealisasi.

Kendala saat itu adalah karena saya tidak begitu paham dokumentasinya, tutorial di internet yang belum lengkap, tugas kuliah yang mulai banyak, dan lainnya. Namun setelah sekarang sudah lulus, saya bisa belajar dan explore lagi mengenai Google Drive API, dan hasilnya saya akan bagikan dibawah ini.

Pada awalnya saya berhasil upload file ke google drive menggunakan PHP dengan menggunakan bantuan library dari google dan berjalan sesuai rencana, namun karena dirasa kurang efisien (karena pengguna harus upload ke server php dulu lalu server php upload lagi ke server google).

Jadi untuk pengembangan selanjutnya saya menginginkan user langsung bisa upload ke server google dengan javascript di browser tanpa perantara server PHP, dan inilah yang akan kita bahasa di artikel kali ini, untuk cara penggunaan Google Drive API di PHP saya skip dulu ya karena sudah cukup banyak yang membahasanya di internet, mungkin akan dibahas lain kali pada blog ini.

Sumber Referensi

Sebelum memulai membahas topik utamanya, saya ingin memberikan beberapa sumber yang menjadi inspirasi saya menulis script upload file ke google drive, tentunya dengan modifikasi yang disesuaikan.

https://developers.google.com/drive/api/guides/manage-uploads

https://developers.google.com/drive/api/v2/reference/files/insert

Stackoverflow karena saya lupa linknya, silahkan sobat cari dengan keyword yang maknanya serupa dengan judul artikel ini.

Upload File Google Drive dengan Javascript

Pada artikel ini saya akan menggunakan jquery ajax untuk mengupload filenya, silahkan sobat sesuaikan dengan metode upload ajax lainnya. Langsung saja dibawah ini adalah contoh script upload file ke google drive dengan html dan javascript.

Jika upload berhasil maka server google mengembalikan data json tentang informasi file dan header HTTP 200 seperti dibawah ini, silahkan cek halaman google drive sobat masing-masing untuk memastikannya bahwa file benar-benar terupload.

File yang diupload diatas izinnya masih private, jadi hanya bisa diakses oleh pemiliknya. Agar bisa diakses oleh semua orang yang memiliki link kita harus mengubah permissionnya dengan script tambahan yang akan saya bahas dibawah ini.

Buat Permission Google Drive dengan Javascript

Dari script diatas saya akan menambahkan kode untuk mengubah permissionnya, penambahan script terdapat pada baris 58, dimana saya memanggil function shareLink setelah upload berhasil. Script lengkapnya bisa sobat lihat dibawah ini.

Untuk penjelasan kodenya hampir sama saja seperti penjelasan saya sebelumnya, hanya saja ada penambahan parameter file_id di url api pada baris 73, file_id didapatkan dari response json saat berhasil mengupload file di langkah sebelumnya.

Selain itu saya juga menambahkan data yang diperlukan dibaris 80, ini bertujuan agar setiap orang yang memiliki link google drivenya bisa melihat dan mendownload file. untuk cara penggunaan permission lainnya bisa sobat baca di https://developers.google.com/drive/api/v3/reference/permissions/create.

Jika seluruh script diatas sukses dijalankan maka kira-kira hasilnya seperti video dibawah ini.

Sudah selesai pembahasan bagaimana cara  upload file dengan google Drive API, sebelum menutup artikel ini saya ingin memberikan sedikit catatan yaitu.

• Jika sobat ingin menggunakan Google API di Browser dan dapat diakses public jangan lupa untuk memperhatikan keamanannya karena access token bisa terlihat oleh pengguna, Untuk metode pengamanannya silahkan sobat explore sendiri ya, yang pasti access token akan kadaluarsa dalam 1 jam dan dalam rentang 1 jam ini ada peluang untuk disalah gunakan oleh hacker.
• Untuk mengakses API google kita menggunakan domain https://www.googleapis.com, yang kebetulan tidak memblokir akses CORS. Jika sewaktu waktu google merubah kebijakan lalu CORS di blokir maka kita tidak bisa menggunakan metode upload ini lagi.

Cukup sekian artikel ini saya tulis, saya harap sobat tidak hanya mengikuti tutorial diatas, harapan saya sobat bisa explore lagi tentang Google Drive API, dan jika sobat menemukan cara yang lebih baik lagi mohon di share dikomentar ya, khususnya untuk pengiriman data dibaris 23 yang menurut saya masih kurang praktis dan bisa menimbulkan  error. Terima kasih ya, sudah mampir.