2

私はこのようなマルチパート/フォームデータを経由して、いくつかのメタ情報と一緒にファイルをアップロードする必要があります。ファイルアップロードAngular2、400エラー

Header 
----boundary 
Meta 
----boundary 
File 
----boundary 

私はいつもを取得するいくつかの理由400エラー、バックエンドサーバーは、メタ -Fieldが存在しないことを通知します。しかし、私がWiresharkでHex/Asciiダンプを調べると、そのフィールドは確かにそこにあります。
次カール・コマンドが完全に正常に動作し、ファイルが正常にアップロードされます:

curl -H "Expect:" -v -i -X POST -H "Content-Type: multipart/form-data" -H "Authorization: "token" -F "[email protected]/location" -F 'Meta={"access":"token"}' http://path 

したがって、これはバックエンドの障害ではないようです。私のAngular(4.1.3)リクエストは悪くなければなりませんが、何が問題なのかわかりません。

テンプレート-コード:

<input #file_input type="file" (change)="onFileInputChange($event)" multiple> 

Angular2-コード:

onFileInputChange(event) { 
    let fileList: FileList = event.target.files; 
    for (let i = 0; i < fileList.length; i++) { 
    let fp: File = fileList[i]; 
    let formData: FormData = new FormData(); 
    formData.append('File', fp, fp.name); 
    const body = JSON.stringify({ 
     'access': "token" 
    }); 
    this.formData.append('Meta', body); 
    let RequestHeader = new Headers(); 
    // auto set content type 
    RequestHeader.append('Content-Type', ''); 
    RequestHeader.append('Accept', 'application/json'); 
    RequestHeader.append('Authorization', "token"); 

    this.http.post(this.backend_url, formData, RequestHeader).map(
    res => res.json()).subscribe(
      data => console.log('success'), 
      error => console.log(error)) 
    } 
} 

私はここで何をしないのですか?

答えて

0

最終的に解決策が見つかりました。 Content-Typeヘッダは、不正な形式た:実際のコードで

Content-Type: , multipart/form-data; boundary=----WebKit12345 

コンテンツタイプヘッダが予め設定されました。 は

headers.set('Content-Type', ''); 

を呼び出すことによって、Iは、ヘッダコンテンツタイプが上書きされたことを、想定したが、当然の解析できませんでしたコンマが、あったように、実際に空の文字列は、それに付加しました。
コンテンツタイプのヘッダーを完全に削除してこれを解決しました。

headers.delete('Content-Type');