How to Create a File Upload Form in Php
Uploading files, images, and videos using PHP is as easy as calculation a couple of scripts. This guide will evidence yous ii different ways on how to add php file upload functionality to your site:
- The Simple PHP Manner – This is the simplest way of adding a PHP uploader to your service. The upside is that yous have complete control of the files being uploaded.
- Filestack's PHP File Upload Service – This is an easier way of calculation PHP upload functionality. The upside is that you lot do not have to manage the complex file upload infrastructure behind-the-scenes.
Let's become started with some easy examples:
PHP File Upload – The Uncomplicated Mode
To start, nosotros'll create the following:
1. The HTML Form
First, we'll create an HTML form that the user will encounter when they want to upload the file. Create a new folder for this example project, and within it, create an alphabetize.html file with the following code:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <championship>PHP File Upload</championship> </head> <body> <form activity="fileUploadScript.php" method="post" enctype="multipart/form-data"> Upload a File: <input type="file" name="the_file" id="fileToUpload"> <input blazon="submit" proper name="submit" value="Commencement Upload"> </form> </body> </html> A couple important things to notice in the example to a higher place:
-
activity="fileUploadScript.php"– This references the PHP script that will handle the file upload on the backend -
method="postal service"– This tells the browser activity the form volition use when sending the file to the server (for uploads, this is almost always a Mail service action, sometimes a PUT) -
enctype="multipart/form-data"– This determines the content-blazon that the form submits
Next, open up your terminal and from the directory where yous created the file, start the PHP server:
And then, open your web browser and go to localhost:1234. You should see something like this:
ii. The PHP File Upload Script
Next, we'll handle the backend of the file upload. First, in the same directory, create a new directory called uploads. This volition be where our script will save the files.
Then, in the same directory every bit index.html, create a file called fileUploadScript.php. Find that this is the same name every bit the action attribute in the form. And so add together this lawmaking:
<?php $currentDirectory = getcwd(); $uploadDirectory = "/uploads/"; $errors = []; // Shop errors hither $fileExtensionsAllowed = ['jpeg','jpg','png']; // These will be the only file extensions immune $fileName = $_FILES['the_file']['name']; $fileSize = $_FILES['the_file']['size']; $fileTmpName = $_FILES['the_file']['tmp_name']; $fileType = $_FILES['the_file']['type']; $fileExtension = strtolower(end(explode('.',$fileName))); $uploadPath = $currentDirectory . $uploadDirectory . basename($fileName); if (isset($_POST['submit'])) { if (! in_array($fileExtension,$fileExtensionsAllowed)) { $errors[] = "This file extension is not allowed. Delight upload a JPEG or PNG file"; } if ($fileSize > 4000000) { $errors[] = "File exceeds maximum size (4MB)"; } if (empty($errors)) { $didUpload = move_uploaded_file($fileTmpName, $uploadPath); if ($didUpload) { echo "The file " . basename($fileName) . " has been uploaded"; } else { echo "An fault occurred. Delight contact the administrator."; } } else { foreach ($errors as $error) { echo $fault . "These are the errors" . "\n"; } } } ?> A couple things to note:
- The primal used to access the file from the
$_FILESobject matches the proper name attribute used in the form -
$fileName = $<em>FILES['the</em>file']['name'];– This is the name of the actual file -
$fileSize = $<em>FILES['the</em>file']['size'];– This is the size of the file in bytes -
$fileTmpName = $<em>FILES['the</em>file']['tmp_name'];– This is the a temporary file that resides in thetmpdirectory of the server -
$fileExtension = strtolower(cease(explode('.',$fileName)));– This gets the file extension from the file proper name -
$uploadPath = $currentDir . $uploadDirectory . basename($fileName);– This is where the files will be stored on the server. In the script to a higher place, it is set to the current working directory
Also note that in the code above, we validate the file upload by checking both the file type and size. (But png and jpeg files that are less than 4MB)
Now in that location are a couple final steps earlier we tin beginning uploading files:
- Go to your
uploads/directory and get in writable by running:chmod 0755 uploads/ - Make certain your
php.inifile is correctly configured to handle file uploads (Tip: to find your php.ini file, runphp --ini):
max_file_uploads = 20 upload_max_filesize = 2M post_max_size = 8M Finally, if you now get-go the PHP server and go to localhost:1234, then upload a file, yous should see it save in the uploads folder!
Keep in mind that the all of the code above requires additional security precautions before being released in product. For instance, there are currently no checks to see if the user has uploaded a virus disguised as an epitome. To learn more than, check out this article which describes various ways to handle secure file uploads.
File Upload with Filestack
In this 2nd instance, we'll use Filestack to upload a file. Filestack is an advanced file upload API and service that securely stores files in the cloud.
Why apply a third party like Filestack over building information technology yourself? By using a third party yous no longer need to deal with the scaling, security, and maintenance that comes with building your own file upload system. This can free y'all upward to focus on building other important parts of your awarding.
And you tin get started for free. Filestack has a free programme that handles upward to 100 monthly uploads with 1GB storage and 1GB bandwidth. If yous need to get beyond that amount, they offer pricing that scales with use.
Then let's go started:
1. Sign upwards for a Filestack Account
First, we'll sign up for a Filestack account. Get to their registration folio and after you log in, become the API Key, which you lot will use in the later steps.
2. Start Uploading
Now that nosotros have the Filestack library, let's integrate their JavaScript file uploader widget, which allows your users to connect to a variety of other sources from which to upload from. For example, if they wanted to upload from a URL or from social media. Only supervene upon the contents of alphabetize.html with the post-obit:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>PHP File Upload</title> </head> <body> <way> .picker-content{ height:300px; width:200px; } </style> <script src="//static.filestackapi.com/filestack-js/2.x.10/filestack.min.js"></script> <script blazon="text/javascript"> document.addEventListener("DOMContentLoaded", office(event) { const client = filestack.init(YOUR_API_KEY); let options = { "displayMode": "inline", "container": ".picker-content", "take": [ "image/jpeg", "prototype/jpg", "image/png" ], "fromSources": [ "local_file_system" ], "uploadInBackground": faux, "onUploadDone": (res) => console.log(res), }; picker = client.picker(options); picker.open(); }); </script> <div class="picker-content"></div> </body> </html> Then, open your page and so upload a file using the upload widget. After uploading, you should be able to log into your Filestack dashboard and see your newly uploaded file:
And that's it! You don't even demand the server to handle the file, which is better for scalability, security, and maintenance.
Filestack PHP Library (optional)
The above example covers the simplest example of uploading a file with Filestack. But, what if you wanted to access the file on your server to run some kind of postal service-processing, like checking if an prototype is safe for work? To practise that, you can use the Filestack PHP library. Nosotros'll apply Composer to install the Filestack PHP library. If you lot don't have Composer already, you can install it by going to the folder you created originally and running (encounter this for official documentation):
php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');" php -r "if (hash_file('sha384', 'composer-setup.php') === '48e3236262b34d30969dca3c37281b3b4bbe3221bda826ac6a9a62d6444cdb0dcd0615698a5cbe587c3f0fe57a54d8f5') { echo 'Installer verified'; } else { echo 'Installer corrupt'; unlink('composer-setup.php'); } repeat PHP_EOL;" php composer-setup.php php -r "unlink('composer-setup.php');" After you do the to a higher place, you should be able to see Composer'due south output by running php composer.phar.
Then run crave --prefer-dist filestack/filestack-php to install the Filestack SDK.
Now that we have the Filestack library, allow's make a new PHP script to cheque if a specific uploaded file is prophylactic for work. Create a new file called fileUploadFilestack.php and add together the following (making certain to change the YOUR_API_KEY, YOUR_SECURITY_SECRET, and YOUR_FILE_HANDLE variables):
<?php crave __DIR__ . '/vendor/autoload.php'; use Filestack\FilestackClient; $client = new FilestackClient(YOUR_API_KEY); $security = new FilestackSecurity(YOUR_SECURITY_SECRET); $file_handle = YOUR_FILE_HANDLE; # become tags with customer $result_json = $client->getTags($file_handle); # get tags with filelink $filelink = new Filelink($file_handle, YOUR_API_KEY, $security); $json_result = $filelink->getTags(); # get condom for work flag with filelink $json_result = $filelink->getSafeForWork(); ?> When this script is run, the outcome of the safety-for-work check will be saved in the $json_result variable. And that's just one example. Using the Filestack PHP SDK allows you to perform a multifariousness of tasks on your uploaded files. Check out these other examples:
- Transform a file before upload
- Test if a file upload is "safe for work"
- Transcode uploaded video or audio
- Catechumen a file upload to pdf
- And more…
In addition, if yous desire to meet more examples of how the file upload picker tin can be integrated into a grade check out these links:
- Upload image
- Open picker
- Open picker in inline mode
- Crop images
- File preview
- And more…
Summary
Now that you know how implement PHP file uploads 2 ways, you can easily add together this characteristic to your website or application. If dealing with the scalability, security, and maintenance challenges of hosting your own file upload infrastructure seems too daunting, let Filestack handle it. Too be sure to bank check out our commodity on AJAX File Uploads as well!
Read More than →
Source: https://blog.filestack.com/thoughts-and-knowledge/php-file-upload/
0 Response to "How to Create a File Upload Form in Php"
Yorum Gönder