Membuat Project Backend Upload ke Google Drive

admin

 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:

LibraryFungsi
expressserver API
googleapisupload ke Google Drive
multermenerima file upload dari frontend
dotenvmembaca file .env
corsmengizinkan 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?

Tags

Posting Komentar

0 Komentar

Posting Komentar (0)
3/related/default