обрабатывать пост-запрос с форм-данными без экспресса в узле - PullRequest
0 голосов
/ 28 февраля 2019

Я хочу обработать запрос POST на стороне сервера nodeJs без использования такой инфраструктуры, как ExpressJS.Почтовый запрос работает нормально со стороны клиента, но не может получить файл или поля, включенные в запрос POST.Ниже приведен код как на стороне клиента, так и на стороне сервера.

Код на стороне клиента в Angular 7.1.4

filelist: FileList 
file: File

sendFile(){
console.log("Send called")
let formdata: FormData = new FormData();
formdata.append('uploadedFile',this.file,this.file.name)
formdata.append('test',"test")
console.log(formdata)
let options = {
  headers:new HttpHeaders({
    'Accept':'application/json',
    'Content-Type':'multipart/form-data'
  })
}
this._http.post('http://localhost:3000/saveFile',formdata,options)
          .pipe(map((res:Response) => res),
                catchError(err => err)
                ).subscribe(data => {
                  console.log("Data is " + data)
                })
}

Мой HTML-код

<mat-accordion>
<mat-expansion-panel [expanded]='true' [disabled]='true'>
<mat-expansion-panel-header>
  <mat-panel-title>
    Upload File
  </mat-panel-title>
</mat-expansion-panel-header>

<mat-form-field>
  <input matInput placeholder="Work Id">
</mat-form-field>

  <input type="file" (change)="fileChange($event)" >
  <button mat-raised-button color="primary" 
  (click)="sendFile()">Upload</button>

  </mat-expansion-panel>

  </mat-accordion>

На стороне серверакод в NodeJS v10.13.0

//Get the payload
let decoder = new StringDecoder('utf-8')
let buffer = ''


//Listen to request object on data event
req.on('data',(reqData) => {
    console.log("Request Data " + reqData)
    //perform action on the request object
    buffer += decoder.write(reqData)
})

//Listen to request object on end event
req.on('end',() => {

    buffer += decoder.end();

    let form = new formidable.IncomingForm();
    form.parse(req,(err,fields,files) => {

        console.log(fields)
    })

Я использую formidable, но не получаю поля или файлы, которые я добавляю в объект formData.Ниже вывод, который я получаю

Request Data ------WebKitFormBoundary2SOlG50JexpNBclX
Content-Disposition: form-data; name="uploadedFile"; filename="test.txt"
Content-Type: text/plain

//File content
test;test;test;test;test;test;test;test;test;test;test;test
test;test;test;test;test;test;test;test;test;test;test;test
------WebKitFormBoundary2SOlG50JexpNBclX
Content-Disposition: form-data; name="test"

test
------WebKitFormBoundary2SOlG50JexpNBclX--

1 Ответ

0 голосов
/ 28 февраля 2019
   'Content-Type':'multipart/form-data'

MIME-тип multipart / form-data требует атрибут boundary.

Обычно XMLHttpRequest генерирует это автоматически из объекта FormData, но переопределяет AngularContent-Type по умолчанию, а затем вы переопределяете его снова.

Следовательно, Formidable не знает, где находятся границы, и не может обработать запрос.

Вам нужно остановить Angular от переопределения:

  headers:new HttpHeaders({
    'Accept':'application/json',
    'Content-Type': null
  })
...