Vue FileUploader - Server-Side Implementation in PHP

Depending on whether the FileUploader sends Ajax requests or uses an HTML form to upload files, the server must be configured differently. Ready-to-use implementations for both these cases are given below.

See Also

Ajax Upload

<?php
    // Specifies the maximum size allowed for the uploaded files (700 kb)
    $max_file_size = 700*1024;

    // Specifies the path to the file
    // Here, "file" is a string specified in the FileUploader's "name" property
    $path_to_file = "images/".$_FILES['file']['name'];

    try {
        // Checks whether the array of uploaded files exists
        if(!isset($_FILES['file'])) {
            throw new Exception('File is not specified');
        }

        // Checks that the file was successfully uploaded to the temporary directory
        if(!is_uploaded_file($_FILES['file']['tmp_name'])) {
            throw new Exception('Possible file upload attack');
        }

        // Checks that the file size does not exceed the allowed size
        if($_FILES['file']['size'] > $max_file_size) {
            throw new Exception('File is too big');
        }

        // Checks that the file is an image
        if(strpos($_FILES['file']['type'], "image") === false) {
            throw new Exception('Invalid file type');
        }

        // Here, make sure that the file will be saved to the required directory.
        // Also, ensure that the client has not uploaded files with malicious content.
        // If all checks are passed, save the file.
            move_uploaded_file($_FILES['file']['tmp_name'], $path_to_file);
    } catch(Exception $e) {
        http_response_code(500);
        // Sends the error message to the client in JSON format
        echo json_encode($e->getMessage());
        exit;
    }
?>
NOTE
The PHP function http_response_code can be used in PHP 5 since version 5.4.0. In earlier versions, use the header function instead.
See Also

HTML Form Upload

<?php
    // Checks whether the array of uploaded files exists
    // Here, "file" is a string specified in the FileUploader's name property
    if(!isset($_FILES['file'])) {
        exit;
    }

    // Specifies the maximum size allowed for the uploaded files (700 kb)
    $max_file_size = 700*1024;

    foreach($_FILES['file']['name'] as $k=>$f) {
        // Checks that the file was successfully uploaded to the temporary directory
        if(!is_uploaded_file($_FILES['file']['tmp_name'][$k])) {
            continue;
        }

        // Checks that the file size does not exceed the allowed size
        if($_FILES['file']['size'][$k] > $max_file_size ) {
            continue;
        }

        // Checks that the file is an image
        if(strpos($_FILES['file']['type'][$k], "image") === false) {
            continue;
        }

        // Specifies the path to the file
        $path_to_file = "images/".$_FILES['file']['name'][$k];

        // Here, make sure that the file will be saved to the required directory.
        // Also, ensure that the client has not uploaded files with malicious content.
        // If all checks are passed, save the file.
            move_uploaded_file($_FILES['file']['tmp_name'][$k], $path_to_file);
    }

    // Redirects to another page
    header("Location: /index.php");
?>
See Also

Chunk Upload

<?php
    $temp_files_location = "images/temp";
    $target_location = "images/";

    try {
        // Checks whether the array of uploaded files exists
        // Here, "file" is a string specified in the FileUploader's "name" property
        if(!isset($_FILES['file'])) {
            throw new Exception('File is not specified');
        }

        if(!is_null($_POST['chunkMetadata'])) {
            // Gets chunk details
            $metaDataObject = json_decode($_POST['chunkMetadata']);

            // ...
            // Perform security checks here
            // ...

            // Creates a directory for temporary files if it does not exist
            if (!file_exists($temp_files_location)) {
                mkdir($temp_files_location);
            }

            $temp_file_path = $temp_files_location . "/" .  $metaDataObject->FileGuid . ".temp";

            // Appends the chunk to the file
            $content = file_get_contents($_FILES['file']['tmp_name']);
            file_put_contents($temp_file_path, $content, FILE_APPEND);

            // Checks that the file size does not exceed the allowed size
            if(filesize($temp_file_path) > 1024*400000) {
                throw new Exception('File is too large');
            }

            // Saves the file if all chunks are received
            if($metaDataObject->Index == ($metaDataObject->TotalCount - 1)) {
                $target_file_path = $target_location . "/" .  $metaDataObject->FileName;
                copy($temp_file_path, $target_file_path);
            }
        }
    } catch(Exception $e) {
        http_response_code(500);
        // Sends the error message to the client in JSON format
        echo json_encode($e->getMessage());
        exit;
    }
?>
See Also