@astrojs/ node

このアダプターを使用すると、Astroでオンデマンドでレンダリングされたルートと機能をNodeターゲットにデプロイできます。これには、サーバーアイランド、アクション、セッションが含まれます。

Astroを静的サイトビルダーとして使用している場合、アダプターは必要ありません。

Astro Node.jsを選ぶ理由

Node.jsは、サーバーサイドコード用のJavaScriptランタイムです。@astrojs/nodeは、スタンドアロンモードまたはExpressなどの他のhttpサーバーのミドルウェアとして使用できます。

インストール

Astroには、公式インテグレーションのセットアップを自動化するためのastro addコマンドが含まれています。もしよろしければ、手動でインテグレーションをインストールすることもできます。

astro addコマンドでNodeアダプターを追加して、Astroプロジェクトでオンデマンドレンダリングを有効にします。 これにより、@astrojs/nodeがインストールされ、astro.config.*ファイルに適切な変更が一度に行われます。

npm

npx astro add node

pnpm

pnpm astro add node

Yarn

yarn astro add node

これで、ページごとにオンデマンドレンダリングを有効にするか、ビルド出力設定をoutput: 'server'に設定してデフォルトですべてのページをサーバーレンダリングすることができます。

手動インストール

まず、お好みのパッケージマネージャーを使用して、Nodeアダプターをプロジェクトの依存関係に追加します。

npm

npm install @astrojs/node

pnpm

pnpm add @astrojs/node

Yarn

yarn add @astrojs/node

次に、アダプターをastro.config.*ファイルに追加します。

astro.config.mjs

import { defineConfig } from 'astro/config';
import node from '@astrojs/node';

export default defineConfig({
  adapter: node({
    mode: 'standalone',
  }),
});

設定

@astrojs/nodeは、アダプター関数にオプションを渡すことで設定できます。次のオプションが利用可能です。

mode

Type: 'middleware' | 'standalone'

アダプターがmiddlewareモードとstandaloneモードのどちらでビルドするかを制御します。

• middlewareモードでは、ビルドされた出力をExpress.jsやFastifyなどの別のNode.jsサーバーのミドルウェアとして使用できます。
• standaloneモードでは、エントリモジュールが実行されると自動的に起動するサーバーがビルドされます。これにより、追加のコードを必要とせずに、ビルドをホストに簡単にデプロイできます。

astro.config.mjs

import { defineConfig } from 'astro/config';
import node from '@astrojs/node';

export default defineConfig({
  adapter: node({
    mode: 'middleware',
  }),
});

staticHeaders

Type: boolean
Default: false

追加： @astrojs/node@10.0.0

有効にすると、コンテンツセキュリティポリシーなどのAstroの機能から提供される場合に、アダプターはプリレンダリングされたページのヘッダーをResponseオブジェクトを使って配信します。

たとえば、コンテンツセキュリティポリシー (EN)を有効にしている場合、staticHeadersを使うと、<meta>要素を作成する代わりにCSPヘッダーをResponseオブジェクトに追加できます。

astro.config.mjs

import { defineConfig } from 'astro/config';
import node from '@astrojs/node';

export default defineConfig({
  security: {
    csp: true
  },
  adapter: node({
    mode: 'standalone',
    staticHeaders: true,
  })
});

experimentalDisableStreaming

Type: boolean
Default: false

追加： @astrojs/node@9.3.0

オンデマンドレンダリングされるページに対して、AstroのデフォルトのHTMLストリーミングを無効にします。

HTMLストリーミングはパフォーマンスの向上に役立ち、一般的に訪問者により良い体験を提供します。ほとんどの場合、ストリーミングを無効にすることは推奨されません。

ただし、HTMLストリーミングを無効にする必要がある場合（たとえば、ホスティング環境がCDNレベルで非ストリーミングのHTMLキャッシュのみをサポートしている場合など）は、デフォルトの動作をオプトアウトできます。

astro.config.mjs

import { defineConfig } from 'astro/config';
import node from '@astrojs/node';

export default defineConfig({
  adapter: node({
    mode: 'standalone',
    experimentalDisableStreaming: true,
  }),
});

bodySizeLimit

Type: number
Default: 1073741824 (1 GB)

追加： @astrojs/node@10.0.0

リクエストボディの最大許容サイズをバイト単位で設定します。受信したリクエストのボディがこの上限を超えると、ボディの読み取り時にエラーがスローされます。

Infinityまたは0を設定すると、上限を完全に無効にできます。これは、動画のアップロードなど、非常に大きなリクエストボディを受け付ける必要がある場合に役立ちます。

astro.config.mjs

import { defineConfig } from 'astro/config';
import node from '@astrojs/node';

export default defineConfig({
  adapter: node({
    mode: 'standalone',
    bodySizeLimit: 5 * 1024 * 1024 * 1024, // 5 GB
  }),
});

使い方

まず、ビルドを実行します (EN)。選択したmode（上記参照）に応じて、以下の適切な手順に従ってください。

ミドルウェア

サーバーのエントリポイントは、デフォルトで./dist/server/entry.mjsにビルドされます。このモジュールは、Nodeのrequestおよびresponseオブジェクトをサポートする任意のフレームワークで使用できるhandler関数をエクスポートします。

たとえば、Expressでは次のようになります。

run-server.mjs

import express from 'express';
import { handler as ssrHandler } from './dist/server/entry.mjs';

const app = express();
// これをastro.config.mjsの`base`オプションに基づいて変更します。
// それらは一致する必要があります。デフォルト値は「/」です。
const base = '/';
app.use(base, express.static('dist/client/'));
app.use(ssrHandler);

app.listen(8080);

または、Fastify（>4）では次のようになります。

run-server.mjs

import Fastify from 'fastify';
import fastifyMiddie from '@fastify/middie';
import fastifyStatic from '@fastify/static';
import { fileURLToPath } from 'node:url';
import { handler as ssrHandler } from './dist/server/entry.mjs';

const app = Fastify({ logger: true });

await app
  .register(fastifyStatic, {
    root: fileURLToPath(new URL('./dist/client', import.meta.url)),
  })
  .register(fastifyMiddie);
app.use(ssrHandler);

app.listen({ port: 8080 });

さらに、Astro.localsまたはAstroミドルウェアでアクセスするオブジェクトを渡すこともできます。

run-server.mjs

import express from 'express';
import { handler as ssrHandler } from './dist/server/entry.mjs';

const app = express();
app.use(express.static('dist/client/'));
app.use((req, res, next) => {
  const locals = {
    title: 'New title',
  };

  ssrHandler(req, res, next, locals);
});

app.listen(8080);

ミドルウェアモードではファイルを提供しないことに注意してください。HTTPフレームワークを設定して、ファイルを提供するようにする必要があります。デフォルトでは、クライアントアセットは./dist/client/に書き込まれます。

スタンドアロン

スタンドアロンモードでは、サーバーのエントリポイントが実行されるとサーバーが起動します。デフォルトでは、./dist/server/entry.mjsにビルドされます。次のように実行できます。

node ./dist/server/entry.mjs

スタンドアロンモードの場合、サーバーはページとAPIルートに加えてファイルの提供を処理します。

カスタムホストとポート

実行時に環境変数として渡すことで、スタンドアロンサーバーが実行されるホストとポートを上書きできます。

HOST=0.0.0.0 PORT=4321 node ./dist/server/entry.mjs

HTTPS

デフォルトでは、スタンドアロンサーバーはHTTPを使用します。これは、HTTPSを実行するプロキシサーバーがその前にある場合にうまく機能します。スタンドアロンサーバー自体でHTTPSを実行する必要がある場合は、SSLキーと証明書を提供する必要があります。

環境変数SERVER_CERT_PATHおよびSERVER_KEY_PATHを介してキーと証明書へのパスを渡すことができます。bashでそれらを渡す方法は次のとおりです。

SERVER_KEY_PATH=./private/key.pem SERVER_CERT_PATH=./private/cert.pem node ./dist/server/entry.mjs

アセット

スタンドアロンモードでは、dist/client/フォルダー内のアセットはスタンドアロンサーバーを介して提供されます。これらのアセットをCDNにデプロイしている場合があり、その場合、サーバーは実際にはそれらを提供しません。しかし、イントラネットサイトなどの場合によっては、アプリケーションサーバーから直接静的アセットを提供しても問題ありません。

dist/client/_astro/フォルダー内のアセットは、Astroがビルドしたものです。これらのアセットはすべてハッシュで名前が付けられているため、長いキャッシュヘッダーを付けることができます。内部的に、アダプターはこれらのアセットにこのヘッダーを追加します。

Cache-Control: public, max-age=31536000, immutable

セッション

Astro Sessions APIを使用すると、リクエスト間でユーザーデータを簡単に保存できます。これは、ユーザーデータや設定、ショッピングカート、認証情報などに使用できます。Cookieストレージとは異なり、データにサイズ制限はなく、別のデバイスで復元できます。

Astroは、Nodeアダプターを使用する場合、セッションストレージにローカルファイルシステムを使用します。別のセッションストレージドライバーを使用したい場合は、Astro設定で指定できます。詳細については、 session設定リファレンス (EN)を参照してください。

環境変数

ランタイムでastro:envのシークレットやprocess.envを使用する場合、Astroもアダプターも環境変数を自動的に読み込みません。

一部のホストでは、ダッシュボードで設定した環境変数がビルド時およびランタイムに公開される場合があります。各プラットフォームでの環境変数の設定と使用方法については、ホストのドキュメントを確認してください。

セルフホスティングの場合は、CLIコマンドや設定ファイルを使用して環境変数を読み込めます。

Inline

DB_HOST=... DB_PASSWORD=... node ./dist/server/entry.mjs

dotenvx

npx @dotenvx/dotenvx run -- node ./dist/server/entry.mjs

Docker

Dockerfile

FROM node:lts AS runtime
WORKDIR /app

COPY . .

RUN npm install
RUN npm run build

ENV DB_HOST=...
ENV DB_PASSWORD=...
CMD node ./dist/server/entry.mjs

他のインテグレーション

UIフレームワーク

• 

  @astrojs/alpinejs

• 

  @astrojs/preact

• 

  @astrojs/react

• 

  @astrojs/solid⁠-⁠js

• 

  @astrojs/svelte

• 

  @astrojs/vue

SSRアダプター

• 

  @astrojs/cloudflare

• 

  @astrojs/netlify

• 

  @astrojs/node

• 

  @astrojs/vercel

その他

• 

  @astrojs/markdoc

• 

  @astrojs/mdx

• 

  @astrojs/partytown

• 

  @astrojs/sitemap