Отправка файла изображения вместе с другими данными формы я использую Angular 7 на сервер - PullRequest
Новая
       20

Отправка файла изображения вместе с другими данными формы я использую Angular 7 на сервер

0 голосов
/ 07 мая 2019

У меня есть форма для отправки сведений о транспортном средстве, включая VIN, водителя и фотографию транспортного средства.Моя проблема заключается в отправке данных формы вместе с изображением на сервер. В качестве моего бэкэнда используется laravel 

uploadImage (e) {     

for (let i = 0; i < e.target.files.length; i++)
       {
  this.selectedFile = <File>e.target.files[i];

       }

  }

onSubmit(){  //this method is called when user submits data

const fd = new FormData();
     fd.append('file', this.selectedFile, this.selectedFile.name);
         this.http.post('http://localhost:8000/api/buses',
         {fd, 'formdata':this.form}).subscribe((data)=>console.log(data))
}

//this is the code receiving the image
 if($request->has('file')) {

    // Get filename with the extension
    $filenameWithExt = $request->file('file')->getClientOriginalName();
    // Get just filename
    $filename = pathinfo($filenameWithExt, PATHINFO_FILENAME);
    // Get just ext
    $extension = $request->file('file')->getClientOriginalExtension();
    // Filename to store
    $fileNameToStore = $filename . '_' . time() . '.' . $extension;
    // Upload Image
    $path = $request->file('file')->storeAs('public/cover_images', $fileNameToStore);

echo json_encode($fileNameToStore);

}

Чтобы отправить изображение и другие данные формы на мой бэкэнд-сервер

1 Ответ

0 голосов
/ 07 мая 2019

Вы публикуете неверную информацию.Пожалуйста, измените это следующим образом. 

fd.append('file', this.selectedFile, this.selectedFile.name);
         this.http.post('http://localhost:8000/api/buses',
         fd).subscribe((data)=>console.log(data))
...