ejsをhtmlに変換したい

node内でejsをhtmlに変換する実装を行っております。
その際の実装内容で分からないことがあり質問させて頂きました。
フォルダ構成としては下記の様になっております。

routes---index.js
|
utils---template.ejs

index.js
1const gulp = require('gulp');
2const rename = require('gulp-rename');
3const ejs = require("gulp-ejs");
4
5router.post('/', async function(req, res, next) {
6  gulp.task("ejs", (done) => {
7    gulp
8      .src("../utils/template.ejs")
9      .pipe(ejs({
10         title:"埋め込み1",
11         content:"埋め込み2",
12       }, {}, {ext:'.html'}))
13       .pipe(rename({ extname: ".html" }))
14       .pipe(gulp.dest("../utils"));
15       done();
16   });
17
18  //上記の処理後、作成したhtmlを使用して後続の処理を行いたい
19)};

ejs
1<body>
2    <h1><%= title %></h1>
3    <p><%= content %></p>
4</body>

ver
1"gulp": "^4.0.2",
2"gulp-ejs": "^5.1.0",
3"gulp-rename": "^2.0.0",

流れとしてはpostが飛んでくる→ejsをhtmlに変換→作成したhtmlを使用し後続の処理に繋げるという感じです。

分からない点としては
・埋め込み処理が上記の記述でいいのか
・gulp.taskが実行されれば自動でhtmlファイルが作成されるのか
というところです。

記事によってはコマンドをたたいて実行みたいなのもありましたが
postからの処理になるのでコマンドをたたかないで処理をしたいです...。

分かる方がいましたらご教示お願い致します。

miyabi_pudding

2020/07/27 03:38

> 流れとしてはpostが飛んでくるこれはいったいどの段での話でしょうか？ gulpでビルド後のJSでってことでしょうか？それとも、あくまでコンパイル時に適用したいということでしょうか？

hiroki88

2020/07/27 03:52

記載があいまいで申し訳ありません。あくまでコンパイル時に適用です。 postがとんできて、postの処理の中でejsをhtmlにコンパイルしたいという感じです。こちらの回答で大丈夫でしょうか?

行動規範の内容に同意します

回答1件

ベストアンサー

Gulpが完全に冗長です。
来いよベネット！Gulpなんか捨ててかかってこい！

Gulpは所謂タスクランナーであり、
gulp タスク名で実行したときに真っ先にgulpfile.jsファイルをNode.jsとして実行します。
タスクとして登録するために、gulp.taskへ処理内容を関数として次々と保存しているわけですね。

そして後から改めてgulp タスク名のタスク名の部分にふさわしいタスクだけを選んで関数実行
これがGulpコマンドの全貌です。

もしPOSTで待ち受ける仕組みを作るならgulp.taskの部分は完全に不要ですし邪魔です。
どうしてもGulpでやりたいなら、
自然の流れのgulpfile.jsを作成しておき、POSTで受け取ったらchild_process.execSyncを使ってgulpコマンドをサブプロセスで叩いて実行させる仕組みにした方が良いでしょう。

そもそもGulp流儀のよくわからんpipeを使うのは、
それがGulpタスク内だからです。

router.post('/', async fn)の部分がExpress.jsだとするならば、
Node.js標準のfsモジュールでejsファイルを文字列として受け取り
それをejsモジュールでHTML文字列に変換するだけ。

js
1const fs = require(7fs');
2const ejs = require('ejs');
3
4router.post('/', async function(req, res, next) {
5  const template = fs.readFileSync("../utils/template.ejs").toString();
6  const data = {
7    title:"埋め込み1",
8    content:"埋め込み2",
9  };
10  const html = ejs.render(template, data);
11
12  //上記の処理後、作成したhtmlを使用して後続の処理を行いたい
13)};

動作検証はしていませんが、やってる事はサンプルコードをコピペした程度なので、
エラー箇所を潰せばいけそうですね。
こっちの方が絶対にシンプルで楽じゃないかなぁと思います。

投稿2020/07/27 04:19

miyabi-sun

総合スコア21158

hiroki88

2020/07/27 05:18

ご回答いただきましてありがとうございます! gulpはgulpfile.jsを実行するんですね、今回の自分の実装の場合だとgulpを使用するのはよろしくないことがよく分かりました!! 教えて頂いたやり方で実装したいと思います! ちなみにですが、レンダリングしたものをhtml定数に入れていますがこちらを utf-8に変換する方法はありますでしょうか? もし知っていたら教えて頂きたいです...。

miyabi-sun

2020/07/27 05:28 編集

基本的にJavaScriptやNode.jsはutf-8がデフォルトの文字コードなので一気通貫してこの文字コードにするべきで、そうなっていれば文字コードの問題は一切気にする必要はありません。しかし、万が一shift-jis等でejsを作っているならば、 fsモジュールで吸い上げたejs文字列を一度shift-jisからutf-8に変換掛けてあげる必要があります。そうすりゃ後はutf-8のejsからutf-8のHTML文字列を吐き出すだけですからね。逆にshift-jisのejsを無理やりHTMLにしてから変換は厳しいかもしれませんこの文字コードの変換、Linuxではiconvというモジュールが存在し、 Node.jsで文字コードの変換がしたいなら同名の「iconv」で探せばいくつか実装が見つかります。 https://www.npmjs.com/search?q=iconv しかし、このiconvはくっそハマるので個人的には触りたくないですね。作業メンバーに土下座してでも utf-8をデフォルトにしてもらうようお願いした方が良いと思います。

hiroki88

2020/07/27 05:35

とても分かりやすく説明して頂き大変ありがとうございます!!! 非常に助かりました!!元々ejsはutf-8で作成していたので特に変換する必要がなく勝手にutf-8のhtmlを作成していることが分かりました。本当にありがとうございました!!!

行動規範の内容に同意します