Ospitare un sito web su App Engine

ID regione

REGION_ID è un codice abbreviato assegnato da Google in base alla regione selezionata quando crei l'app. Il codice non corrisponde a un paese o a una provincia, anche se alcuni ID regione possono sembrare simili ai codici di paesi e province di uso comune. Per le app create dopo febbraio 2020, REGION_ID.r è incluso negli URL di App Engine. Per le app esistenti create prima di questa data, l'ID regione è facoltativo nell'URL.

Scopri di più sugli ID regione.

Puoi utilizzare App Engine per ospitare un sito web statico. Le pagine web statiche possono contenere tecnologie lato client come HTML, CSS e JavaScript. L'hosting del tuo sito statico su App Engine può costare meno rispetto all'utilizzo di un provider host tradizionale, poiché l'ambiente standard di App Engine offre un livello gratuito.

I siti ospitati su App Engine sono ospitati nel sottodominio REGION_ID.r.appspot.com, ad esempio [my-project-id].uc.r.appspot.com. Dopo aver eseguito il deployment del sito, puoi mappare il tuo nome di dominio al sito web ospitato su App Engine.

Prima di iniziare

Prima di poter ospitare il tuo sito web su App Engine:

  1. Crea un nuovo progetto nella console Google Cloud o recupera l'ID progetto di un progetto esistente da utilizzare:

    Vai alla pagina Progetti

  2. Installa e poi inizializza Google Cloud CLI:

    Scarica l'SDK

Creazione di un sito web da ospitare su Google App Engine

Struttura di base per il progetto

Questa guida utilizza la seguente struttura per il progetto:

  • app.yaml: configura le impostazioni dell'applicazione App Engine.
  • www/: la directory in cui vengono archiviati tutti i file statici, ad esempio HTML, CSS, immagini e JavaScript.
    • css/: directory per archiviare i fogli di stile.
      • style.css: foglio di stile di base che formatta l'aspetto del tuo sito.
    • images/: directory facoltativa per archiviare le immagini.
    • index.html: un file HTML che mostra i contenuti del tuo sito web.
    • js/: directory facoltativa per archiviare i file JavaScript.
    • Altre directory di asset.

Creazione del file app.yaml

Il file app.yaml è un file di configurazione che indica ad App Engine come mappare gli URL ai file statici. Nei passaggi successivi, aggiungerai gestori che caricheranno www/index.html quando un utente visita il tuo sito web e tutti i file statici verranno memorizzati e richiamati dalla directory www.

Crea il file app.yaml nella directory principale dell'applicazione:

  1. Crea una directory con lo stesso nome dell'ID progetto. Puoi trovare l'ID progetto nella console.
  2. Nella directory appena creata, crea un file denominato app.yaml.

  3. Modifica il file app.yaml e aggiungi l'elemento handlers in base ai requisiti del tuo sito web. Ad esempio, il file app.yaml per l'ambiente di runtime di Python può essere creato come segue:

    runtime: python39

handlers:
- url: /
  static_files: www/index.html
  upload: www/index.html

- url: /(.*)
  static_files: www/\1
  upload: www/(.*)

Puoi trovare ulteriori informazioni di riferimento sul file app.yaml nella documentazione di riferimento app.yaml.

Creazione del file index.html

Crea un file HTML che verrà pubblicato quando un utente accede alla pagina principale del tuo sito web. Memorizza questo file nella directory www.

<html>
  <head>
    <title>Hello, world!</title>
    <link rel="stylesheet" type="text/css" href="/css/style.css">
  </head>
  <body>
    <h1>Hello, world!</h1>
    <p>
      This is a simple static HTML file that will be served from Google App
      Engine.
    </p>
  </body>
</html>

Eseguire il deployment dell'applicazione in App Engine

Quando esegui il deployment dei file dell'applicazione, il tuo sito web viene caricato su App Engine. Per eseguire il deployment dell'app, esegui il comando seguente dalla directory radice dell'applicazione in cui si trova il file app.yaml:

gcloud app deploy

Flag facoltativi:

  • Includi il flag --project per specificare un ID progetto della console Google Cloud alternativo a quello inizializzato come predefinito in gcloud CLI. Esempio: --project [YOUR_PROJECT_ID]
  • Includi il flag -v per specificare un ID versione, altrimenti ne verrà generato uno per te. Esempio: -v [YOUR_VERSION_ID]

Per scoprire di più sul deployment dell'app dalla riga di comando, consulta Eseguire il deployment dell'applicazione.

Visualizzazione dell'applicazione

Per avviare il browser e visualizzare l'app all'indirizzo https://PROJECT_ID.REGION_ID.r.appspot.com, esegui questo comando:

gcloud app browse

Passaggi successivi

Pubblica il sito web ospitato su App Engine da un dominio personalizzato.