Node.js+Express(二)フロントフォームデータの取得
1842 ワード
GET/POST Requestから値を取ってフォームデータを取得する
個人的な好みでプロジェクトのデフォルトで使用されるjadeテンプレートをejsに変更し、ビューをhtmlに変更します.
一、ビューエンジンをejsに変更する
1.ejsコンポーネントをインストールして生成したeasyappプロジェクトディレクトリに入り、端末はコマンドを入力する:
npm install ejs --save
2.app.jsスクリプトの変更
自動生成app.jsスクリプトで先頭に追加
デフォルトのエンジンコードは次のとおりです.
次のように変更します.
これでビューエンジンの変更が完了しました
フロントフォームデータの取得
プロジェクトディレクトリは次のとおりです.
1.htmlテストドキュメントviewsのjadeファイルを作成するには、一律に削除してindex.htmlの例を追加します.
2.app.jsにコードを追加
set DEBUG=myapp&npm startコマンドを入力し、ブラウザでhttp://localhost:3000/ウェブサイトでテスト可能
個人的な好みでプロジェクトのデフォルトで使用されるjadeテンプレートをejsに変更し、ビューをhtmlに変更します.
一、ビューエンジンをejsに変更する
1.ejsコンポーネントをインストールして生成したeasyappプロジェクトディレクトリに入り、端末はコマンドを入力する:
npm install ejs --save
2.app.jsスクリプトの変更
自動生成app.jsスクリプトで先頭に追加
var ejs = require('ejs');
デフォルトのエンジンコードは次のとおりです.
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');
次のように変更します.
// view engine setup
// ejs
app.engine('html', ejs.__express);
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'html');
これでビューエンジンの変更が完了しました
フロントフォームデータの取得
プロジェクトディレクトリは次のとおりです.
.
├── app.js
├── bin
│ └── www
├── package.json
├── public
│ ├── images
│ ├── javascripts
│ └── stylesheets
│ └── style.css
├── routes
│ ├── index.js
│ └── users.js
└── views
├── error.jade
├── index.jade
└── layout.jade
1.htmlテストドキュメントviewsのjadeファイルを作成するには、一律に削除してindex.htmlの例を追加します.
Document
2.app.jsにコードを追加
app.post('/test', function(req, res) {
console.log(req.body.name);
console.log(req.body.tel);
});
set DEBUG=myapp&npm startコマンドを入力し、ブラウザでhttp://localhost:3000/ウェブサイトでテスト可能