node.jsでローカルサーバーを立ててapacheのSSIを再現する

以前、Macのapacheを使ってバーチャルホストとSSIの設定という記事を書きましたが、node.jsでローカルサーバーを立ててSSIを再現できたのでメモ。
実際にapacheでやっている訳ではないのでSSI以外のapacheの機能は使えませんが、SSIさえできればいいのであればこっちのほうが手軽で調子いいです。

connectを使ってローカルサーバーを立てる

まず初めにconnectを使用してローカルサーバーを立てます。

server.js

var connect = require('connect'),
    serveStatic = require('serve-static'),
    baseDir = __dirname + '/htdocs';

var app = connect();

app.use(serveStatic(baseDir));
app.listen(3000);

node server.jsでローカルサーバーが立ち上がってhttp://localhost:3000にアクセスするころができるようになります。baseDirでhtdocsディレクトリをドキュメントルートに指定しています。

connect-ssiでSSIを再現する

connectにはMiddlewareというプラグイン的な仕組みがあり、connect-ssiはssiを再現するためのMiddlewareです。因みに先ほどのコードにでてきたserve-staticもMiddlewareで、静的ファイルの配信を行うために必要みたいです。

それでは先ほどのコードにconnect-ssiをMiddlewareとして使うコードを追加します。

server.js

var connect = require('connect'),
    serveStatic = require('serve-static'),
    connectSSI = require('connect-ssi'),
    baseDir = __dirname + '/htdocs';

var app = connect();

app.use(connectSSI({
    baseDir: baseDir,
    ext: '.html'
}));
app.use(serveStatic(baseDir));
app.listen(3000);

baseDirでドキュメントルートの指定をして、extでインクルードファイルの拡張子の指定をします。

試しに以下のような構成で

htdocs/
├ index.html
├ inc.html

以下のようにSSIの記述をindex.htmlに書き、再度http://localhost:3000にアクセスすると無事SSIが再現できているかと思います。

<!--#include virtual="/inc.html"-->

このやり方だとSSIできる環境ごと共有できるし、何より手軽でいいですね〜

コードはGithubにあげてます。

参考記事

Connectを使った静的ファイル配信サーバが動かなくなった

【gulp】BrowserSyncでSSIを使う方法についてメモメモ