Message (4)

Error: E_WARNING

Description: Run-time warning.

Message: Trying to access array offset on value of type null

Stack Trace:

#0 At webfiori\framework\ui\ErrorBox Line 614

#1 At webfiori\framework\WebFioriApp Line 193

#2 At webfiori\examples\views\MdPage Line 109

#3 At webfiori\examples\views\MdPage Line 44

#4 At app\ini\routes\PagesRoutes Line

#5 At Router Line 1436

#6 At webfiori\framework\router\Router Line 1540

#7 At webfiori\framework\router\Router Line 1398

#8 At webfiori\framework\router\Router Line 691

#9 At webfiori\framework\router\Router Line 56

#10 At webfiori\Index Line 83

#11 At webfiori\Index Line 87

Tip: To display more details about the error, define the constant "WF_VERBOSE" and set its value to "true" in the class "GlobalConstants".

Uploading Files | WebFiori
WebFioriAPI ReferenceLearnDownloadContributeLearn{{result.parent_page}} > {{result.title}}{{result.title}}Classes{{result.class_name}}{{result.summary}}Methods{{result.name}}{{result.summary}}

Uploading Files

In this page:

Introduction

When trying to upload files in PHP, the developer have to access the global array $_FILES which can lead to a mess in some use cases. Also, it is difficult to use the global constant in case of multiple file uploads. More than that, there are security concerns when using the array directly for uploading user files.

The framework has a utility class that can be used to handle file uploads using mimimum amount of effort and code. The name of the class is Uploader and its part of the namespace webfiori\framework.

The Class Uploader

The class Uploader is a utility class which is used to handle file uploads in PHP in a simple way. It has all necessary tools to handle one file upload or multiple files upload. The class will help in achieving the following:

  • Restrict uploaded files types.
  • Get MIME type of most file types using file extension only.
  • Support for multiple uploads.
  • View the status of each uploaded file in a simple way.
  • No need to use the array $_FILES to upload files.
  • Ability to create upload files API in matter of fiew lines
  • Store the uploaded file(s) in a specific location on the server.
  • Filtering for tainted user input.

Using the Class Uploader

Usually, the most common use case is to upload a file to the server. This use case usually has the following steps:

  • In the back-end:
    • Create an API for uploading files.
    • In the API, create new instance of the class Uploader.
    • Specify upload directory and allowed file types.
    • Specify the name of the input element that represents file upload input.
    • Call the method Uploader::upload() to initiate upload process.
    • Return back a JSON response that shows upload status of the file or files.
  • In the front-end:
    • Create a new form.
    • Set the attribute action of the form to be the URL of the API.
    • Sets the attribute method of the form to post.
    • Sets the attribute enctype of the form to multipart/form-data
    • Add file input to the form and specify the attribute 'name' of the input.
    • Add submit input to the form.

Uploading One File

Partial Backend Code (Shows Uploader initialization only):

Code

123456789101112131415161718
$uploader = new Uploader();

//sets upload path
$uploader->setUploadDir('\home\files\sys-uploads');

//allow pdf and word files
$uploader->addExts(['doc','docx','pdf']);

//sets the name of the location where files are kept in front-end
//This usually is the value of the attribute 'name' in case of HTML input element.
$uploader->setAssociatedFileName('files-input');

//start upload process. Replace if already uploaded.
$uploader->upload(true);

//shows a JSON string that shows upload status.
echo $uploader;

Assuming that a route to our upload API is created and the route is apis/upload-files, The front end code would be like the following:

Code

123456789101112131415161718192021222324252627
use webfiori\framework\ui\WebPage;
use webfiori\ui\HTMLNode;
use webfiori\ui\Input;

class UploadView extends WebPage {
    __construct(){
        $form = $this->insert('form');
        //assume that upload API exist in the URL apis\upload-files
        $form->setAttributes([
            'method'=>'post'
            'action'=>'apis/upload-files'
            'enctype'=>'multipart/form-data'
        ]);
        $filesInput = new Input('file');
        $form->addChild($filesInput);

        //The attribute name must be set to the value which
        // is passed to the method Uploader::setAssociatedFileName()
        $file->setName('files-input')

        $submit = new Input('submit');
        $form->addChild($submit);

    }
}
return __NAMESPACE__

Note: It is possible to skip setting the associated file name in server by adding a hidden input field with name="file" and value set to the name of the actual input which is used to upload files.

Uploading Multiple Files

The code which is used to upload multiple files at one call is the same as the one which is used to upload one file. The diffrence is that we have to set the attribute 'multiple' of the file input element and set the name to a syntax which looks like an array as following:

Code

123
$file->setAttribute('multiple')
$file->setName('files-input[]')

Getting Uploaded File(s) Information

The method Uploader::upload() will return an associative array that contains upload status of uploaded files. In addition to getting files information as an associative array, it is possible to get uploaded files information as objects. The method Uploader::uploadAsFileObj() will upload the files and return an array that contains objects of type UploadedFile. Also, it is possible to get uploaded files information even after the upload process is finished using the method Uploader::getFiles().

Next: Sending Emails

Previous: Themes

View this page on GitHubLast modified: 1970-01-01 03:00:00
Powered By: WebFiori Framework, Vue and VuetifyAll Rights Reserved © 2018 - 2024