ローカルで使用するためのWebページを作成しました。以下に示すようなルートがたくさんあり.ejs
ます。31ファイルと3.html
ファイルです。(それらはすべて同じ「ビュー」フォルダーにあります)。
//app.js - using node and express
app.get('/page1', function(req, res){
res.render('page1');
});
app.get('/page2', function(req, res){
res.sendFile('views/page2.html', { root: __dirname });
});
私app.get
はこれらのファイルのすべてにを使用します。DRYコードではないと感じていたので、今は同じ結果を達成するためのよりエレガントで最適な方法を見つけようとしています。
多くres.sendFile();
は単一のexpress.static()
ミドルウェアステートメントに置き換えることができることを私は知っています。私は通常、express.static()
すべてのcssファイルを保存するために使用する「パブリック」フォルダーで使用します-このようにapp.use(express.static(path.join(__dirname, 'public')));
。しかし、これを使用してすべてを単純化する方法がまだわかりませんres.sendFile()
。
多くのres.render();
ルートについては、カスタマイズされたデータを渡さなければ、テンプレートファイルのディレクトリ全体(および対応するルート)またはファイルのリストを処理する単一のミドルウェアに置き換えることができることを私は知っています。どうすればいいのかわからない。
どんな助けでも大歓迎です、ありがとう!
- リッチー
- node_modules
- 公衆
- cssファイル、画像など
- ビュー
- パーシャル
- すべての部分ファイル
- プログラミングパブリック
- 同じトピックのすべてのejsファイル
- その他のファイル(htmlおよびその他のejs)
- appjs
- packagejson
- パッケージ-lockjson
const express = require('express');
const bodyParser = require('body-parser');
const path = require('path');
const app = express();
// Body Parser Middleware
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));
// engine
app.set("view engine", "ejs");
// Set static path
app.use(express.static(path.join(__dirname, 'public')));
const fs = require('fs');
function renderStatic(dir) {
return function(req, res, next) {
let target = path.join(dir, req.path);
fs.access(target, fs.constants.R_OK, function(err) {
if (err) {
// file not found, just move on
next();
} else {
res.render(target);
}
});
}
}
app.use(renderStatic(path.join(__dirname, "views/programmingPublic")));
以下は私のサイドメニューのフォーマットです:(これらのファイルはすべて "programmingPublic"フォルダー内にあります)
<a href="/programming" class="title">Programming</a>
<li><a href="/c">C</a></li>
<li><a href="/cpp">C++</a></li>
<li><a href="/python">Python</a></li>
<li><a href="/javascript">JavaScript</a></li>
<li><a href="/php">PHP</a></li>
を呼び出す必要があるページがたくさんあるが、res.render()
各レンダリングにカスタムオプションを渡していない場合は、それらすべてのテンプレートを独自のディレクトリに分離してから、次のようなミドルウェアを使用できます。
const path = require('path');
const fs = require('fs');
function renderStatic(dir, options) {
const regex = /^\.|\.\.|\/\.|\\\./;
options = options || {};
return function(req, res, next) {
let target = path.join(dir, req.path);
if (options.ext && !path.extname(target)) {
target = target + options.ext;
}
// don't allow leading dot or double dot anywhere in the path
if (regex.test(target)) {
next();
return;
}
fs.access(target, fs.constants.R_OK, function(err) {
if (err) {
// file not found, just move on
next();
} else {
res.render(target);
}
});
}
}
app.use(renderStatic(path.join(__dirname, "renderPublic"), {ext: ".ejs"}));
他のファイルがそこに見つからないように、これらのテンプレートファイルを独自のディレクトリに分離する必要があることに注意してください。
安全性の完全を期すため、このコードはまた、フィルタリングする必要がある.
と..
のようなパスに項目をexpress.static()
レンダリングする静的なディレクトリ内以外のファイルへのアクセスを得るためにあなたのディレクトリ階層を上がってから攻撃を防ぐために行います。
次に、使用しているルートでres.sendFile()
他のロジックがない場合は、それらのHTMLファイルを独自のディレクトリに分離し、そのディレクトリをポイントexpress.static()
します。次に、express.static()
ミドルウェアはそのディレクトリで一致するHTMLファイルを見つけてres.sendFile()
、CSSファイルの場合とまったく同じように自動的に実行します。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加