Memulai: Menyajikan Konten Statis

Pelajari cara menyajikan konten statis dengan aman seperti file HTML, CSS, dan gambar dari lingkungan standar Google App Engine.

Sebelum memulai

  1. Mengonfigurasi lingkungan pengembangan dan membuat project App Engine.

  2. Jika Anda menggunakan nama domain kustom untuk situs, ikuti petunjuk menambahkan Domain Kustom ke project Anda.

Menyajikan halaman web

App Engine dapat menyajikan konten statis seperti halaman HTML dan media seperti gambar. Konten statis adalah segala sesuatu yang tidak akan dijalankan sebagai JSP atau Servlet.

Contoh berikut adalah halaman HTML dasar yang menampilkan pesan selamat datang.

<!DOCTYPE html>
<html>
  <head>
    <title>The App Engine Blog</title>
  </head>
  <body>
    <h1>Welcome to the App Engine Blog</h1>
    <p>This is being served by App Engine!</p>
  </body>
</html>

Tempat meletakkan file statis

Anda harus menempatkan file yang disajikan statis dalam direktori webapp aplikasi Anda. Anda dapat menggunakan folder, tetapi ingat bahwa semua jalur file dan URI bersifat relatif terhadap direktori webapp.

Setelah memilih lokasi untuk file statis, Anda harus menentukan lokasinya dalam file appengine-web.xml, menggunakan elemen <static-files>.

Pada contoh di bawah, konfigurasi appengine-web.xml dasar memperlakukan semua file HTML dalam direktori webapp sebagai file statis.

<appengine-web-app xmlns="http://appengine.google.com/ns/1.0">
  <threadsafe>true</threadsafe>
  <runtime>java8</runtime>
  <static-files>
    <include path="/**.html" >
    </include>
  </static-files>
</appengine-web-app>

Anda dapat memiliki beberapa elemen <include path> yang merujuk ke berbagai direktori dan jenis file yang berbeda. Memperluas contoh sebelumnya:

<static-files>
  <include path="/**.html" >
  </include>
  <include path="/images/**.jpg" >
  </include>
</static-files>

Sekarang semua file dengan ekstensi .jpg di direktori webapp/images/ akan diperlakukan sebagai file statis.

Pada contoh di atas, jika kita ingin menampilkan logo.jpg dari direktori webapp/images, tag <img> akan memiliki URI sumber <img src="/images/logo.jpg">.

Memaksa HTTPS untuk semua konten statis

Meskipun App Engine mendukung penyajian konten menggunakan HTTP atau HTTPS, Anda harus menggunakan HTTPS. Untuk menyiapkan URL aman, Anda harus menambahkan elemen <security-constraint> ke web.xml project Anda. Contoh <security-constraint> ditampilkan di sini:

<security-constraint>
    <web-resource-collection>
        <web-resource-name>blog</web-resource-name>
        <url-pattern>/*</url-pattern>
    </web-resource-collection>
    <user-data-constraint>
        <transport-guarantee>CONFIDENTIAL</transport-guarantee>
    </user-data-constraint>
</security-constraint>

Dengan menggunakan <transport-guarantee>CONFIDENTIAL</transport-guarantee>, semua permintaan akan otomatis dialihkan ke URI HTTPS konten statis.

Men-deploy ke App Engine

Anda dapat men-deploy aplikasi ke App Engine menggunakan Maven.

Buka direktori root project Anda dan ketik:

mvn package appengine:deploy -Dapp.deploy.projectId=PROJECT_ID

Ganti PROJECT_ID dengan ID project Google Cloud Anda. Jika file pom.xml sudah menentukan ID project, Anda tidak perlu menyertakan properti -Dapp.deploy.projectId dalam perintah yang dijalankan.

Setelah Maven men-deploy aplikasi Anda, buka tab browser web secara otomatis di aplikasi baru dengan mengetik:

gcloud app browse

Langkah selanjutnya

File statis dapat digunakan untuk menyajikan gambar, Cascading Style Sheets, dan konten HTML statis melalui App Engine. Untuk memperluas pengetahuan, Anda mungkin ingin melihat penanganan data pengguna melalui formulir HTML.