Интегрируйте другие платформы с Express.js

С помощью дополнительной настройки вы можете расширить базовую функциональность CLI, учитывающую особенности фреймворков, и добавить поддержку интеграции с фреймворками, отличными от Angular и Next.js.

Предоставлять статический контент

Перед развертыванием статического контента необходимо настроить приложение.

Настройка

Для того чтобы знать, как развернуть ваше приложение, Firebase CLI должен уметь как собирать ваше приложение, так и знать, куда ваши инструменты размещают ресурсы, предназначенные для Hosting . Это достигается с помощью скрипта сборки npm и директивы каталогов CJS в package.json .

Учитывая следующий файл package.json:

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

Интерфейс командной строки Firebase вызывает только ваш скрипт сборки, поэтому вам необходимо убедиться, что ваш скрипт сборки является исчерпывающим.

{
    "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"
    },
    …
}

Если ваш фреймворк не поддерживает предварительную отрисовку по умолчанию, рассмотрите возможность использования такого инструмента, как Rendertron . Rendertron позволит вам отправлять запросы в Chrome без графического интерфейса к локальному экземпляру вашего приложения, чтобы вы могли сохранить полученный HTML-код для последующей отгрузки на Hosting .

Наконец, разные фреймворки и инструменты сборки хранят свои артефакты в разных местах. Используйте directories.serve , чтобы указать CLI, куда ваш скрипт сборки выводит результирующие артефакты:

{
    "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"
    },
    …
}

Развертывать

После настройки приложения вы можете предоставлять статический контент с помощью стандартной команды развертывания:

firebase deploy

Предоставлять динамический контент

Чтобы запустить ваше приложение Express в Cloud Functions for Firebase , убедитесь, что ваше приложение Express (или обработчик URL-адресов в стиле Express) экспортировано таким образом, чтобы Firebase мог найти его после того, как ваша библиотека будет упакована с помощью npm.

Для этого убедитесь, что директива 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",
    ...
}

Экспортируйте ваше приложение Express из функции с именем app :

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

Или, если вы предпочитаете экспортировать обработчик URL-адресов в стиле Express, назовите его handle :

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

Развертывать

firebase deploy

Это развернет ваш статический контент на Firebase Hosting и позволит Firebase в случае необходимости использовать ваше приложение Express, размещенное на Cloud Functions for Firebase .

Дополнительно: интеграция с Firebase Authentication

Инструменты развертывания Firebase, поддерживающие веб-фреймворки, автоматически синхронизируют состояние клиента и сервера с помощью файлов cookie. Для доступа к контексту аутентификации объект Express res.locals может содержать аутентифицированный экземпляр приложения Firebase ( firebaseApp ) и текущего вошедшего в систему пользователя ( currentUser ).