Połącz funkcje Cloud Functions z Hostingiem Firebase, aby generować i obsługiwać dynamiczne treści lub tworzenie interfejsów REST API jako mikroserwisów.
Cloud Functions dla Firebase umożliwia automatyczne uruchamianie backendu w odpowiedzi na żądania HTTPS. Twój kod jest przechowywany w chmurze Google, działa w środowisku zarządzanym. Nie musisz zarządzać własnym kontem ani je skalować serwerów.
Przykładowe przypadki użycia i przykłady dotyczące funkcji w Cloud Functions zintegrowanych z Hosting Firebase, zapoznaj się z naszą Omówienie technologii bezserwerowych.
Łączenie Cloud Functions z Hostingiem Firebase
W tej sekcji znajdziesz przykładowy przewodnik łączenia funkcji Hosting Firebase.
Pamiętaj, że aby poprawić wydajność wyświetlania treści dynamicznej, możesz: (opcjonalnie) dostosuj ustawienia pamięci podręcznej.
Krok 1. Skonfiguruj Cloud Functions
Sprawdź, czy masz najnowszą wersję interfejsu wiersza poleceń Firebase masz zainicjowany Hosting Firebase.
Szczegółowe instrukcje instalowania i inicjowania interfejsu wiersza poleceń Hosting, zobacz Wprowadzenie do Hostingu.
Sprawdź, czy masz skonfigurowane Cloud Functions:
Jeśli masz już skonfigurowane funkcje w Cloud Functions, możesz przejść do Krok 2. Utwórz i przetestuj funkcję HTTPS.
Jeśli masz nie skonfigurowane funkcje Cloud Functions:
Zainicjuj funkcje w Cloud Functions, uruchamiając to polecenie z katalog główny projektu:
firebase init functions
Gdy pojawi się odpowiedni komunikat, wybierz JavaScript (ten zwykły przewodnik korzysta z języka JS).
Sprawdź, czy w projekcie lokalnym masz katalog
functions
(utworzonego przed chwilą uruchomionego polecenia Firebase). Ten Katalogfunctions
to miejsce, w którym znajduje się kod Cloud Functions.
Krok 2. Utwórz i przetestuj funkcję HTTPS w swojej witrynie w Hostingu
Otwórz
/functions/index.js
w ulubionym edytorze.Zastąp zawartość pliku poniższym kodem.
Ten kod tworzy funkcję HTTPS (o nazwie
bigben
), która odpowiada na żądania HTTPS z parametremBONG
dla każdej godziny dnia, tak jak w przypadku zegara.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>`); });
Przetestuj funkcje lokalnie za pomocą Pakiet emulatorów lokalnych Firebase.
W katalogu głównym projektu lokalnego uruchom to polecenie polecenie:
firebase emulators:start
Uzyskaj dostęp do funkcji za pomocą lokalnego adresu URL zwróconego przez interfejs wiersza poleceń, w przypadku przykład:
http://localhost:5001/PROJECT_ID/us-central1/bigben
Zapoznaj się z dokumentacją Cloud Functions. , aby dowiedzieć się więcej o żądaniach HTTPS.
W następnym kroku opisujemy, jak uzyskać dostęp do tej funkcji HTTPS z poziomu Adres URL Hostingu Firebase, aby mógł generować zawartość dynamiczną dla Witryna hostowana w Firebase.
Krok 3. Kieruj żądania HTTPS do swojej funkcji
Na
reguły przepisywania, możesz kierować żądania
pasujące do określonych wzorców w jednym miejscu docelowym. Poniższe kroki pokazują
jak przekierować wszystkie żądania ze ścieżki ../bigben
w Hostingu
do uruchomienia funkcji bigben
.
Otwórz plik
firebase.json
.Dodaj w sekcji
hosting
tę konfiguracjęrewrite
:"hosting": { // ... // Add the "rewrites" attribute within "hosting" "rewrites": [ { "source": "/bigben", "function": { "functionId": "bigben", "region": "us-central1" // optional (see note below) "pinTag": true // optional (see note below) } } ] }
Sprawdź, czy przekierowanie działa zgodnie z oczekiwaniami, wykonując test ponownie z użyciem parametru Emulatory Firebase.
W katalogu głównym projektu lokalnego uruchom to polecenie polecenie:
firebase emulators:start
Otwórz hostowany lokalnie adres URL swojej witryny zwrócony przez interfejs wiersza poleceń (zwykle
localhost:5000
), ale dołącz do adresu URL ciągbigben
w ten sposób:http://localhost:5000/bigben
Zapoznaj się ze swoimi funkcjami i funkcjami w witrynie. Użyj za pomocą emulatorów Firebase, które pozwalają przetestować te iteracje.
Aby uzyskać najlepszą wydajność, kolokuj funkcje za pomocą Hostingu przez wybierając jeden z tych regionów:
us-west1
us-central1
us-east1
europe-west1
asia-east1
Odwiedź stronę konfiguracji Hostingu dla domeny Dowiedz się więcej o regułach przepisywania. Dostępne opcje dowiedz się też więcej na temat kolejność priorytetów odpowiedzi dla różnych konfiguracji hostingu.
Pamiętaj, że aby poprawić wydajność wyświetlania treści dynamicznej, możesz: (opcjonalnie) dostosuj ustawienia pamięci podręcznej.
Krok 4. Wdróż funkcję
Gdy funkcja będzie działać w emulatorze zgodnie z oczekiwaniami, możesz przejść do wdrażanie, testowanie i uruchamianie go przy użyciu prawdziwych zasobów projektu. To jest to dobry moment, by ustawić opcje środowiska wykonawczego na kontrolowanie zachowania skalowania dla funkcji działających w środowisku produkcyjnym.
Wdróż funkcję oraz treść i konfigurację Hostingu w , uruchamiając poniższe polecenie w katalogu głównym projektu lokalnego: katalogu:
firebase deploy --only functions,hosting
Aktywna witryna i funkcje możesz uzyskać pod tymi adresami URL:
Twoje subdomeny Firebase:
PROJECT_ID.web.app/bigben
iPROJECT_ID.firebaseapp.com/bigben
Wszystkie połączone domeny niestandardowe:
CUSTOM_DOMAIN/bigben
Korzystanie z platformy internetowej
Możesz użyć platform internetowych, takich jak Express.js w Cloud Functions, aby udostępniać dynamiczne treści w aplikacji i łatwiej pisać złożone aplikacje internetowe.
W tej sekcji znajdziesz szczegółowy przykład użycia pliku Express.js z Hosting Firebase i Cloud Functions.
Zainstaluj plik Express.js w projekcie lokalnym, uruchamiając następujące polecenie z katalogu
functions
:npm install express --save
Otwórz plik
/functions/index.js
, a następnie zaimportuj i zainicjuj Express.js:const functions = require('firebase-functions'); const express = require('express'); const app = express();
Dodaj te 2 punkty końcowe:
Dodaj pierwszy punkt końcowy, aby udostępniać indeks naszej witryny pod adresem
/
.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>`); });
I kolejny punkt końcowy do zwrócenia liczby
BONG
jako interfejsu API w formacie JSON w formacie „/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)}); });
Wyeksportuj aplikację Express.js jako funkcję HTTPS:
exports.app = functions.https.onRequest(app);
W pliku
firebase.json
skieruj wszystkie żądania do funkcjiapp
. Dzięki temu skryptowi Express.js może obsługiwać inną ścieżkę podrzędną skonfigurowane (w tym przykładzie są to/
i/api
).{ "hosting": { // ... // Add the "rewrites" attribute within "hosting" "rewrites": [ { "source": "**", "function": "app" } ] } }
Dodaj oprogramowanie pośredniczące
Używając kodu Express.js, możesz dodać kod Oprogramowanie pośredniczące Express.js w typowy sposób. Możesz na przykład włączyć CORS w naszych punktach końcowych.
Zainstaluj oprogramowanie pośredniczące
cors
, uruchamiając to polecenie:npm install --save cors
Otwórz plik
/functions/index.js
, a następnie dodajcors
do aplikacji Express.js np.:const cors = require('cors')({origin: true}); app.use(cors);
Zapoznaj się z dokumentacją Cloud Functions. .
Dalsze kroki
Skonfiguruj buforowanie treści dynamicznej w globalnej sieci CDN.
Interakcja z innymi usługami Firebase za pomocą Pakiet SDK Firebase Admin.