I have put my .htacess and index.php of laravel which remain inside public folder put into main directory to avoid public/ from url. When trying to remove image real time via dropzone gets error 404, However if works fine on online server, but when i try it won't work locally & but if i put .htacess and index.php within public folder it works on local server too.
Would appreciate if any one can rescue from this situation.
// controller
public function deleteImage(Request $request, $imageName)
{
try {
// Construct the full path to the image in storage
$imagePath = public_path('/uploads/images/gallery/') . $name;
// Check if the image file exists in the storage
if (File::exists($imagePath)) {
// Delete the image file from storage
File::delete($imagePath);
// Delete the image record from the database
$image = Gallery::where('name', $name)->first();
if ($image) {
$image->delete();
return response()->json(['message' => 'Image deleted successfully']);
} else {
return response()->json(['message' => 'Image record not found in the database'], 404);
}
} else {
return response()->json(['message' => 'Image file not found'], 404);
}
} catch (\Exception $e) {
return response()->json(['message' => 'Error deleting image'], 500);
}
}
// dropzone js
<script>
Dropzone.autoDiscover = false;
var myDropzone = new Dropzone("#dropzone", {
url: "{{ route('gallery.upload') }}",
paramName: "gallery",
maxFilesize: 10, // Max file size in MB
// maxFiles: 5,
acceptedFiles: ".jpg, .jpeg, .png, .gif, .webp", // Allowed file types
addRemoveLinks: true,
dictRemoveFile: "Remove",
dictDefaultMessage: "Drop files here or click to upload",
headers: {
'X-CSRF-Token': "{{ csrf_token() }}"
},
init: function() {
var dropzone = this;
this.on("success", function(file, response) {
// Handle the success response (if needed)
console.log(response.name);
// Assign the unique image name to the file object
file.serverFileName = response.name;
// Create a hidden input field with the image name
var imageNameInput = document.createElement('input');
imageNameInput.type = 'hidden';
imageNameInput.name = 'gallery[]';
imageNameInput.value = response.name;
// Append the hidden input field to the form
dropzone.element.appendChild(imageNameInput);
});
//delete image
this.on("removedfile", function(file) {
// Handle the removal of a file (image) from Dropzone
imageName = file.serverFileName; // Use the serverFileName assigned earlier
console.log(imageName);
// Remove the corresponding hidden input field from the form
var inputToRemove = document.querySelector('input[name="gallery[]"][value="' +
imageName + '"]');
if (inputToRemove) {
inputToRemove.parentNode.removeChild(inputToRemove);
}
// Use the deleteRoute and csrfToken variables obtained from the Blade file
$.ajax({
type: "DELETE",
url: "{{ route('gallery.delete', ['imageName' => ':imageName']) }}"
.replace(':imageName', imageName),
//url: "/admin/gallery/delete/" + imageName, // Use the correct image name
data: {
_token: "{{ csrf_token() }}"
},
success: function(data) {
console.log(data.message); // Log the success message
},
error: function(xhr, status, error) {
console.error(xhr.responseText); // Log any errors
}
});
});
}
});
</script>
//route
Route::delete('/gallery/delete/{imageName}', [PropertyController::class,'deleteImage'])->name('gallery.delete');