【Express.js】PUGでサーバーサイドの環境変数を参照する

はじめに

PUGなどのフロントサイドのファイル内でサーバーサイドの環境変数を参照したい時に使える豆知識です。

前提条件

• dotenvがインストールされていること
• 環境変数ファイル（.envなど）で適当な値が宣言されていること

実装

Express.jsのapp.localsオブジェクトを使用します。

app.localsオブジェクトは、アプリケーション内のローカル変数である特性を持っており、一度設定されると、app.localsプロパティの値は、リクエストの存続期間中のみ有効なres.localsプロパティとは対照的に、アプリケーションの存続期間を通じて存続します。

簡単にいうと、アプリケーションレベルの環境変数を管理するので、PUGからも参照できるということです。

詳しくは公式ドキュメントを参照してください。
https://expressjs.com/en/api.html#app.locals

実装はすごく簡単です。
app.js内で下記のように宣言します。

SAMPLE_ENV='This is sample environment'

app.js

const express = require('express');
require('dotenv').config();

const app = express();
app.locals.SAMPLE_ENV = process.env.SAMPLE_ENV;

あとはPUGのなかでSAMPLE_ENVで呼び出すことができます。

sample.pug

p 結果 ： #{SAMPLE_ENV}

出力結果

結果 ： This is sample environment