Google is committed to advancing racial equity for Black communities. See how.
Questa pagina è stata tradotta dall'API Cloud Translation.
Switch to English

Offri contenuti dinamici e microservizi host con le funzioni cloud

Associa le funzioni cloud all'hosting Firebase per generare e servire i tuoi contenuti dinamici o creare API REST come microservizi.

Le funzioni cloud per Firebase ti consentono di eseguire automaticamente il codice back-end in risposta alle richieste HTTPS. Il tuo codice è archiviato nel cloud di Google e viene eseguito in un ambiente gestito. Non è necessario gestire e ridimensionare i propri server.

Ad esempio, casi d'uso e esempi per le funzioni cloud integrate con Firebase Hosting, visita la nostra panoramica senza server .

Connetti le funzioni cloud all'hosting Firebase

Questa sezione fornisce un esempio dettagliato per la connessione di una funzione a Firebase Hosting.

Tieni presente che per migliorare le prestazioni della pubblicazione di contenuti dinamici, puoi facoltativamente ottimizzare le impostazioni della cache .

Passaggio 1: impostare le funzioni cloud

  1. Assicurati che:

    Per istruzioni dettagliate sull'installazione dell'interfaccia della riga di comando e sull'inizializzazione dell'hosting, consultare la guida introduttiva per l'hosting .

  2. Se hai già impostato le funzioni cloud, puoi procedere al passaggio 2: creare una funzione HTTP .

  3. Se non avete già impostato le funzioni cloud:

    1. Inizializza le funzioni cloud eseguendo il comando seguente dalla radice della directory del progetto: 

      firebase init functions

    2. Quando richiesto, selezionare JavaScript (questo esempio di walk-through utilizza JS).

    3. Assicurarsi di disporre di una directory delle functions nella directory del progetto locale. Questa directory di functions è dove si trova il codice per le funzioni cloud.

Passaggio 2: crea una funzione HTTP sul tuo sito di hosting

  1. Apri /functions/index.js nel tuo editor preferito.

  2. Sostituisci il contenuto del file con il seguente codice.

    Questo codice crea una funzione HTTP (chiamata bigben ) che risponde alle richieste HTTP con un BONG per ogni ora del giorno, proprio come un orologio. 

     const functions = require('firebase-functions');

exports.bigben = functions.https.onRequest((req, res) => {
  const hours = (new Date().getHours() % 12) + 1  // London is UTC + 1hr;
  res.status(200).send(`<!doctype html>
    <head>
      <title>Time</title>
    </head>
    <body>
      ${'BONG '.repeat(hours)}
    </body>
  </html>`);
});

  3. Distribuire questa funzione sul sito eseguendo il comando seguente dalla radice della directory del progetto: 

    firebase deploy

    La funzione è ora raggiungibile nell'URL
    https://us-central1- PROJECT_ID .cloudfunctions.net/bigben .

Visita la documentazione sulle funzioni cloud per ulteriori informazioni sulle richieste HTTP.

Il passaggio successivo illustra come accedere a questa funzione HTTP da un URL di hosting Firebase in modo che possa generare contenuto dinamico per il sito ospitato da Firebase.

Step 3: Indirizza le richieste di hosting alla tua funzione

Con le regole di riscrittura , puoi indirizzare le richieste che abbinano schemi specifici a una singola destinazione. Ad esempio, per indirizzare tutte le richieste dalla pagina /bigben sul tuo sito di hosting per eseguire la funzione bigben .

  1. Apri il tuo file firebase.json .

  2. Aggiungi la seguente configurazione di rewrite nella sezione hosting : 

    "hosting": {
 // ...

 // Add the "rewrites" attribute within "hosting"
 "rewrites": [ {
   "source": "/bigben",
   "function": "bigben"
 } ]
}

  3. Esegui nuovamente il comando firebase deploy .

    La tua funzione è ora raggiungibile tramite i seguenti URL:

    • I tuoi sottodomini Firebase:
      PROJECT_ID .web.app/bigben e PROJECT_ID .firebaseapp.com/bigben

    • Qualsiasi dominio personalizzato connesso:
      CUSTOM_DOMAIN /bigben

Visita la pagina di configurazione dell'hosting per maggiori dettagli sulle regole di riscrittura . Puoi anche conoscere l' ordine di priorità delle risposte per varie configurazioni di hosting.

Utilizzare un framework Web

È possibile utilizzare i framework Web, come Express.js , in Funzioni cloud per servire il contenuto dinamico della propria app e scrivere più facilmente app Web complesse.

La seguente sezione fornisce un esempio dettagliato per l'uso di Express.js con Firebase Hosting e funzioni cloud.

  1. Installa Express.js nel tuo progetto locale eseguendo il seguente comando dalla directory delle functions : 

    npm install express --save

  2. Apri il tuo file /functions/index.js , quindi importa e inizializza Express.js: 

    const functions = require('firebase-functions');
const express = require('express');
const app = express();

  3. Aggiungi i seguenti due endpoint:

    1. Aggiungi il primo endpoint per pubblicare l'indice del nostro sito Web all'indirizzo / . 

       app.get('/', (req, res) => {
  const date = new Date();
  const hours = (date.getHours() % 12) + 1;  // London is UTC + 1hr;
  res.send(`
    <!doctype html>
    <head>
      <title>Time</title>
      <link rel="stylesheet" href="/style.css">
      <script src="/script.js"></script>
    </head>
    <body>
      <p>In London, the clock strikes:
        <span id="bongs">${'BONG '.repeat(hours)}</span></p>
      <button onClick="refresh(this)">Refresh</button>
    </body>
  </html>`);
});

    2. E un altro endpoint per restituire il conteggio BONG come API, in formato JSON, in /api : 

       app.get('/api', (req, res) => {
  const date = new Date();
  const hours = (date.getHours() % 12) + 1;  // London is UTC + 1hr;
  res.json({bongs: 'BONG '.repeat(hours)});
});

  4. Esporta l'app Express.js come funzione HTTP: 

    exports.app = functions.https.onRequest(app);

  5. Nel tuo file firebase.json , indirizza tutte le richieste alla funzione app . Questa riscrittura consente a Express.js di servire i diversi sottotracciati che abbiamo configurato (in questo esempio, / e /api ). 

    {
 "hosting": {
   // ...

   // Add the "rewrites" attribute within "hosting"
   "rewrites": [ {
     "source": "**",
     "function": "app"
   } ]
 }
}

Aggiungi middleware

Continuando il nostro esempio, ora che stai usando Express.js, puoi aggiungere il middleware Express.js nel modo tipico. Ad esempio, è possibile abilitare le richieste CORS sui nostri endpoint.

  1. Installa il middleware cors eseguendo il comando seguente: 

    npm install --save cors

  2. Apri il tuo file /functions/index.js , quindi aggiungi cors alla tua app Express.js, in questo modo: 

    const cors = require('cors')({origin: true});
app.use(cors);

Visita la documentazione sulle funzioni cloud per ulteriori informazioni sull'uso di Firebase con app Express e moduli middleware.

Prova localmente

Puoi servire ed eseguire le tue funzioni HTTP localmente usando l'interfaccia della riga di comando di Firebase. Ciò consente di visualizzare e testare il progetto Firebase prima di distribuirlo in produzione.

  1. Assicurati che sia la CLI di Firebase sia l'SDK delle firebase-functions siano le ultime versioni disponibili. Per aggiornare entrambi, eseguire i due comandi seguenti dalla directory delle functions del progetto locale: 

    npm install -g firebase-tools
    npm install --save firebase-functions@latest

  2. Servi il tuo progetto Firebase localmente eseguendo il comando seguente dalla radice della directory del tuo progetto.

    Questo comando emula l'hosting e le funzioni su URL ospitati localmente. 

    firebase serve
Quando si utilizzano le funzioni cloud per generare contenuto dinamico per Firebase Hosting, il firebase serve Firebase, per impostazione predefinita, utilizza le funzioni HTTP locali come proxy per l'hosting. Per ulteriori opzioni di configurazione per Firebase Hosting e funzioni cloud, consultare il riferimento CLI di Firebase .

Prossimi passi