Получить файлы из Vue в Laravel

Question

Я загрузил файлы с моего внешнего интерфейса, используя Vue для внутреннего интерфейса Laravel.

Загружен с использованием этого фрагмента ниже:

addPost() {
axios.post('api/submitPropertyPhoto?token=' + this.token, this.postFormData)
 .then(r => {
 console.log(r)
})
.catch(e => {
console.log(e)
 }
},
uploadFieldChange(e) {
  for(let key in e.target.files) {
  this.postFormData.append('images[]', e.target.files[key])
   }
 }

Когда я хочу запросить файл с помощью обычного вспомогательного метода файла запроса Laravel, он ничего не возвращает, но когда я использую dd($request->files), он возвращает подробности ниже,

FileBag {#68
  #parameters: array:1 [
  "images" => array:1 [
  0 => array:1 [
    "name" => UploadedFile {#45
      -test: false
      -originalName: "error.JPG"
      -mimeType: "image/jpeg"
      -size: 21806
      -error: 0
      path: "C:\xampp\tmp"
      filename: "php639F.tmp"
      basename: "php639F.tmp"
      pathname: "C:\xampp\tmp\php639F.tmp"
      extension: "tmp"
      realPath: "C:\xampp\tmp\php639F.tmp"
      aTime: 2018-05-17 04:26:29
      mTime: 2018-05-17 04:26:29
      cTime: 2018-05-17 04:26:29
      inode: 0
      size: 21806
      perms: 0100666
      owner: 0
      group: 0
      type: "file"
      writable: true
      readable: true
      executable: false
      file: true
      dir: false
      link: false
      linkTarget: "C:\xampp\tmp\php639F.tmp"
     }
    ]
  ]
 ]
}

Чего я хочу добиться - это сохранить файл на диске и имя файла в базе данных.

Answer 1

На вашем контроллере попробуйте следующее:

$urls = collect();
foreach ($request->images as $image) {
    $path = $image->store('images');
    // Store $path to your data base
    $urls->merge(Storage::url($path));
}
return response($urls);

Затем на vue вы можете получить URL:

addPost() {
    axios.post('api/submitPropertyPhoto?token=' + this.token,this.postFormData)
       .then(r => {
           console.log(r.data); // You should get a json of urls
       })
       .catch(e => {
           console.log(e)
       }

},