Google 致力于为黑人社区推动种族平等。查看具体举措。
Questa pagina è stata tradotta dall'API Cloud Translation.
Switch to English

Prova in locale, condividi le modifiche, quindi distribuisci dal vivo

Prima di eseguire la distribuzione sul tuo sito live, ti consigliamo di visualizzare e testare le modifiche. Firebase Hosting ti consente di visualizzare e testare le modifiche in locale e interagire con le risorse del progetto back-end emulato. Se hai bisogno che i tuoi compagni di squadra visualizzino e testino le tue modifiche, Hosting può creare URL di anteprima temporanei e condivisibili per il tuo sito. Supportiamo anche un'integrazione GitHub per la distribuzione da una richiesta pull.

Prima di iniziare

Completa i passaggi elencati nella pagina Guida introduttiva all'hosting , in particolare le seguenti attività:

  1. Installa o aggiorna la CLI di Firebase alla versione più recente.
  2. Collega la directory del progetto locale (contenente il contenuto della tua app) al tuo progetto Firebase.

Facoltativamente, puoi distribuire il contenuto di hosting e la configurazione della tua app, ma non è un prerequisito per i passaggi in questa pagina.

Passaggio 1: prova a livello locale

Se stai effettuando iterazioni rapide o desideri che la tua app interagisca con le risorse del progetto di backend emulato, puoi testare i tuoi contenuti di hosting e configurare localmente. Durante il test in locale, Firebase serve la tua app web a un URL ospitato localmente.

L'hosting fa parte della Firebase Local Emulator Suite , che consente alla tua app di interagire con il contenuto e la configurazione dell'hosting emulato , nonché facoltativamente con le risorse del progetto emulate (funzioni, database e regole). Tieni presente che la Local Emulator Suite non supporta ancora il Cloud Storage emulato.

  1. (Facoltativo) Per impostazione predefinita, la tua app ospitata localmente interagirà con risorse di progetto reali , non emulate (funzioni, database, regole, ecc.). In alternativa, puoi facoltativamente connettere la tua app per utilizzare le risorse di progetto emulate che hai configurato. Ulteriori informazioni: Database in tempo reale | Cloud Firestore | Cloud Functions

  2. Dalla radice della directory del progetto locale, esegui il seguente comando:

    firebase emulators:start

  3. Apri la tua app web all'URL locale restituito dalla CLI (solitamente http://localhost:5000 ).

  4. Per aggiornare l'URL locale con le modifiche, aggiorna il browser.

Prova da altri dispositivi locali

Per impostazione predefinita, gli emulatori rispondono solo alle richieste da localhost . Ciò significa che sarai in grado di accedere ai tuoi contenuti ospitati dal browser web del tuo computer ma non da altri dispositivi sulla tua rete. Se desideri eseguire il test da altri dispositivi locali, configura il tuo firebase.json modo:

"emulators": {
    // ...

    "hosting": {
      "port": 5000
      "host": "0.0.0.0"
    }
  }

Passaggio 2: visualizza l' anteprima e condividi

Se desideri che gli altri visualizzino le modifiche alla tua app Web prima di andare in diretta, puoi utilizzare i canali di anteprima.

Dopo la distribuzione su un canale di anteprima, Firebase offre la tua app web a un "URL di anteprima", che è un URL temporaneo condivisibile. Quando si utilizza un URL di anteprima, l'app Web interagisce con il backend reale per tutte le risorse del progetto.

Tieni presente che sebbene gli URL di anteprima siano difficili da indovinare (poiché contengono un hash casuale), sono pubblici. Quindi, chiunque conosca l'URL può accedervi.

  1. Dalla radice della directory del progetto locale, esegui il seguente comando:

    firebase hosting:channel:deploy CHANNEL_ID

    Sostituisci CHANNEL_ID con una stringa senza spazi (ad esempio, feature_mission-2-mars ). Questo ID verrà utilizzato per costruire l'URL di anteprima associato al canale di anteprima.

  2. Apri la tua app web all'URL di anteprima restituito dalla CLI. Sarà simile a questo: PROJECT_ID -- CHANNEL_ID - RANDOM_HASH .web.app

  3. Per aggiornare l'URL di anteprima con le modifiche, esegui di nuovo lo stesso comando. Assicurati di specificare lo stesso CHANNEL_ID nel comando.

Informazioni sulla gestione dei canali di anteprima , incluso come impostare la scadenza di un canale.

Firebase Hosting supporta un'azione GitHub che crea e aggiorna automaticamente un URL di anteprima quando effettui il commit delle modifiche a una richiesta pull. Scopri come configurare e utilizzare questa azione GitHub .

Passaggio 3: distribuisci in tempo reale

Quando sei pronto per condividere le tue modifiche con il mondo, distribuisci i tuoi contenuti di hosting e configura sul tuo canale live. Firebase offre un paio di opzioni diverse per questo passaggio a seconda del tuo caso d'uso (vedi le opzioni di seguito).

Opzione 1: clona da un canale di anteprima al tuo canale live

Questa opzione fornisce la certezza che stai distribuendo sul tuo canale live il contenuto esatto e la configurazione che hai testato in un canale di anteprima. Ulteriori informazioni sulla clonazione delle versioni .

  1. Da qualsiasi directory, esegui il seguente comando:

    firebase hosting:clone SOURCE_SITE_ID:SOURCE_CHANNEL_ID TARGET_SITE_ID:live

    Sostituisci ogni segnaposto con il seguente:

    • SOURCE_SITE_ID e TARGET_SITE_ID : questi sono gli ID dei siti di hosting che contengono i canali.

      • Per il tuo sito di hosting predefinito, utilizza il tuo ID progetto Firebase.
      • Puoi specificare siti che si trovano nello stesso progetto Firebase o anche in progetti Firebase diversi.

    • SOURCE_CHANNEL_ID : questo è l'identificatore del canale che sta attualmente offrendo la versione che desideri distribuire al tuo canale live.

      • Per un canale live, utilizza live come ID canale.

  2. Visualizza le modifiche (passaggio successivo).

Opzione 2: distribuisci dalla directory del tuo progetto locale al tuo canale live

Questa opzione offre flessibilità per regolare le configurazioni specifiche del canale live o per distribuirle anche se non hai utilizzato un canale di anteprima.

  1. Dalla radice della directory del progetto locale, esegui il seguente comando:

    firebase deploy --only hosting

  2. Visualizza le modifiche (passaggio successivo).

Passaggio 4: visualizza le modifiche sul tuo sito live

Entrambe le opzioni precedenti distribuiscono il contenuto di hosting e la configurazione ai seguenti siti:

  • I sottodomini forniti da Firebase per il tuo sito di hosting predefinito e per eventuali siti di hosting aggiuntivi:
    SITE_ID .web.app (come PROJECT_ID .web.app )
    SITE_ID .firebaseapp.com (come PROJECT_ID .firebaseapp.com )

  • Eventuali domini personalizzati che hai collegato ai tuoi siti di hosting

Per limitare la distribuzione a un sito di hosting specifico , specificare una destinazione di distribuzione nel comando CLI.

Altre attività e informazioni di distribuzione

Aggiungi un commento per la distribuzione

Facoltativamente, puoi aggiungere un commento a una distribuzione. Questo commento verrà visualizzato con le altre informazioni sulla distribuzione nella dashboard di hosting nella console Firebase. Per esempio:

firebase deploy --only hosting -m "Deploying the best new feature ever."

Aggiungere attività con script di pre-distribuzione e postdistribuzione

Facoltativamente, è possibile collegare script della shell al comando firebase deploy per eseguire attività di predistribuzione o postdistribuzione. Ad esempio, un hook postdeploy potrebbe notificare agli amministratori le nuove distribuzioni di contenuto del sito. Fare riferimento alla documentazione della CLI di Firebase per maggiori dettagli.

Memorizzazione nella cache del contenuto distribuito

Quando viene effettuata una richiesta per contenuto statico , Firebase Hosting memorizza automaticamente nella cache il contenuto sulla CDN. Se ridistribuisci il contenuto del tuo sito, Firebase cancella automaticamente tutto il contenuto statico memorizzato nella cache nella CDN in modo che le nuove richieste ricevano il tuo nuovo contenuto.

Tieni presente che puoi configurare la memorizzazione nella cache del contenuto dinamico .

Pubblicazione su HTTPS

Assicurati che tutte le risorse esterne che non sono ospitate su Firebase Hosting siano caricate su SSL (HTTPS), inclusi eventuali script esterni. La maggior parte dei browser non consente agli utenti di caricare "contenuto misto" (traffico SSL e non SSL).

Prossimi passi