Saya ingin membaca dan menulis Google Sheets dengan React untuk memperbarui data aplikasi yang saya buat dengan Glideapps, pembuat aplikasi tanpa kode yang menggunakan Google Sheets sebagai sumber data
Butuh waktu cukup lama bagi saya untuk mencari tahu bagaimana melakukan itu. Tapi ternyata solusinya cukup mudah
TL;DR
- Hasilkan file kunci akun layanan Google, dapatkan nilai private_key dan client_email
- Dapatkan spreadsheet_id dan sheet_id Anda
- Bagikan spreadsheet Anda dengan izin pengeditan dengan alamat email di bidang client_email Anda
- Pastikan baris pertama di spreadsheet Anda berisi kolom header. Nilai-nilai ini akan menjadi "kunci" di objek data Anda
- Instal google-spreadsheet dan gunakan untuk terhubung ke Google Sheets. Ada contoh yang sangat bagus dalam dokumen di sini, dan saya telah menyertakan cuplikan cara menambahkan ke spreadsheet di bagian bawah postingan ini
Berikut adalah petunjuk langkah demi langkah terperinci dengan tangkapan layar
1) Buka konsol pengembang Google
https. //menghibur. developer. google. com/
Klik "Pilih proyek" lalu klik "Proyek baru", beri nama
Klik "Kredensial" lalu klik "Kelola akun layanan", lalu klik "Buat akun layanan"
Tambahkan nama dan deskripsi, lalu klik "Buat"
Klik "Lanjutkan" pada halaman "Izin akun layanan", karena ini opsional
Klik "Selesai" pada halaman "Beri pengguna akses ke akun layanan ini", karena ini juga opsional
Klik "Buat kunci" di bawah kolom Tindakan
Pilih "JSON" default dan Google akan mengunduh file kunci ke folder unduhan default Anda
Jika Anda membuka file JSON, ada dua bidang yang Anda perlukan. "private_key" dan "client_email"
2) Buka Google Sheets Anda dan temukan spreadsheet_id dan sheet_id
3) PENTING Ingatlah untuk membagikan spreadsheet Anda dengan alamat email di file kunci Anda dengan kunci client_email
Anda akan segera melihat pesan "orang ditambahkan".
4) Pastikan baris pertama Anda berisi nama kolom
5) Ada contoh yang sangat bagus di Google-Spreadsheet untuk membaca dan menulis ke Spreadsheet
Ini cuplikan untuk menambahkan baris baru ke spreadsheet yang saya tulis
import { GoogleSpreadsheet } from "google-spreadsheet"; // Config variables const SPREADSHEET_ID = process.env.REACT_APP_SPREADSHEET_ID; const SHEET_ID = process.env.REACT_APP_SHEET_ID; const CLIENT_EMAIL = process.env.REACT_APP_GOOGLE_CLIENT_EMAIL; const PRIVATE_KEY = process.env.REACT_APP_GOOGLE_SERVICE_PRIVATE_KEY; const doc = new GoogleSpreadsheet(SPREADSHEET_ID); const appendSpreadsheet = async (row) => { try { await doc.useServiceAccountAuth({ client_email: CLIENT_EMAIL, private_key: PRIVATE_KEY, }); // loads document properties and worksheets await doc.loadInfo(); const sheet = doc.sheetsById[SHEET_ID]; const result = await sheet.addRow(row); } catch (e) { console.error('Error: ', e); } }; const newRow = { Name: "new name", Value: "new value" }; appendSpreadsheet(newRow);
Masuk ke mode layar penuh Keluar dari mode layar penuh