Express＆NodeJS：Multipartフォームからの応答パラメータへのアクセスPOST

私は、ユーザーがファイルタイプイメージをアップロードし、ラジオ入力選択を介してファイルの「カテゴリ」タイプをレスポンスボディに追加することができるシンプルなフォームを持っています。Express＆NodeJS：Multipartフォームからの応答パラメータへのアクセスPOST

ファイル処理自体は、バックエンドでは期待通りに処理されますが、応答本体のパラメータにアクセスする場合はパラメータ値としてUNDEFINEDを受け取ります。誰も私が見落としているかもしれないものについていくつかの指針を貸してくれる？ここ

は、マークアップとバックエンド・スクリプトのサンプルです：

<!DOCTYPE html> 
<html> 

    <head> 
     <script src="js/blueimp-gallery.min.js" async></script> 
     <script src="js/bootstrap.min.js" async></script> 
     <script src="https://code.jquery.com/jquery-3.1.1.min.js" async></script> 
     <script src="js/script.js" async></script> 
     <link rel="stylesheet" href="css/blueimp-gallery.min.css"> 
     <link rel="stylesheet" type="text/css" href="css/style.css" /> 
    </head> 

    <body> 


     <div id="main"> 
      <div class="navbar-wrapper" style="border: 12px solid black;"> 
       <ul> 
        <li><a href="#">Login</a></li> 
        <li><a href="#">Sign up</a></li> 
       </ul> 
      </div> 

      <div> 
       <form 
         id    = "uploadForm" 
         enctype   = "multipart/form-data" 
         action   = "/api/photo" 
         method   = "post"> 

        <input type="file" name="userPhoto" /> 
        <input type="submit" value="Upload Image" name="submit"> 

        <label>travel</label> 
        <input type="radio" value="travel"  name="cat"> 
        <label>food</label> 
        <input type="radio" value="food"  name="cat"> 
        <label>community</label> 
        <input type="radio" value="community" name="cat"> 
       </form> 
      </div> 

    </body> 
</html> 







app.post('/api/photo', function(req,res){ 

    console.log("request to upload image recvied.. upload in progress."); 
    //console.log("res.catype() = TODO " + req.get("cat")); 


    // Returning undefined* 
    console.log("res.catype() = " + res.cat); 

    // handle file persistence to disk. 
    upload(req,res,function(err) { 
     if(err) { 
      return res.end("Error uploading file."); 
     } 
     res.end("File is uploaded"); 
    }); 
});

出典

2016-12-09 Catresl

、あなたのNodeJSサーバーの代わりに、身体にパーサにMulter（またはいくつかの他の多形のパーサ）を使用する必要があります。このリンクは、これを設定する方法の例を示します。あなたのクライアント側のHTML/JSが適切にセットアップされていると仮定すると、ファイルとしてイメージを抽出し、ボディ情報として要求を抽出することができます。あなたはそれが問題を引き起こしているものを決定する際に少し役立つJavaScriptがお使いのクライアント側を投稿することができれば

app.post('/api/photo', upload.any(), function (req, res, next) { 
    var files = req.files; 
    if (files) {//Checks to see if any attached files 
     files.forEach(function (file) { 
      console.log('FILE'); 
      console.log(JSON.stringify(file));//contents of file 
      console.log(JSON.stringify(file.filename)); 
     }); 
    } 
    console.log(req.body); 
    res.sendFile(__dirname + "/resources/JSONStructures/genericResponse.json"); 
});

：

サーバーサイドNodeJSは、次のようになります。具体的には、AJAXがセットアップされていて、マルチフォームの問題を引き起こす簡単で簡単な方法がたくさんあることがわかります。

出典

2017-03-20 05:08:54 allegory

あなたはあなたの全体を投稿する場合はわからない詳細については

出典

2016-12-09 14:57:40 alpha

こんにちはアルファ、このアプローチを試みると、私は「cat」のTypeErrorを未定義としています。私はこれを前に試してみたことがあります。 – Catresl

をhttp://expressjs.com/en/4x/api.html#req.bodyを参照してください、req.body.catからあなたcat値にアクセスする必要がありますサーバーサイドのコードですが、私はbody-parserミドルウェアについて言及していません。受信した「投稿」を処理するために使用する必要があります。そして、あなたは常にあなたのルートの前にそれらを宣言する必要があります。この方法で、req.bodyでデータにアクセスできます。マルチパートフォーム（画像などの添付ファイルでフォーム）については

const bodyParser = require('body-parser'); 

app.use(bodyParser.json()); 
app.use(bodyParser.urlencoded({ extended: true })); 

app.post('/api/photo', function(req,res){ 

    console.log("request to upload image recvied.. upload in progress."); 
    //console.log("res.catype() = TODO " + req.get("cat")); 


    // Returning undefined* 
    console.log("res.catype() = " + res.cat); 

    // handle file persistence to disk. 
    upload(req,res,function(err) { 
     if(err) { 
      return res.end("Error uploading file."); 
     } 
     res.end("File is uploaded"); 
    }); 
});

出典

2016-12-09 20:08:58

Express＆NodeJS：Multipartフォームからの応答パラメータへのアクセスPOST

答えて

関連する問題