Ringkasan

Di lab ini, Anda akan membuat bucket Cloud Storage dan menyimpan gambar di dalamnya. Anda juga akan mengonfigurasi aplikasi yang berjalan di Compute Engine agar menggunakan database yang dikelola oleh Cloud SQL. Untuk lab ini, Anda mengonfigurasi server web dengan PHP, yaitu lingkungan pengembangan web yang merupakan dasar bagi software populer untuk blogging. Di luar lab ini, Anda akan menggunakan teknik analog untuk mengonfigurasi paket ini.

Anda juga akan mengonfigurasi server web untuk merujuk gambar di bucket Cloud Storage.

Tujuan

Di lab ini, Anda akan mempelajari cara melakukan tugas berikut:

• Membuat bucket Cloud Storage dan menempatkan gambar di dalamnya.
• Membuat instance Cloud SQL dan mengonfigurasinya.
• Menghubungkan ke instance Cloud SQL dari server web.
• Menggunakan gambar dalam bucket Cloud Storage di halaman web.

Tugas 1. Login ke Konsol Google Cloud

Untuk setiap lab, Anda akan memperoleh project Google Cloud baru serta serangkaian resource selama jangka waktu tertentu, tanpa biaya.

1. Klik tombol Start Lab. Jika Anda perlu membayar lab, jendela pop-up akan terbuka untuk memilih metode pembayaran. Di sebelah kiri adalah panel Lab Details yang memuat sebagai berikut:

   • Tombol Open Google Cloud console
   • Waktu tersisa
   • Kredensial sementara yang harus Anda gunakan untuk lab ini
   • Informasi lain, jika diperlukan, untuk menyelesaikan lab ini

2. Klik Open Google Cloud console (atau klik kanan dan pilih Open Link in Incognito Window jika Anda menjalankan browser Chrome).

   Lab akan menjalankan resource, lalu membuka tab lain yang menampilkan halaman Sign in.

   Tips: Atur tab di jendela terpisah secara berdampingan.

   Catatan: Jika Anda melihat dialog Choose an account, klik Use Another Account.

3. Jika perlu, salin Username di bawah dan tempel ke dialog Sign in.

   {{{user_0.username | "Username"}}}

   Anda juga dapat menemukan Username di panel Lab Details.

4. Klik Next.

5. Salin Password di bawah dan tempel ke dialog Welcome.

   {{{user_0.password | "Password"}}}

   Anda juga dapat menemukan Password di panel Lab Details.

6. Klik Next.

   Penting: Anda harus menggunakan kredensial yang diberikan lab. Jangan menggunakan kredensial akun Google Cloud Anda. Catatan: Menggunakan akun Google Cloud sendiri untuk lab ini dapat dikenai biaya tambahan.

7. Klik halaman berikutnya:

   • Setujui persyaratan dan ketentuan.
   • Jangan tambahkan opsi pemulihan atau autentikasi 2 langkah (karena ini akun sementara).
   • Jangan mendaftar uji coba gratis.

Setelah beberapa saat, Konsol Google Cloud akan terbuka di tab ini.

Catatan: Untuk melihat menu yang berisi daftar produk dan layanan Google Cloud, klik Navigation menu di kiri atas, atau ketik nama layanan atau produk di kolom Search.

Tugas 2. Men-deploy instance VM server web

Dalam tugas ini, Anda akan menyediakan instance virtual machine (VM) menggunakan Compute Engine, mengonfigurasinya dengan server web (Apache) dan skrip yang diperlukan untuk penyiapan awal menggunakan skrip startup. Selanjutnya, Anda mencatat pengidentifikasi jaringannya.

1. Di Konsol Google Cloud, pada Navigation menu (), klik Compute Engine > VM instances.

2. Klik Create instance.

3. Untuk Name, ketik bloghost

4. Untuk Region, pilih .

5. Untuk Zone, pilih .

6. Untuk Machine type, pilih e2-standard-2.

7. Di panel kiri, klik OS and storage. Jika Image yang ditampilkan bukan Debian GNU/Linux 12 (bookworm), klik Change, lalu pilih versi ke Debian GNU/Linux 12 (bookworm).

8. Klik Networking.

9. Di Firewall, klik Allow HTTP traffic.

10. Di panel kiri, klik Advanced.

11. Di Automation, salin dan tempel skrip berikut sebagai nilai untuk Startup script:

apt-get install apache2 php php-mysql -y service apache2 restart Catatan: Pastikan untuk memasukkan skrip tersebut sebagai nilai dalam kolom Startup script. Jika Anda tidak sengaja memasukkannya ke kolom lain, skrip tidak akan dijalankan ketika instance VM dimulai.

12. Tetap gunakan nilai default untuk setelan lainnya, lalu klik Create.

Catatan: Peluncuran instance dapat memerlukan waktu sekitar dua menit hingga sepenuhnya tersedia untuk digunakan.

13. Di halaman VM instances, salin alamat IP internal dan eksternal instance VM bloghost ke editor teks untuk digunakan nanti di lab ini.

Klik Periksa progres saya untuk memverifikasi tujuan. Men-deploy instance VM server web

Tugas 3. Membuat bucket Cloud Storage menggunakan command line gcloud storage

Dalam tugas ini, Anda akan menggunakan alat command line gcloud storage untuk membuat bucket Cloud Storage yang unik secara global, menetapkan lokasinya, mengupload gambar publik ke dalamnya, dan menjadikan objek tertentu dapat dibaca secara publik.

Semua nama bucket Cloud Storage harus unik secara global. Untuk memastikan agar nama bucket Anda unik, petunjuk ini berisi panduan menamai bucket dengan nama yang juga digunakan pada project ID Google Cloud Anda, yang secara global juga unik.

Bucket Cloud Storage dapat dikaitkan dengan lokasi region atau multi-region: US, EU, atau ASIA. Dalam aktivitas ini, Anda akan diminta mengaitkan bucket dengan multi-region yang paling dekat dengan region dan zona yang ditentukan lab atau instruktur untuk Anda.

1. Pada Konsol Google Cloud, di toolbar kanan atas, klik Activate Cloud Shell . Jika kotak dialog muncul, klik Continue.

2. Demi kemudahan, masukkan lokasi yang Anda pilih ke dalam variabel lingkungan bernama LOCATION. Masukkan salah satu perintah berikut:

export LOCATION=US

Atau

export LOCATION=EU

Atau

export LOCATION=ASIA

3. Di Cloud Shell, variabel lingkungan DEVSHELL_PROJECT_ID berisi project ID Anda. Masukkan perintah ini untuk membuat bucket yang diberi nama berdasarkan project ID Anda:

gcloud storage buckets create -l $LOCATION gs://$DEVSHELL_PROJECT_ID

Jika diminta, klik Authorize untuk melanjutkan.

4. Ambil gambar banner dari lokasi Cloud Storage yang dapat diakses secara publik:

gcloud storage cp gs://cloud-training/gcpfci/my-excellent-blog.png my-excellent-blog.png

5. Salin gambar banner ke bucket Cloud Storage yang baru dibuat:

gcloud storage cp my-excellent-blog.png gs://$DEVSHELL_PROJECT_ID/my-excellent-blog.png

6. Ubah Access Control List objek yang baru saja Anda buat sehingga dapat dibaca oleh semua orang:

gsutil acl ch -u allUsers:R gs://$DEVSHELL_PROJECT_ID/my-excellent-blog.png

Klik Periksa progres saya untuk memverifikasi tujuan. Membuat bucket Cloud Storage menggunakan command line gcloud storage

Tugas 4. Membuat instance Cloud SQL

Dalam tugas ini, Anda akan membuat dan mengonfigurasi instance database MySQL terkelola menggunakan Cloud SQL, menyiapkan akun pengguna tertentu, dan yang terpenting, melakukan otorisasi alamat IP eksternal server web Anda di masa mendatang untuk konektivitas jaringan.

1. Di Konsol Google Cloud, pada Navigation menu (), klik Cloud SQL.

2. Klik Create instance.

3. Untuk Choose a database engine, pilih Choose MySQL.

4. Untuk Choose a Cloud SQL edition, klik Enterprise, dan untuk Edition preset, pilih Sandbox dari dropdown.

5. Untuk Instance ID, ketik blog-db, dan untuk Password, ketik Passw0rd1!

6. Untuk Region, pilih .

7. Untuk Zonal availability, pilih Single zone.

8. Luaskan Specify zones, lalu di Primary zone, pilih .

Catatan: Region dan zona ini sama dengan tempat Anda meluncurkan instance bloghost. Demi performa terbaik, tempatkan klien dan database berdekatan satu sama lain.

9. Di Customize your instance, luaskan Show configuration options.

10. Luaskan Security, lalu klik Allow unencrypted network traffic (not recommended).

Catatan: Lab ini tidak menggunakan SSL, jadi pastikan Anda menyetel opsi di atas.

11. Klik Create instance.

Catatan: Tunggu hingga instance selesai di-deploy. Tindakan ini memerlukan waktu beberapa menit.

Mengonfigurasi Pengguna dan Koneksi

1. Dari halaman detail instance SQL, di bagian Connect to this instance, salin Public IP address untuk instance SQL ke editor teks untuk digunakan nanti di lab ini.

2. Di panel kiri, klik Users, lalu klik Add user account.

3. Untuk Nama pengguna, ketik blogdbuser

4. Untuk Password, ketik Passw0rd1!

5. Klik Add untuk menambahkan akun pengguna di database.

Catatan: Tunggu hingga pengguna selesai dibuat.

6. Di panel kiri, klik Connections, lalu klik tab Networking.

7. Klik Add a network.

Catatan: Jika ada pilihan antara koneksi Private IP dan koneksi Public IP, pilih Public IP untuk keperluan lab ini. Catatan: Tombol Add network mungkin tidak dapat digunakan jika pembuatan akun pengguna belum selesai.

8. Untuk Nama, ketik web front end

9. Untuk Jaringan, ketik alamat IP eksternal instance VM bloghost, diikuti dengan /32

Hasilnya akan terlihat seperti ini:

35.192.208.2/32 Catatan: Pastikan Anda menggunakan alamat IP eksternal instance VM diikuti dengan /32. Jangan menggunakan alamat IP internal instance VM. Jangan menggunakan alamat IP sampel yang ditampilkan di sini.

10. Klik Done untuk menyelesaikan penentuan jaringan yang diberi otorisasi.

11. Klik Save untuk menyimpan perubahan konfigurasi.

Catatan: Jika muncul pesan seperti Another operation is in progress, tunggu beberapa menit hingga Anda melihat tanda centang berwarna hijau agar blog-db dapat menyimpan konfigurasi.

Klik Periksa progres saya untuk memverifikasi tujuan. Membuat instance Cloud SQL

Tugas 5. Mengonfigurasi aplikasi dalam instance Compute Engine untuk menggunakan Cloud SQL

Dalam tugas ini, Anda akan menghubungkan server web Apache yang berjalan di instance VM Anda secara aman ke database Cloud SQL dengan memodifikasi kode aplikasi PHP (index.php) untuk menyertakan alamat IP dan kredensial database, sehingga berhasil membuat koneksi database.

1. Di Navigation menu (), klik Compute Engine > VM Instances.

2. Dalam daftar instance VM, klik SSH di baris untuk bloghost instance VM. Jika diminta, klik Authorize.

3. Dalam sesi ssh Anda di bloghost, ubah direktori kerja ke root dokumen server web:

cd /var/www/html

4. Gunakan editor teks nano untuk mengedit file yang bernama index.php:

sudo nano index.php

5. Salin dan tempel konten di bawah ke dalam file:

<html> <head><title>Welcome to my excellent blog</title></head> <body> <h1>Welcome to my excellent blog</h1> <?php $dbserver = "CLOUDSQLIP"; $dbuser = "blogdbuser"; $dbpassword = "DBPASSWORD"; // In a production blog, we would not store the MySQL // password in the document root. Instead, we would store // it in a Secret Manger. For more information see // https://cloud.google.com/sql/docs/postgres/use-secret-manager try { $conn = new PDO("mysql:host=$dbserver;dbname=mysql", $dbuser, $dbpassword); // set the PDO error mode to exception $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); echo "Connected successfully"; } catch(PDOException $e) { echo "Database connection failed:: " . $e->getMessage(); } ?> </body></html> Catatan: Pada langkah selanjutnya, masukkan alamat IP instance Cloud SQL dan sandi database ke dalam file ini. Untuk saat ini, jangan mengubah file.

6. Tekan Ctrl+O, lalu tekan Enter untuk menyimpan file yang diedit.

7. Tekan Ctrl+X untuk keluar dari editor teks nano.

8. Mulai ulang server web:

sudo service apache2 restart

9. Buka tab browser web baru dan tempelkan alamat IP eksternal instance VM bloghost Anda ke kolom URL, diikuti oleh /index.php. URL akan terlihat seperti ini:

35.192.208.2/index.php Catatan: Pastikan Anda menggunakan alamat IP eksternal instance VM yang diikuti dengan /index.php. Jangan menggunakan alamat IP internal instance VM. Jangan menggunakan alamat IP sampel yang ditampilkan di sini. Jika Anda melihat pesan bahwa alamat IP tidak mendukung koneksi aman, klik Continue to site.

Saat memuat halaman, Anda akan melihat konten halaman menyertakan pesan error yang dimulai dengan kalimat:

Database connection failed: ... Catatan: Pesan ini muncul karena Anda belum mengonfigurasi koneksi PHP ke instance Cloud SQL.

10. Kembali ke sesi ssh di bloghost. Gunakan editor teks nano untuk mengedit index.php lagi. Pastikan Anda berada di direktori /var/www/html.

sudo nano index.php

11. Di editor teks nano, ganti CLOUDSQLIP dengan alamat IP Publik instance Cloud SQL (blog-db) yang Anda catat di atas. Beri tanda kutip sebelum dan setelah nilai.

12. Di editor teks nano, ganti DBPASSWORD dengan sandi database Cloud SQL yang Anda tetapkan di atas, yaitu Passw0rd1! Beri tanda kutip sebelum dan setelah nilai.

13. Tekan Ctrl+O, lalu tekan Enter untuk menyimpan file yang diedit.

14. Tekan Ctrl+X untuk keluar dari editor teks nano.

15. Mulai ulang server web:

sudo service apache2 restart

16. Kembali ke tab browser web tempat Anda membuka alamat IP eksternal instance VM bloghost. Saat Anda memuat halaman, pesan berikut akan muncul:

Connected successfully Catatan: Di blog yang sebenarnya, status koneksi database tidak akan terlihat oleh pengunjung blog. Namun, koneksi database akan dikelola sepenuhnya oleh administrator.

Tugas 6. Mengonfigurasi aplikasi dalam instance Compute Engine untuk menggunakan objek Cloud Storage

Dalam tugas ini, Anda akan mengintegrasikan gambar yang dapat diakses secara publik yang disimpan di bucket Cloud Storage ke dalam aplikasi web Anda dengan mengedit file index.php pada instance Compute Engine untuk menyertakan URL sumber gambar yang benar.

1. Pada konsol Google Cloud, klik Cloud Storage > Buckets.

2. Klik bucket yang diberi nama berdasarkan project Google Cloud Anda.

3. Di bucket ini, ada objek dengan nama my-excellent-blog.png. Salin URL di belakang ikon link yang muncul di kolom Public access objek tersebut, atau di belakang kata "Public link" jika ditampilkan.

Catatan: Jika Anda tidak melihat ikon link atau "Public link", coba muat ulang browser. Jika masih tidak melihat ikon link, kembali ke Cloud Shell dan pastikan bahwa upaya Anda untuk mengubah Access Control List objek dengan perintah gsutil acl ch berhasil.

4. Kembali ke sesi ssh di instance VM bloghost.

5. Masukkan perintah ini untuk menyetel direktori kerja ke root dokumen server web:

cd /var/www/html

6. Gunakan editor teks nano untuk mengedit index.php:

sudo nano index.php

7. Gunakan tombol panah untuk memindahkan kursor ke baris yang berisi elemen h1. Tekan Enter untuk membuka baris layar kosong baru, lalu tempelkan URL yang Anda salin sebelumnya ke dalam baris tersebut.

8. Tempel markup HTML ini tepat sebelum URL:

<img src='

9. Tempatkan tanda kutip tunggal penutup dan kurung sudut penutup di akhir URL:

'>

Baris yang dihasilkan akan terlihat seperti ini:

<img src='https://storage.googleapis.com/qwiklabs-gcp-0005e186fa559a09/my-excellent-blog.png'>

Langkah ini akan menempatkan baris berisi <img src='...'> tepat sebelum baris yang berisi <h1>...</h1>

Catatan: Jangan menyalin URL yang ditampilkan di sini. Sebagai gantinya, salin URL yang ditampilkan oleh browser Storage di project Cloud Platform Anda sendiri.

10. Tekan Ctrl+O, lalu tekan Enter untuk menyimpan file yang diedit.

11. Tekan Ctrl+X untuk keluar dari editor teks nano.

12. Mulai ulang server web:

sudo service apache2 restart

13. Kembali ke tab browser web tempat Anda membuka alamat IP eksternal instance VM bloghost. Sekarang konten halaman menyertakan gambar banner saat halaman dimuat.

Selamat!

Di lab ini, Anda telah mengonfigurasi instance Cloud SQL dan menghubungkan aplikasi dalam instance Compute Engine ke dalamnya. Anda juga telah bekerja dengan bucket Cloud Storage.

Mengakhiri lab Anda

Setelah Anda menyelesaikan lab, klik Akhiri Lab. Google Cloud Skills Boost menghapus resource yang telah Anda gunakan dan membersihkan akun.

Anda akan diberi kesempatan untuk menilai pengalaman menggunakan lab. Pilih jumlah bintang yang sesuai, ketik komentar, lalu klik Submit.

Makna jumlah bintang:

• 1 bintang = Sangat tidak puas
• 2 bintang = Tidak puas
• 3 bintang = Netral
• 4 bintang = Puas
• 5 bintang = Sangat puas

Anda dapat menutup kotak dialog jika tidak ingin memberikan masukan.

Untuk masukan, saran, atau koreksi, gunakan tab Support.

Hak cipta 2025 Google LLC. Semua hak dilindungi undang-undang. Google dan logo Google adalah merek dagang dari Google LLC. Semua nama perusahaan dan produk lain mungkin adalah merek dagang masing-masing perusahaan yang bersangkutan.

Referensi lainnya

Baca dokumentasi Google Cloud Platform tentang Cloud SQL.

Baca dokumentasi Google Cloud Platform tentang Cloud Storage.