Creazione di un sito web statico

Questa esercitazione mostra come ospitare un sito Web statico in IBM Cloud® Object Storage, incluso la creazione di un bucket, il caricamento del contenuto e la configurazione del tuo nuovo sito web.

L'hosting di siti web statici con IBM Cloud Object Storage serve contenuto statico per l'accesso pubblico, offrendo agli utenti flessibilità, facilità di consegna e alta disponibilità. Questa esercitazione contiene le istruzioni per l'utilizzo di cURL, la CLI AWS e la Console. Scegliere il proprio percorso per questa esercitazione utilizzando i link per passare tra le istruzioni sopra il titolo di questo argomento.

Lo scenario

Lo scenario per questa esercitazione semplifica il web hosting ai suoi elementi essenziali per evidenziare i passaggi coinvolti. Sebbene non tutte le opzioni di configurazione saranno trattate in questa esercitazione, completando correttamente questa esercitazione si avrà un contenuto accessibile dal Web.

Prima di iniziare

Assicurarsi di disporre di quanto necessario per iniziare:

  • Un account per la piattaforma IBM Cloud
  • Un'istanza di IBM Cloud Object Storage
  • Contenuto in formato fisso, come testo (HTML sarebbe perfetto) e file di immagine

Verifica di disporre dell'accesso appropriato all'istanza di IBM Cloud Object Storage che utilizzerai o alle autorizzazioni appropriate per i bucket che utilizzerai per questa esercitazione.

Per utilizzare la CLIIBM Cloud con questa esercitazione, dovrai configurare il plug-in Object Storage per specificare l'istanza del servizio che vuoi utilizzare e la regione predefinita in cui vuoi che venga creato il tuo nuovo bucket.

Crea un bucket configurato per l'accesso pubblico

La creazione di un bucket per un sito web statico richiederà l'accesso pubblico. Esistono diverse opzioni per configurare l'accesso pubblico. In particolare, l'utilizzo del ruolo IAM di ObjectReader impedirà l'elenco del contenuto del bucket pur consentendo la visualizzazione del contenuto statico su Internet. Se vuoi consentire la visualizzazione dell'elenco dei contenuti, utilizza il ruolo IAM ContentReader per il tuo bucket.

Crea un bucket

Dopo aver configurato il plugin CLI, sostituisci il contenuto del segnaposto come mostrato nel comando di esempio per creare un bucket:

ibmcloud cos bucket-create --bucket <bucketname>

Una volta eseguito l'accesso alla console e dopo aver creato un'istanza di IBM Cloud Object Storage, puoi creare un bucket. Clicca sul pulsante etichettato "Crea bucket" e scegli tra le opzioni come mostrato nella Figura 1. Seleziona la scheda che recita "Personalizza il tuo bucket".

Personalizza il bucket

Il contenitore per i file statici nel tuo sito web risiederà in un bucket che puoi denominare. Il nome creato deve essere univoco, non deve contenere informazioni personali o identificative, non può contenere due punti, punti o trattini in una riga e deve iniziare e terminare con caratteri alfanumerici (voci della serie di caratteri ASCII 3-63). Vedere la Figura 2 per un esempio.

Bucket nomi per sito Web statico

Impostazione dell'accesso pubblico

In tutti gli scenari per questa esercitazione, si desidera utilizzare l'IU nella Console per consentire l'accesso pubblico al nuovo sito.

Quando si crea un bucket per ospitare il contenuto del sito Web statico, è disponibile un'opzione per abilitare l'accesso pubblico come parte del processo di creazione del bucket. Vedi la Figura 3 per l'opzione per abilitare l'accesso pubblico al tuo bucket. Per la spiegazione delle opzioni per "documento di indice" e "documento di errore" come mostrato, trovare ulteriori informazioni nella sezione Configurazione delle opzioni per il sito Web. È possibile completare la configurazione di base con questo passo, prima di caricare il contenuto nel bucket come mostrato nel passo successivo.

Abilita accesso pubblico

Carica contenuto nel bucket

Il contenuto dei file dei siti web statici ospitati si concentra naturalmente su informazioni e supporti. Un approccio popolare per la creazione di contenuto per i siti web statici è quello dei generatori open source elencati in StaticGen. Ai fini di questa esercitazione, sono necessari solo due file:

  • Una pagina di indice, generalmente scritta in HTML e denominata index.html, che viene caricata per impostazione predefinita per i visitatori del proprio sito
  • Una pagina di errore, anche in HTML e qui denominata error.html; di solito la pagina di errore viene caricata quando un visitatore tenta di accedere a un oggetto che non è presente o che non ha accesso pubblico

Altri file, come immagini, PDF o video, possono essere caricati nel tuo bucket (ma questo tutorial si concentrerà solo su una serie minima di requisiti).

Ai fini di questa esercitazione, inserire le pagine HTML per l'indice e la gestione degli errori in una directory locale. Sostituire il contenuto segnaposto come mostrato nel comando di esempio per caricare i propri file html:

ibmcloud cos object-put --bucket BUCKET_NAME --key KEY [--body FILE_PATH]

Potresti aver già completato la configurazione di base per ospitare il tuo sito web statico. I file possono essere caricati direttamente nella console dopo aver denominato e configurato il bucket. Nota che il passo è facoltativo, come mostrato nella Figura 4, e può verificarsi in qualsiasi momento prima del test del tuo nuovo sito web ospitato.

Carica file

Per il resto dell'esercitazione, si presumerà che la chiave dell'oggetto per la pagina dell'indice sia index.html e la chiave per il documento di errore sia error.html anche se qualsiasi nome file appropriato può essere utilizzato per il suffisso o la chiave.

Configurare le opzioni per il sito web

Ci sono più opzioni che questo tutorial può descrivere, e per lo scopo di questo tutorial abbiamo solo bisogno di impostare la configurazione per iniziare a utilizzare la funzione statica del sito web.

Creare un file JSON con le informazioni di configurazione appropriate:

{
  "ErrorDocument": {
    "Key": "error.html"
  },
  "IndexDocument": {
    "Suffix": "index.html"
  }
}

Sostituire il contenuto segnaposto come mostrato nel comando di esempio per configurare il sito Web:

ibmcloud cos bucket-website-put --bucket BUCKET_NAME --website-configuration file://<filename.json>

Potresti aver completato questo passo durante la creazione del tuo bucket, poiché la configurazione di base per il tuo sito web statico ospitato determina quando e come viene visualizzato il contenuto. Per i visitatori del tuo sito web che non riescono a fornire una chiave o una pagina web, verrà invece visualizzato il file predefinito. Quando gli utenti riscontrano un errore, la chiave per la pagina di errore determina quale contenuto riceveranno i visitatori. Le opzioni di configurazione per le pagine predefinite e di errore vengono ripetute per riferimento.

Opzioni di configurazione

Testare e visitare il tuo sito web

Dopo aver configurato il bucket per fornire le intestazioni HTTP utilizzando il comando di esempio, tutto ciò che devi fare per testare il nuovo sito è visitare l'URL del sito. Si prega di notare il protocollo mostrato (http), dopo aver sostituito i segnaposto con le proprie scelte effettuate in precedenza in questo tutorial:

http://<bucketname>.s3-web.<endpoint>/

Con il test di successo del nuovo sito, è ora possibile esplorare più opzioni e aggiungere più contenuto.

Passi successivi

La descrizione dettagliata delle opzioni di configurazione per i siti web statici ospitati IBM Cloud Object Storage è disponibile nella Documentazione API.