Suggerimenti ed esempi di siti web statici

Puoi ospitare un sito web statico in un bucket Cloud Storage. Utilizza i bucket per gestire asset come HTML, CSS, JavaScript e immagini. Puoi anche configurare pagine indice ed errore personalizzate e gestire i sottodomini per il tuo sito. Questa pagina fornisce esempi di configurazione e suggerimenti per l'hosting di un sito web statico su Cloud Storage.

Per iniziare, consulta Ospitare un sito web statico.

Pagine speciali

Quando configuri un bucket per ospitare un sito web statico, puoi specificare pagine speciali, come pagine indice e pagine di errore. Le sezioni seguenti descrivono queste pagine.

Pagine indice

Una pagina indice (chiamata anche indice della directory del server web) è un file fornito ai visitatori quando richiedono un URL a cui non è associato alcun file. Quando assegni una proprietà MainPageSuffix, Cloud Storage cerca un file con quel nome il cui prefisso corrisponde all'URL richiesto dal visitatore.

Ad esempio, supponiamo che tu abbia impostato MainPageSuffix del tuo sito web statico su index.html. Inoltre, supponiamo che nel bucket www.example.com non esista un file denominato directory. In questa situazione, se un utente richiede l'URL http://www.example.com/directory, Cloud Storage tenta di gestire il file www.example.com/directory/index.html. Se anche questo file non esiste, Cloud Storage restituisce una pagina di errore.

MainPageSuffix controlla anche il file gestito quando gli utenti richiedono il sito di primo livello. Continuando con l'esempio precedente, se un utente richiede http://www.example.com, Cloud Storage tenta di gestire il file www.example.com/index.html.

Quando tenti di accedere a un URL con una barra finale, ad esempio http://www.example.com/dir/, consulta Risoluzione dei problemi.

Pagina di errore

La pagina di errore è il file restituito ai visitatori del tuo sito statico che richiedono un URL che non corrisponde a un file esistente. Se hai assegnato un MainPageSuffix, Cloud Storage restituisce la pagina di errore solo se non esiste un file con il nome richiesto né una pagina indice applicabile.

Quando viene restituita una pagina di errore, il codice di risposta HTTP è 404. La proprietà che controlla quale file funge da pagina di errore è NotFoundPage. Se non imposti NotFoundPage, gli utenti ricevono una pagina di errore generica.

Esempi di configurazione del sito web

Bucket con tre oggetti

Supponiamo che un bucket denominato www.example.com sia stato configurato come sito web con le seguenti impostazioni e file:

  • MainPageSuffix = "index.html"
  • NotFoundPage = "404.html"
  • Il bucket contiene tre oggetti condivisi pubblicamente: "index.html", "404.html" e "dir/index.html".

La tabella seguente mostra i contenuti gestiti per gli URL selezionati:

URL richiesto Contenuti gestiti Codice di risposta HTTP
http://www.example.com
http://www.example.com/
http://www.example.com/index.html
L'oggetto "index.html". 200
http://www.example.com/hello L'oggetto "404.html". 404
http://www.example.com/dir/index.html L'oggetto "dir/index.html". 200
http://www.example.com/dir Una risposta con un corpo vuoto e un'intestazione Location che punta a "dir/index.html". 301
http://www.example.com/dir/ L'oggetto "dir/index.html", presupponendo che non esista alcun oggetto a zero byte per /dir/ 200
Un oggetto vuoto a zero byte, se esiste per /dir/. Consulta l'argomento Risoluzione dei problemi per rimuovere questo oggetto a zero byte. 301

Bucket con due oggetti

Supponiamo che un bucket denominato www.example.com sia stato configurato come sito web con le seguenti impostazioni e file:

  • MainPageSuffix = "main.html"
  • NotFoundPage = "404.html"
  • Il bucket contiene due oggetti condivisi pubblicamente: "main.html" e "404.html".

La tabella seguente mostra i contenuti gestiti per gli URL selezionati:

URL richiesto Contenuti gestiti Codice di risposta HTTP
http://www.example.com
http://www.example.com/
L'oggetto "main.html". 200
http://www.example.com/index.html L'oggetto "404.html". 404

Se un oggetto è condiviso pubblicamente, puoi visualizzarlo anche con l'URL:

http://storage.googleapis.com/BUCKET_NAME/OBJECT_NAME

Ad esempio, l'URL per un oggetto index.html sarebbe:

http://storage.googleapis.com/www.example.com/index.html

Per ulteriori informazioni su come utilizzare i dati accessibili pubblicamente, consulta Accesso ai dati pubblici.

Suggerimenti per l'utilizzo di un bucket configurato come sito web

Di seguito sono riportati alcuni suggerimenti da tenere presente quando utilizzi un bucket per ospitare un sito web statico.

Aggiungere sottodomini

Supponiamo che tu voglia anche erogare contenuti all'indirizzo test.example.com da un bucket diverso da quello che eroga i contenuti all'indirizzo www.example.com. Ecco come fare:

  1. Crea un nuovo bucket per gestire i contenuti aggiuntivi.

  2. Se hai seguito il tutorial Ospitare un sito web statico per gestire i tuoi contenuti tramite HTTPS, modifica il bilanciatore del carico nella Google Cloud console nel seguente modo:

    1. In Configurazione backend, crea un nuovo bucket di backend test-bucket selezionando il nuovo bucket che hai creato.
    2. In Regole host e percorso, aggiungi una nuova regola nel seguente modo:
      Hosts                  Paths     Backends
      test.example.com       /*        test-bucket
      
    3. In Configurazione frontend, aggiungi un nuovo IP e una nuova porta frontend con gli stessi valori della prima configurazione, con le seguenti eccezioni:

      • In Indirizzo IP, crea e prenota un nuovo indirizzo IP.
      • In Certificato, crea un nuovo certificato SSL per test.example.com.
  3. Dopo aver aggiornato il bilanciatore del carico, aggiungi un nuovo record A al servizio di registrazione del dominio utilizzando l'indirizzo IP della nuova configurazione frontend:

    NAME                  TYPE     DATA
    test                  A        IP_ADDRESS
    

Comportamento dell'API

Le configurazioni del sito web MainPageSuffix e NotFoundPage vengono utilizzate solo per le richieste che arrivano a Cloud Storage tramite un CNAME o A reindirizzamento. Ad esempio, una richiesta a www.example.com mostra la pagina indice, ma una richiesta equivalente a storage.googleapis.com/www.example.com no.

Pertanto, il comportamento dell'API per le richieste ai domini Cloud Storage, come storage.googleapis.com/www.example.com, viene mantenuto. Ad esempio, puoi continuare a elencare gli oggetti nel bucket www.example.com come faresti per qualsiasi altro bucket. Nel caso del bucket www.example.com, l'elenco degli oggetti che ricevi include 404.html e index.html.

Ospitare asset statici per un sito web dinamico

Puoi utilizzare Cloud Storage per ospitare asset statici per un sito web dinamico che è ospitato, ad esempio, in Google App Engine o in Google Compute Engine. Alcuni vantaggi dell'hosting di asset statici, come immagini o file JavaScript, in un bucket includono:

  • Cloud Storage si comporta come una rete CDN (Content Delivery Network) perché gli oggetti leggibili pubblicamente vengono memorizzati nella cache nella rete Cloud Storage per impostazione predefinita.

  • In genere, gli addebiti per la larghezza di banda per l'accesso ai contenuti sono inferiori con Cloud Storage.

  • Il carico sui server web viene ridotto quando i contenuti statici vengono gestiti da Cloud Storage.

Quando ospiti asset statici per un sito web dinamico, non devi creare record DNS e puntare a un bucket o a un bilanciatore del carico come faresti per un sito web statico. Ad esempio, potresti avere un bucket denominato www_example_com_assets con gli asset appropriati configurati come condivisi pubblicamente e poi accedere a questi asset utilizzando il dominio Cloud Storage. Ad esempio, supponiamo che tu abbia il file JavaScript library.js nel bucket www_example_com_assets condiviso pubblicamente, quindi puoi accedervi come http://storage.googleapis.com/www_example_com_assets/library.js.

Impostare i parametri della cache

Puoi controllare come o se gli asset del tuo sito web vengono memorizzati nella cache configurando i Cache-Control metadati. In genere, imposta i metadati di controllo della cache solo per gli oggetti accessibili a tutti gli utenti anonimi, un requisito per qualsiasi oggetto gestito da un bucket Cloud Storage come parte di un sito web statico.

Cloud Storage applica un'impostazione di controllo della cache di 3600 secondi agli oggetti accessibili a tutti gli utenti anonimi, a meno che tu non specifichi impostazioni di controllo della cache esplicite. Per istruzioni su come impostare i metadati degli oggetti, ad esempio Cache-Control, consulta Visualizzare e modificare i metadati.

Puoi anche utilizzare Cloud CDN per memorizzare nella cache i contenuti HTTP(S) bilanciati del carico esterni vicino ai tuoi utenti, il che spesso riduce i costi di gestione. Per ulteriori informazioni, consulta Memorizzazione nella cache.

Monitorare gli addebiti

Se gestisci asset da un bucket configurato come sito web statico o asset statici da un bucket per un sito web dinamico ospitato al di fuori di Cloud Storage, devi monitorare gli addebiti al progetto contenente il bucket. La gestione dei contenuti comporta costi di Cloud Storage per l'archiviazione dei contenuti, l'utilizzo della rete e l'esecuzione di operazioni di recupero. Per maggiori dettagli, consulta la pagina dei prezzi di Cloud Storage.

Potresti anche incorrere in addebiti di rete se utilizzi un bilanciatore del carico delle applicazioni esterno per configurare HTTPS. Per maggiori dettagli, consulta la sezione relativa ai prezzi di rete.

L'esempio di prezzi semplice nella pagina degli esempi di prezzi può essere utilizzato come approssimazione per il caso d'uso di un sito web statico a basso traffico. Tieni presente, tuttavia, che l'esempio non tiene conto degli addebiti associati al bilanciatore del carico delle applicazioni esterno, che spesso può essere l'addebito più elevato per l'hosting di siti web statici. Puoi utilizzare il Calcolatore prezzi per generare una stima dei costi in base all'utilizzo previsto.

I nuovi Google Cloud utenti potrebbero essere idonei a usufruire di una prova senza costi.

Se sei un utente attuale Google Cloud , puoi ottenere una suddivisione dettagliata dei costi del progetto nella pagina di fatturazione.

Risoluzione dei problemi

Consulta Risoluzione dei problemi per i problemi comuni associati all'utilizzo di un bucket configurato per gestire i contenuti di siti web statici.

Passaggi successivi

Provalo

Se non conosci Google Cloud, crea un account per valutare le prestazioni di Cloud Storage in scenari reali. I nuovi clienti ricevono anche 300 $di crediti senza costi per l'esecuzione, il test e il deployment dei carichi di lavoro.

Prova Cloud Storage senza costi