過去バージョン

この本文には実行可能なタグ等が含まれるため、安全のためHTMLソースとして表示しています。本文データは変更していません。

<h2>前提</h2>

<p>・<a href="https://jpn.itlibra.com/article?id=10734">Express</a>をインストール済み</p>

<p>・<a href="https://jpn.itlibra.com/article?id=20984">EJS</a>をインストール済み</p>

<p>・<span style="color:#e74c3c">EJSファイルはviewsフォルダ配下に作成すること</span>(Expressのお作法)</p>

<p>&nbsp;</p>

<h2>Express側の記述</h2>

<table border="1" cellpadding="1" cellspacing="1" style="width:500px">
	<thead>
		<tr>
			<th scope="col" style="background-color:#ffffff">server.js</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td style="background-color:#000000">
			<p><span style="color:#ffffff">var express = </span><span style="color:#f1c40f">require('express')</span><span style="color:#ffffff">;<br />
			var app = </span><span style="color:#f1c40f">express()</span><span style="color:#ffffff">;<br />
			var ejs = </span><span style="color:#2ecc71">require('ejs')</span><span style="color:#ffffff">;</span></p>

			<p><span style="color:#f1c40f">app.engine(</span><span style="color:#2ecc71">'ejs', ejs.renderFile</span><span style="color:#f1c40f">)</span><span style="color:#ffffff">;</span></p>

			<p><span style="color:#f1c40f">app.get</span><span style="color:#ffffff">('/', function(req, res) {<br />
			&nbsp; &nbsp; res.render(</span><span style="color:#2ecc71">'test.ejs'</span><span style="color:#ffffff">, {<br />
			&nbsp; &nbsp; &nbsp; &nbsp; </span><span style="color:#e74c3c">key1</span><span style="color:#ffffff">: 'val1'&nbsp;<br />
			&nbsp; &nbsp; });<br />
			});</span></p>

			<p><span style="color:#ffffff">var server = </span><span style="color:#f1c40f">app.listen</span><span style="color:#ffffff">(8000, function(){<br />
			&nbsp; &nbsp; console.log('サーバー起動中...');<br />
			})</span><br />
			&nbsp;</p>
			</td>
		</tr>
	</tbody>
</table>

<p>&nbsp;</p>

<h2>EJS側の記述</h2>

<table border="1" cellpadding="1" cellspacing="1" style="width:500px">
	<thead>
		<tr>
			<th scope="col" style="background-color:#ffffff">views/test.ejs</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td style="background-color:#000000">
			<p><span style="color:#ffffff"><html><br />
			&nbsp; &nbsp; <head><br />
			&nbsp; &nbsp; &nbsp; &nbsp; <meta charset='utf-8'><br />
			&nbsp; &nbsp; </head><br />
			&nbsp; &nbsp; <body></span></p>

			<p><span style="color:#ffffff">&nbsp; &nbsp; &nbsp; &nbsp; <p></span><span style="color:#2ecc71"><%=</span><span style="color:#ffffff"> </span><span style="color:#e74c3c">key1</span><span style="color:#ffffff"> </span><span style="color:#2ecc71">%></span><span style="color:#ffffff"></p></span></p>

			<p><span style="color:#ffffff">&nbsp; &nbsp; </body><br />
			</html></span></p>
			</td>
		</tr>
	</tbody>
</table>

<p>&nbsp;</p>

<h2>サーバーの起動</h2>

<table border="1" cellpadding="1" cellspacing="1" style="width:1000px">
	<tbody>
		<tr>
			<td style="background-color:#000000">
			<p><span style="color:#ffffff">node server.js</span></p>
			</td>
		</tr>
	</tbody>
</table>

<p>&nbsp;</p>

<h2>出力結果</h2>

<p>val1</p>