Mengupdate layanan web Anda

ID region

REGION_ID adalah kode singkat yang ditetapkan Google berdasarkan region yang Anda pilih saat membuat aplikasi. Kode ini tidak sesuai dengan negara atau provinsi, meskipun beberapa ID region mungkin tampak mirip dengan kode negara dan provinsi yang umum digunakan. Untuk aplikasi yang dibuat setelah Februari 2020, REGION_ID.r disertakan dalam URL App Engine. Untuk aplikasi lama yang dibuat sebelum tanggal tersebut, ID region bersifat opsional dalam URL.

Pelajari ID region lebih lanjut.

Bagian panduan ini menunjukkan cara menulis, menguji, dan men-deploy update ke contoh layanan web yang Anda deploy di bagian sebelumnya, Men-deploy Layanan Web Anda.

Sebelum memulai

Jika Anda belum menyelesaikan bagian sebelumnya dalam panduan "Membuat Aplikasi" ini, lakukan langkah berikut:

  1. Buat project Google Cloud dengan aplikasi App Engine.
  2. Tulis layanan web Node.js sederhana.
  3. Deploy layanan web di App Engine.

Mengupdate contoh layanan web

Bagian berikut akan mengupdate contoh layanan web dengan formulir dan pengendali yang merespons saat pengguna mengirimkan formulir.

Membuat formulir untuk input pengguna

Untuk mengizinkan pengguna mengirimkan data ke server Anda, gunakan formulir HTML.

  1. Di folder my-nodejs-service, buat folder bernama views untuk menyimpan file HTML Anda.

  2. Dalam folder views, buat file bernama form.html dan tambahkan kode berikut:

    <!DOCTYPE html>
<html>
  <head>
    <title>My App Engine App</title>
  </head>
  <body>
    <h2>Create a new post</h2>
    <form method="POST" action="/submit">
      <div>
        <input type="text" name="name" placeholder="Name">
      </div>
      <div>
        <textarea name="message" placeholder="Message"></textarea>
      </div>
      <div>
        <button type="submit">Submit</button>
      </div>
    </form>
  </body>
</html>

Formulir sederhana ini memungkinkan pengguna memasukkan nama dan pesan yang akan dikirim ke server. Fungsi ini mengirimkan data melalui permintaan POST HTTP ke /submit, seperti yang ditentukan oleh atribut method dan action pada elemen <form>.

Pada tahap ini, Anda seharusnya memiliki struktur file seperti berikut:

my-nodejs-service/
  views/
    form.html
  app.yaml
  package.json
  server.js

Menampilkan formulir

  1. Tambahkan baris berikut ke bagian atas file server.js Anda untuk mengimpor modul path:

    const path = require(`path`);

  2. Tambahkan pengendali Express berikut untuk menampilkan formulir saat pengguna menjelajahi /submit:

    app.get('/submit', (req, res) => {
  res.sendFile(path.join(__dirname, '/views/form.html'));
});

Membuat pengendali untuk data yang dikirim

Saat pengguna mengirim pesan ke server, permintaan POST yang berisi data akan dikirim ke /submit. Untuk membaca data dari isi permintaan, gunakan middleware urlencoded Express dan buat pengendali permintaan baru.

  1. Setel aplikasi Anda agar menggunakan middleware urlencoded Express:

    // This middleware is available in Express v4.16.0 onwards
app.use(express.urlencoded({extended: true}));

  2. Tambahkan pengendali POST ke file server.js untuk membaca data:

    app.post('/submit', (req, res) => {
  console.log({
    name: req.body.name,
    message: req.body.message,
  });
  res.send('Thanks for your message!');
});

Pengendali contoh ini akan mencatat nama dan pesan pengguna ke konsol, tetapi Anda juga dapat melakukan operasi pada data tersebut atau menyimpannya dalam database.

Menguji formulir secara lokal

Uji formulir baru secara lokal sebelum men-deploy perubahan.

  1. Mulai server Node.js Anda:

    npm start

  2. Lihat formulir Anda di http://localhost:8080/submit.

    Kirim pesan dengan formulir. Anda akan melihat nama dan pesan Anda muncul di terminal.

Men-deploy perubahan

Saat Anda men-deploy update, versi baru layanan default akan dibuat dan traffic akan otomatis dirutekan ke versi terbaru. Untuk men-deploy:

  1. Jalankan perintah berikut dari folder my-nodejs-service Anda:

    gcloud app deploy

    Ini adalah perintah yang sama dengan yang Anda pelajari di Men-deploy Layanan Web Anda.

  2. Pastikan bahwa versi baru telah tercantum di konsol Google Cloud:

    Lihat versi

    Anda akan melihat dua versi yang sesuai dengan deployment sebelumnya dan saat ini.

Setelah di-deploy, formulir baru Anda dapat diakses di https://PROJECT_ID.REGION_ID.r.appspot.com/submit. Gunakan tombol tersebut untuk mengirimkan satu atau dua pesan!

Jika tidak memerlukan versi sebelumnya lagi, Anda dapat menghapusnya dari halaman versi di konsol Google Cloud.

Langkah berikutnya

Setelah aplikasi Anda memiliki formulir bagi pengguna untuk mengirimkan data, pelajari cara melihat log aplikasi Anda di konsol Google Cloud.