please help. I am trying to create a drag and drop file uploader with php and javascript but the when I click on upload files the php file shows the following error: This page isn’t working localhost is currently unable to handle this request. HTTP ERROR 500
Here is the body of my html.
<body>
<div class="wrapper">
<div class="upload-console">
<h2 class="upload-console-header">Upload</h2>
<div class="upload-console-body">
<h3>Select files from your computer</h3>
<form action="upload.php" method="post" enctype="multipart/form-data">
<input type="file" name="files[]" id="standard-upload-files" multiple>
<input type="submit" value="Upload files" id="standard-upload">
</form>
<h3>Or drag and drop files below</h3>
<div class="upload-console-drop" id="drop-zone">
Just drag and drop files here
</div>
<div class="bar">
<div class="bar-fill" id="bar-fill">
<div class="bar-fill-text" id="bar-fill-text"></div>
</div>
</div>
<div id="uploads-finished" class="hidden">
<h3>Processed files</h3>
</div>
</div>
</div>
</div>
<script src="js/upload.js"></script>
<script src="js/global.js"></script>
</body>
Here is my upload.php file.
<?php
header('Content-Type: application/json');
$allowed = ['mp4','png','jpg'];
$processed = [];
foreach($_FILES['files']['name'] as $key => $name) {
if($_FILES['files']['error'][$key] === 0) {
$temp = $_FILES['files']['tmp_name'][$key];
$ext = explode('.',$name);
$ext = strtolower(end($ext));
$file = uniqid('',true) . time() . '.' . $ext;
if(in_array($ext, $allowed) && move_uploaded_file($temp, 'uploads/' . $file)) {
$processed[] = array(
'name' => $name,
'file' => $file,
'uploaded' => true
);
} else {
$processed[] = array(
'name' => $name,
'uploaded' => false
);
}
}
}
echo json_encoded($processed);
?>
Here are results of running the tree command
.
├── css
│ └── global.css
├── index.html
├── js
│ ├── global.js
│ └── upload.js
├── phpinfo.php
├── upload.php
└── uploads
├── 5cc57ea6322ba7.448603261556446886.jpg
├── 5cc58390d82095.937935921556448144.jpg
├── 5cc583f48b4a81.475000611556448244.jpg
├── 5cc596bb0b2980.525819171556453051.jpg
├── 5cc5ca069f34e8.919505521556466182.jpg
└── 5cc5ccc7525ad4.537311361556466887.jpg
Images appear to be uploading but I get a 500 error page. I'm trying to get it to get the progress bar to show progress and change the class hidden to show the downloaded files. But it redirects to uploads.php with a 500 error. Thank you.
All of the html and js can be seen here on codepen.
Your form will redirect to the 'action' inside it, in your case it's upload.php - if you want to stop it redirecting, you will need to add a php redirect: header("Location: mypage.php"); in order to get back to your previous page.
If your pages are dynamic and you don't know what mypage.php is, add a hidden input in your form and use the page name as the value for this.
Edit: My apologies, this still doesn't solve your issue - the redirect above will be for when your script has been executed. The 500 error is because of an error in your code. This error (as mentioned by @Chris White in your comments) is echo json_encoded($processed); This should be echo json_encode($processed);
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments