hapijsでプロフィールをアップロード17.0

Question

私はhapijsバージョン17.0.1を使用しています。私はhapijsルート上でajaxリクエストを使って画像をアップロードしようとしています。ここでは、プロファイルの写真をアップロードするために私のAJAXコードは次のとおりです。

var image_file_input = document.getElementById("user_profile_upload"); 

image_file_input.onchange = function() { 
    if(this.files != undefined) 
    { 
     if(this.files[0] != undefined) 
     { 
      var formData = tests.formdata ? new FormData() : null; 
      if (tests.formdata) 
      { 
       //alert(file) 
       formData.append('image_file', this.files[0]); 
       formData.append('userId', user_id); 
       formData.append('memberId', member_id); 
      } 
      $.ajax({ 
       url: "/v1/User/uploadUserPic", 
       data: formData, 
       type: "POST", 
       dataType: "json", 
       contentType: false, 
       processData: false, 
       contentType: "multipart/form-data", 
       success: function(data){ 
        console.log(data); 
        var errMsg = null; 
        var resData = null; 
        if(data.statusCode == 200) 
        { 
         resData = data.result; 
        } 
        else 
        { 
         alert(data.message) 
        } 
       }, 
       error: function(error){ 
        alert(error); 
       } 
      }); 
     } 
    } 
} 

そして、ここでは私のHapijsルートコードは次のとおりです。

var uploadUserPic = { 
     method: 'POST', 
     path: '/v1/Module/uploadUserPic', 
     config: { 
      description: 'Update Image For User', 
      tags: ['api', 'User'], 
      auth: 'session', 
      payload: { 
       output: 'stream', 
       parse: true, 
       allow: 'multipart/form-data' 
      }, 
      validate: { 
       payload: { 
        userId : Joi.string().regex(/^[a-f\d]{24}$/i).required(), 
        memberId: Joi.string().required(), 
        image_file: Joi.object().required(), 
       }, 
       failAction: FailCallBack 
      } 
     }, 
     handler: function (request, reply) { 
      var resultData = null; 
      var error = null; 
      return new Promise(function (resolve) { 
       var multiparty = require('multiparty'); 
       var fs = require('fs'); 
       var form = new multiparty.Form(); 
       form.parse(request.payload, function (err, fields, files) { 
        if(err) 
        { 
         error = err; 
         resolve(); 
        } 
        else 
        { 
         var mkdirp = require('mkdirp'); 
         var img_dir = "./files/users/"; 
         mkdirp(img_dir, function (err) { 
          if (err) 
          { 
           error = err; 
           console.error(err); 
           resolve(); 
          } 
          else 
          { 
           var oldpath = files.image_file.path; 
           var newpath = "./files/users/"+requestPayload.userId+".png"; 
           fs.rename(oldpath, newpath, function (err) { 
            if(err) 
            { 
             error = err; 
            } 
            resolve(); 
           }); 
          } 
         }); 
        } 
       }); 
      }).then(function (err, result) { 
       if(err) return sendError(err); 
       if(error) return sendError(error) 
       return { 
        "statusCode": 200, 
        "success": true 
       }; 
      }); 
     } 
    } 

上記のコードは、行form.parse(request.payload, function (err, fields, files) {});

上のエラーcannot read property 'content-length' of undefined次は私を与える私を聞かせてください。私が何か間違っているかどうかを知る。私がphpで書いたanohterのURLでajaxリクエストのurlを置き換えると、それは完全に動作します。これは私のhapijs/nodejsコードで何かが間違っていることを意味します。

Answer 1

Hapi.jsでファイルのアップロードを処理する方法には良いポスト（バージョン16で書かれた）https://scotch.io/bar-talk/handling-file-uploads-with-hapi-js

あなたがpayload.parse = trueを使用しているので、私はあなたがmultipartyを使用する必要がなぜ特定の理由を見ていないですがあります。私は、サーバー上のアップロードディレクトリにクライアントからアップロード（任意の型の）ファイルを救う、次の作業のコード（何の衛生が行われないよう、生産に直接使用しないでください）

 { 
      path: '/upload', 
      method: 'POST', 
      config: { 
       payload: { 
        output: 'stream', 
        parse: true, 
        allow: 'multipart/form-data' 
       }, 
       validate: { 
        payload: { 
         files: Joi.array().single() 
        } 
       } 
      }, 
      handler: function(request) { 
       const p = request.payload, files = p.files 
       if(files) { 
        console.log(`${files.length} files`) 
        files.forEach(async file => { 
         const filename= file.hapi.filename 
         console.log(`Saving ${filename} to ./uploads`) 
         const out = fs.createWriteStream(`./uploads/${filename}`) 
         await file.pipe(out) 
        }) 
       } 
       return {result: 'ok'} 
      } 
     } 

を持っているあなたは、以下を使用することができますテストするカールコマンド

curl http://localhost:8080/upload -F 'files=@/path/to/a/note.txt' -F 'files=@/path/to/test.png' -vvv 

コードにはいくつか問題があります。最初の$.ajaxコールでは、contentTypeを2回指定しましたが、構文エラーではありませんが、そのようなコードは不注意です。次に、.then（）ブロック内の関数の署名が正しくありません。プロミスとコールバックのアイデアが混ざり合っています。私は次の行が

 if(err) return sendError(err); 

一つをトリガされます最後の些細な事、あなたはハピ17を使用していると述べたが、ハンドラ関数のシグネチャに基づいて

handler: function (request, reply) { 
... 

は、あなたが完全にオンボードでないようだとは思いません新しい署名としてHapi17で

handler: function (request, h) { 

あり、それはhにreplyだけの名前の変更はありません。