File uploads fails when file name contains space - php

Question

I have googled this question but did not find an answer. I am using the ng-file-upload Angular directive to upload images to my back-end. At the back-end I am using php to retrieve the image. It works fine if I select an image which contains no white space. But if I select an image which contains white space it throws an error. This is what I did
//app.js
Upload.upload({
url: "api/index.php/postNewFeedsWithPicture",
file: $scope.file,
method: "post"
}).then(function (response) {
$scope.isShowing = false;
if (response.data.error) {
toastr.options = {positionClass: 'toast-bottom-full-width'};
toastr.error(response.data.message, {timeOut: 5000});
}
else {
toastr.options = {positionClass: 'toast-bottom-full-width'};
toastr.success(response.data.message, {timeOut: 5000});
$scope.file = null;
}
}, function (reason) {
$scope.isShowing = false;
toastr.options = {positionClass: 'toast-bottom-full-width'};
toastr.error('Message not posted! Network error', {timeOut: 5000});
});
in my html file i did this
<div role="button" ngf-select ng-model="file" name="file" ngf-pattern="'image/*'" ngf-accept="'image/*'" ngf-max-size="20MB">Upload</div>
in my php file I wrote a function that saves the image
function savePictureToDb($fileName, $dirName) {
$target_dir = "../image/" . $dirName . "/";
$target_file = $target_dir . basename($_FILES[$fileName]["name"]);
$uploadOk = 1;
$errorMsg = null;
$report = array();
$imageFileType = pathinfo($target_file, PATHINFO_EXTENSION);
// Check file size. //20mb
if ($_FILES[$fileName]["size"] > 20000000) {
$uploadOk = 0;
$errorMsg = "File size is greater than 20 mega bytes";
}
// Allow certain file formats
if ($imageFileType != "jpg" && $imageFileType != "png" && $imageFileType != "jpeg" && $imageFileType != "gif") {
$uploadOk = 0;
$errorMsg = "The file selected is not an image";
}
if ($uploadOk == 0) {
$report[ERROR] = TRUE;
$report[MESSAGE] = $errorMsg;
return $report;
// if everything is ok, try to upload file
} else {
if (move_uploaded_file($_FILES[$fileName]["tmp_name"], $target_file)) {
rename($target_file, $target_dir . generateRandStr_md5(500) . "." . $imageFileType);
$response['path'] = basename($_FILES[$fileName]["name"]);
$report[ERROR] = FALSE;
$report[PATH] = $response['path'];
return $report;
} else {
$errorMsg = "Unexpected error";
$report[ERROR] = TRUE;
$report[MESSAGE] = $errorMsg;
return $report;
}
}
}
It works fine, but if the image contains white space this is the error i get when debugging
array (
'file' =>
array (
'name' => 'Age Declaration.jpg',
'type' => '',
'tmp_name' => '',
'error' => 1,
'size' => 0,
),
)

Answer 1

Rename the file name with random value
$filename1=explode(".", $file);
$extension=end($filename1);
$file=rand().time().".".$extension;
Or Use pathinfo() for extention
$ext = pathinfo($filename, PATHINFO_EXTENSION);