Integracja innych platform z Express.js

Po wykonaniu dodatkowej konfiguracji możesz rozszerzyć podstawową funkcjonalność interfejsu wiersza poleceń, która uwzględnia frameworki, aby obsługiwać integrację z innymi frameworkami niż Angular i Next.js.

Obsługa 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 utworzenia, jak i określenia, gdzie narzędzia umieszczają zasoby przeznaczone do Hosting. Odbywa się to za pomocą skryptu kompilacji npm i dyrektywy katalogów CJS w pliku 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, rozważ użycie narzędzia takiego jak Rendertron. Rendertron umożliwi Ci wysyłanie żądań do lokalnej instancji aplikacji za pomocą przeglądarki Chrome bez interfejsu , dzięki czemu możesz zapisać wynikowy kod HTML, który będzie obsługiwany w ramach Hosting.

Na koniec różne frameworki i narzędzia do kompilacji przechowują swoje 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 obsługiwać treści statyczne za pomocą standardowego polecenia wdrożenia:

firebase deploy

Obsługa treści dynamicznych

Aby obsługiwać aplikację Express w Cloud Functions for Firebase, upewnij się, że aplikacja Express (lub moduł obsługi adresów URL w stylu Express) jest eksportowana 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 do działania serwera, a główny punkt wejścia jest prawidłowo skonfigurowany w pliku 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 Firebase Hosting i umożliwi Firebase powrót do aplikacji Express hostowanej w Cloud Functions for Firebase.

Opcjonalnie: integracja z Uwierzytelnianiem Firebase

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