Integracja innych platform z Express.js

Po wprowadzeniu dodatkowych ustawień możesz rozbudować podstawową funkcję wiersza poleceń obsługującą frameworki, aby rozszerzyć obsługę integracji na frameworki inne niż Angular i Next.js.

Udostępnianie treści statycznych

Zanim wdrożysz treści statyczne, musisz skonfigurować aplikację.

Skonfiguruj

Aby wiedzieć, jak wdrożyć aplikację, interfejs wiersza poleceń Firebase musi mieć możliwość zarówno jej skompilowania, jak i określenia, gdzie narzędzia umieszczają zasoby przeznaczone dla Hosting. Jest to realizowane za pomocą skryptu kompilacji npm i dyrektywy katalogów CJS w package.json.

Biorąc pod uwagę ten plik package.json:

{
    "name": "express-app",
    "version": "0.0.0",
    "scripts": {
        "build": "spack",
        "static": "cp static/* dist",
        "prerender": "ts-node prerender.ts"
    },
    …
}

Interfejs wiersza poleceń Firebase wywołuje tylko skrypt kompilacji, więc musisz się upewnić, że jest on wyczerpujący.

{
    "name": "express-app",
    "version": "0.0.0",
    "scripts": {
        "build": "spack && npm run static && npm run prerender",
        "static": "cp static/* dist",
        "prerender": "ts-node prerender.ts"
    },
    …
}

Jeśli Twój framework nie obsługuje wstępnego renderowania od razu po wyjęciu z pudełka, rozważ użycie narzędzia takiego jak Rendertron. Rendertron umożliwia wysyłanie żądań do Chrome bez interfejsu w lokalnej instancji aplikacji, dzięki czemu możesz zapisywać wynikowy kod HTML, który będzie wyświetlany w Hosting.

Różne platformy i narzędzia do kompilacji przechowują artefakty w różnych miejscach. Użyj directories.serve, aby poinformować interfejs wiersza poleceń, gdzie skrypt kompilacji zapisuje wynikowe artefakty:

{
    "name": "express-app",
    "version": "0.0.0",
    "scripts": {
        "build": "spack && npm run static && npm run prerender",
        "static": "cp static/* dist",
        "prerender": "ts-node prerender.ts"
    },
    "directories": {
        "serve": "dist"
    },
    …
}

Wdróż

Po skonfigurowaniu aplikacji możesz wyświetlać treści statyczne za pomocą standardowego polecenia wdrażania:

firebase deploy

Wyświetlanie treści dynamicznych

Aby udostępnić aplikację Express na Cloud Functions for Firebase, upewnij się, że aplikacja Express (lub moduł obsługi adresów URL w stylu Express) jest wyeksportowana w taki sposób, aby Firebase mogło ją znaleźć po spakowaniu biblioteki za pomocą npm.

Aby to zrobić, upewnij się, że dyrektywa files zawiera wszystko, co jest potrzebne serwerowi, a główny punkt wejścia jest prawidłowo skonfigurowany w files:package.json

{
    "name": "express-app",
    "version": "0.0.0",
    "scripts": {
        "build": "spack && npm run static && npm run prerender",
        "static": "cp static/* dist",
        "prerender": "ts-node tools/prerender.ts"
    },
    "directories": {
        "serve": "dist"
    },
    "files": ["dist", "server.js"],
    "main": "server.js",
    ...
}

Wyeksportuj aplikację Express z funkcji o nazwie app:

// server.js
export function app() {
  const server = express();
   …
   return server;
}

Jeśli wolisz wyeksportować moduł obsługi adresów URL w stylu Express, nadaj mu nazwę handle:

export function handle(req, res) {
   res.send(‘hello world’);
}

Wdróż

firebase deploy

Spowoduje to wdrożenie treści statycznych w usłudze Firebase Hosting i umożliwi Firebase powrót do aplikacji Express hostowanej w usłudze Cloud Functions for Firebase.

Opcjonalnie: integracja z Uwierzytelnianiem Firebase

Narzędzia do wdrażania Firebase, które są dostosowane do platform internetowych, automatycznie synchronizują stan klienta i serwera za pomocą plików cookie. Aby uzyskać dostęp do kontekstu uwierzytelniania, obiekt Express res.locals może opcjonalnie zawierać uwierzytelnioną instancję aplikacji Firebase (firebaseApp) i aktualnie zalogowanego użytkownika (currentUser).