Sip, kita lanjut Langkah 1: Membuat Project Backend Upload ke Google Drive
(Aku anggap kamu yang pertama artinya kamu ingin mulai dari langkah pertama pada rencana integrasi Google Drive.)
✅ LANGKAH 1 — Buat Proyek Backend (Node.js + Express)
Ini akan menjadi backend yang nanti bisa dipakai untuk:
✔ Upload file ke Google Drive
✔ Simpan token OAuth
✔ Dipanggil oleh frontend (React, Flutter, dsb)
📌 1. Buat Folder Backend
mkdir backend-drive
cd backend-drive
📌 2. Inisialisasi Proyek
npm init -y
📌 3. Install Semua Dependency yang Dibutuhkan
npm install express googleapis multer dotenv cors
Penjelasan cepat:
| Library | Fungsi |
|---|---|
| express | server API |
| googleapis | upload ke Google Drive |
| multer | menerima file upload dari frontend |
| dotenv | membaca file .env |
| cors | mengizinkan frontend mengakses backend |
📌 4. Buat Struktur Folder
backend-drive/
│── server.js
│── upload/
│ └── uploadController.js
│── config/
│ └── googleDrive.js
│── .env
Buat foldernya:
mkdir upload config
touch server.js
touch upload/uploadController.js
touch config/googleDrive.js
touch .env
📌 5. Isi File .env
Ambil client_id, client_secret, redirect_uri dari Google Cloud Console → OAuth 2.0.
GOOGLE_CLIENT_ID=xxx
GOOGLE_CLIENT_SECRET=xxx
GOOGLE_REDIRECT_URI=https://developers.google.com/oauthplayground
REFRESH_TOKEN=xxx
⚠ Untuk sementara, kita pakai OAuth Playground agar cepat uji coba upload Drive.
Jika kamu mau, nanti kita bisa ganti ke login dari frontend.
📌 6. Isi File config/googleDrive.js
import { google } from "googleapis";
import dotenv from "dotenv";
dotenv.config();
const oauth2Client = new google.auth.OAuth2(
process.env.GOOGLE_CLIENT_ID,
process.env.GOOGLE_CLIENT_SECRET,
process.env.GOOGLE_REDIRECT_URI
);
oauth2Client.setCredentials({ refresh_token: process.env.REFRESH_TOKEN });
export const drive = google.drive({
version: "v3",
auth: oauth2Client
});
📌 7. Isi File upload/uploadController.js
import fs from "fs";
import { drive } from "../config/googleDrive.js";
export const uploadToDrive = async (req, res) => {
try {
if (!req.file) return res.status(400).json({ message: "No file uploaded" });
const filePath = req.file.path;
const response = await drive.files.create({
requestBody: {
name: req.file.originalname,
mimeType: req.file.mimetype
},
media: {
mimeType: req.file.mimetype,
body: fs.createReadStream(filePath)
}
});
// Optional: set visibility to PUBLIC
await drive.permissions.create({
fileId: response.data.id,
requestBody: { role: "reader", type: "anyone" }
});
fs.unlinkSync(filePath);
res.json({
success: true,
fileId: response.data.id,
fileUrl: `https://drive.google.com/uc?id=${response.data.id}`
});
} catch (err) {
res.status(500).json({ message: err.message });
}
};
📌 8. Isi File server.js
import express from "express";
import cors from "cors";
import multer from "multer";
import { uploadToDrive } from "./upload/uploadController.js";
const app = express();
app.use(cors());
app.use(express.json());
const upload = multer({ dest: "temp/" });
app.post("/upload", upload.single("file"), uploadToDrive);
app.listen(5000, () => console.log("Server running at http://localhost:5000"));
🎉 Selesai Langkah 1!
Backend sudah siap untuk menerima file dan meng-upload ke Google Drive.
❓ Lanjut ke langkah berikutnya?
Langkah 2: Cara mendapatkan Refresh Token Google
Langkah 3: Integrasi API ini ke frontend (React)
Langkah 4: Menggabungkan dengan sistem Login (Google/Facebook/Github)
Mau lanjut ke nomor berapa?