I use this library to upload files https://github.com/blueimp/jQuery-File-Upload
When I try to upload a file I get an error: "Call to a member function store() on array"
It seems like there's an issue with $request->files
variable. When is's being passed to foreach loop, it does not return the correct index.
Thank you for your help.
Controller
public function upload(Request $request) {
foreach($request->files as $file) {
$filename = $file->store('library');
}
}
The output of dd($request->files)
FileBag {#68
#parameters: array:1 [
"files" => array:1 [
0 => UploadedFile {#45
-test: false
-originalName: "img_(17).jpg"
-mimeType: "image/jpeg"
-size: 1260662
-error: 0
path: "D:\xampp\tmp"
filename: "phpD7B1.tmp"
basename: "phpD7B1.tmp"
pathname: "D:\xampp\tmp\phpD7B1.tmp"
extension: "tmp"
realPath: "D:\xampp\tmp\phpD7B1.tmp"
aTime: 2018-05-30 16:10:02
mTime: 2018-05-30 16:10:02
cTime: 2018-05-30 16:10:02
inode: 0
size: 1260662
perms: 0100666
owner: 0
group: 0
type: "file"
writable: true
readable: true
executable: false
file: true
dir: false
link: false
linkTarget: "D:\xampp\tmp\phpD7B1.tmp"
}
]
]
}
Response, when I use var_dump($file) in the controller within foreach loop.
array(1) {
[0]=>
object(Symfony\Component\HttpFoundation\File\UploadedFile)#45 (7) {
["test":"Symfony\Component\HttpFoundation\File\UploadedFile":private]=>
bool(false)
["originalName":"Symfony\Component\HttpFoundation\File\UploadedFile":private]=>
string(12) "zdjęcie.jpg"
["mimeType":"Symfony\Component\HttpFoundation\File\UploadedFile":private]=>
string(10) "image/jpeg"
["size":"Symfony\Component\HttpFoundation\File\UploadedFile":private]=>
int(7445)
["error":"Symfony\Component\HttpFoundation\File\UploadedFile":private]=>
int(0)
["pathName":"SplFileInfo":private]=>
string(24) "D:\xampp\tmp\php7175.tmp"
["fileName":"SplFileInfo":private]=>
string(11) "php7175.tmp"
}
}
View
<div id="dropZone">
<h1>Drag & Drop Files...</h1>
<input type="file" id="fileupload" name="files[]" multiple>
</div>
<h1 id="error"></h1><br><br>
<h1 id="progress"></h1><br><br>
<div id="files"></div>
<script>
$(function () {
var files = $("#files");
$("#fileupload").fileupload({
url: '{{ route("libraryUpload") }}',
dropZone: '#dropZone',
dataType: 'json',
autoUpload: false,
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
}).on('fileuploadadd', function (e, data) {
var fileTypeAllowed = /.\.(gif|jpg|png|jpeg)$/i;
var fileName = data.originalFiles[0]['name'];
var fileSize = data.originalFiles[0]['size'];
if (!fileTypeAllowed.test(fileName))
$("#error").html('Only images are allowed!');
else if (fileSize > 5000000)
$("#error").html('Your file is too big! Max allowed size is: 5MB');
else {
$("#error").html("");
data.submit();
}
}).on('fileuploaddone', function(e, data) {
var status = data.jqXHR.responseJSON.status;
var msg = data.jqXHR.responseJSON.msg;
if (status == 1) {
var path = data.jqXHR.responseJSON.path;
$("#files").fadeIn().append('<p><img style="width: 100px; height: 100px;" src="'+path+'" /></p>');
} else
$("#error").html(msg);
}).on('fileuploadprogressall', function(e,data) {
var progress = parseInt(data.loaded / data.total * 100, 10);
$("#progress").html("Completed: " + progress + "%");
});
});
</script>
Try to var_dump '$file' within foreach loop so that you can get some idea about it's type