2017-09-05 30 views
1

したがって、私はexpress.jsの使い方を学ぶために小さなアプリケーションを構築しています。私は、テキストフィールドとファイルを同時に提出する、とてもシンプルなフォームを持っています。これはFormDataを介して送信されるので、バックエンドでmulterを使用してリクエストを処理しています。私がしたいのは、フォームに関するテキスト入力の検証を実行することです。は、ファイルに関する何らかのアクションを実行します(つまり、検証が成功した場合のみ保存します。何らかのエラーメッセージを送信しない場合のみ保存します)。 私は新しいexpress-validatorの構文:multerによって処理されたフォームの検証

<form id="form" method='POST' enctype='multipart/form-data'> 
     <input type='file' id='file-upload' name='file-upload' /> 
     <input type='text' id='text-upload' name='text-upload' /> 
     <input type='submit' /> 
</form> 

バックエンドそのように行うために使用:router.js

//somewhere in the router file 
import {importedController} from './controllers/importedController'; 
/* some other routes */ 
router.post('/upload', importedController.processfunction); 

importedController.js

exports.processfunction = (req, res, next) => { 
var getFields = multer().any(); 
getFields(req, res, err => { 
if (err) {return next(err);} 
req.checkBody('text-upload','must not be empty!').notEmpty(); 
//do the validation from here 
var errors = req.validationErrors(); 
if (errors) { 
    //some logic 
} else { 
    //some other stuff 
    //in both, i can access req.body and req.file to do whatever i want 
} 
}); 
} 

私ががあるように思われることが気づきましたa new syntax for express validatorなので、私はこの構文に従って、やってみました:

router.js

router.post('/upload', [ body('text-input', 'must be not empty').not().isEmpty()], importedController.processfunction); 

が、リクエストが処理されていないので、その後、私のimportedController.jsで、私が定義されてmulterれるGetFields()関数(の外検証doesntの作業は論理的と思われますまだ)。私はmulter関数の中にそれを含めるようにしようとした場合しかし、:

importedController.js

exports.processfunction = (req, res, next) => { 
var getFields = multer().any(); 
getFields(req, res, err => { 
    if (err) {return next(err);} 
    errors = validationResult(req); 
    if (!errors.isEmpty()) { 
    //actually always yields and error... 
    } else { //stuff} 
}); 
} 

をフィールドエントリが正しいですが、その後、それは常に、エラーを返します。これは、req.bodyが空の「処理されていない」reqで検証が行われたようです。コードは今すぐに動作しますが、急いではありませんが、私は後のプロジェクトのために新しい構文に従いたいと思います。 大変助かりました!

編集:私は

以下の@ gustavohenkeの答えのおかげで、処理する前にファイルをアップロードすると思われるので、コアに至るまで、私の問題は、multerモジュールの動作方法にリンクされていたことに気づいたソリューション(妥当性検査の前に来なければならない)フォームデータ - 少なくとも、multerモジュールはファイルをいつアップロードするかを制御できないように見えるので、実際に保存する前に別のミドルウェアを呼び出すことはできません。

私がやったことは、クライアント側でajaxを使用してフォームバリデータロジックでチェーンされたmulter().any()ミドルウェアに最初にフォームデータのみを保存することでした(後でファイルを保存する)。サーバーへの最初の呼び出しで返された応答に応じて、別のajaxとチェーンして最終的に別のルートにファイルをアップロードします。今回はmulter(storage: myStorage).single('myFileInputName')を使用してファイルをアップロードします。

これを考えれば、このソリューションは私が最初にやったことよりも優れているように思えます:フォーム入力が悪い場合にファイルを保存しないようにするだけでなく、入力が間違っていると重くなる)。

答えて

0

の前にのボディがmulterで処理されたとしたら、正しいと思います。

どちらの場合も、バリデータはできるだけ早く実行されます。しかし、次のような違いに注意してください:体が処理された後、あなたがレガシーAPIのために与えた例では

  • を、あなたは、内multerコールバックを検証を定義します。したがって、それは動作します。
  • ただし、チェックAPIの例では、バリッカーはと定義されています。 multerは実行する可能性があるため、常にエラーが発生します。req.bodyはまだ空です。
+1

ありがとうございました!それは私が疑っていたようでした:)私は2つの異なるルートとajaxを使って、2つの部分でフォームをアップロードするために私が見つけた回避策で自分の投稿を更新しました。担当者に「公開」してもまだあなたにアップアップをさせてはいけませんが、とにかく行ってしまいました... –

+0

ありがとう、心配しないで!エクスプレスバリデータを使用して、あなたのフィードバックを投稿してください:) – gustavohenke

関連する問題