Why isn't chunked video files uploading to target directory in Plupload version 2.3.6

Question

My frontend shows the file or chunk of files as uploading till it's complete. But the upload doesn't show up in the target directory. or anywhere in the project directory.'m using Plupload version 2.3.6. I have the same problem with version 3

Here's my code:

INDEX.HTML:

<div class="wrapper">
    <div id="statusResponse"></div>
    <div class="col-md-12">
        <!-- File browse input field -->
        <div class="form-group">
            <label><b>Select file</b></label>
            <input type="file" name="form-control"  class="btn btn-lg" id="fileInput" >
        </div>
    </div>

    <!-- List the selected files -->
    <div id="fileList"></div>

    <!-- Upload button -->
    <div class="form-group">
        <a id="uploadBtn" href="javascript:;" class="btn btn-lg btn-primary">Click here to upload selected file</a>
    </div>

    <!-- Progress bar -->
    <div class="progress"></div>
</div>

JAVASCRIPT:

// Define Plupload uploader with configuration options
var uploader = new plupload.Uploader({
    runtimes : 'html5,flash,silverlight,html4',
    browse_button : 'fileInput',
    url : 'upload.php',
    flash_swf_url : 'plupload/js/Moxie.swf',
    silverlight_xap_url : 'plupload/js/Moxie.xap',
    multi_selection : false,

    filters :{
        max_file_size : '500mb',
        mime_types : [
            {title : "Image files", extensions : "jpg,jpeg,gif,png"},
            {title : "Video files", extensions : "mp4,avi,mpg,mpeg,mov,wmv,3gp"},
            {title : "Zip files", extensions : "zip"},
            {title : "Document files", extensions : "pdf,docx,xlsx"}
        ]
    },

    init : {
        PostInit : function() {
            document.getElementById('fileList').innerHTML = '';

            document.getElementById('uploadBtn').onclick = function() {
                if (uploader.files.length < 1) {
                    document.getElementById('statusResponse').innerHTML = '<p style="color: #EA4335;">Please select a file to upload</p>';
                    return false;
                }
                else {
                    uploader.start();
                    return false;
                }
            };
        },

        FilesAdded : function (up, files) {
            plupload.each(files, function(file) {
                document.getElementById('fileList').innerHTML += '<div id="' + file.id + '">' + file.name + ' (' + plupload.formatSize(file.size) + ') <b></b></div>';
            });
        },

        UploadProgress : function (up, file) {
            document.getElementById(file.id).getElementsByTagName('b')[0].innerHTML = '<span>' + file.percent + "%</span>";
            document.querySelector(".progress").innerHTML = '<div class="progress-bar" style="width: ' + file.percent + '%;">' + file.percent + '%</div>';
        },

        FileUploaded : function (up, file, result) {
            var responseData = result.response.replace('"{', '{').replace('}"', '}');
            var objResponse = JSON.parse(responseData);
            document.getElementById('statusResponse').innerHTML = '<p style="color: #198754;">' + objResponse.result.message + '</p>';
        },

        Error : function (up, err) {
            document.getElementById('statusResponse').innerHTML = '<p style="color: #EA4335;">Error #' + err.code + ': ' + err.message + '</p>';
        }
    }
});

// Initialize Plupload uploader
uploader.init();

PHP:

$targetDir = '/uploads';
$cleanupTargetDir = true; // Remove old or stale files
$maxFileAge = 5 * 3600; // Temporary file age in seconds

// Create target directory
if (!file_exists($targetDir)) {
    @mkdir($targetDir);
}

// Get a file name
if (isset($_REQUEST['name'])) {
    $fileName = $_REQUEST['name']
}
elseif (!empty($_FILES)) {
    $fileName = $_FILES["file"]["name"];
}
else {
    $fileName = uniqid("file_");
}

// File path
$filePath = $targetDir . DIRECTORY_SEPARATOR . $fileName;

// Chunking might be enabled
$chunk = isset($_REQUEST["chunk"]) ? intval($_REQUEST["chunk"]) : 0;
$chunks = isset($_REQUEST["chunks"]) ? intval($_REQUEST["chunks"]) : 0;

// Remove old temporary files
if ($cleanupTargetDir) {
    if (!is_dir($targetDir) || !$dir = opendir($targetDir)) {
        die('{"jsonrpc" : "2.0", "error" : {"code" : 100, "message" : "Failed to open temporary directory."}, "id" : "id"}');
    }

    while (($file = readdir($dir)) !== false) {
        $tmpfilePath = $targetDir . DIRECTORY_SEPARATOR . $file;

        // If temporary file is the current file, proceed to the next file
        if ($tmpfilePath == "{$filePath}.part") {
            continue;
        }

        // Remove temporary if it is older than the max file age and is not the current file
//      if (preg_match('/\.part$/', $file) && ($filemtime($tmpfilePath) < time() - $maxFileAge)) {
        if (preg_match('/\.part$/', $file) && ($filetime($tmpfilePath) < time() - $maxFileAge)) {
            @unlink($tmpfilePath);
        }
    }

    // CLose the directory
    closedir($dir);
}


// Open temporary file
if (!$out = @fopen("{$filePath}.part", $chunks ? "ab" : "wb")) {
    die('{"jsonrpc" : "2.0", "error" : {"code" : 102, "message" : "Failed to open output stream."}, "id" : "id"}');
}

if (!empty($_FILES)) {
    if ($_FILES["file"]["error"] || !is_uploaded_file($_FILES["file"]["name"])) {
        die('{"jsonrpc" : "2.0", "error" : {"code" : 103, "message" : "Failed to move uploaded file."}, "id" : "id"}');
    }

    // Read binary input stream and append it to temporary file
    if (!$in = @fopen($_FILES["file"]["tmp_name"], "rb")) {
        die('{"jsonrpc" : "2.0", "error" : {"code" : 101, "message" : "Failed to open input stream."}, "id" : "id"}');
    }
}
else {
    if (!$in = @fopen("php://input", "rb")) {
        die('{"jsonrpc" : "2.0", "error" : {"code" : 101, "message" : "Failed to open input stream."}, "id" : "id"}');
    }
}

while ($buff = fread($in, 4096)) {
    fwrite($out, $buff);
}

@fclose($out);
@fclose($in);

// Check if the file has been uploaded
if (!$chunks || $chunk == $chunks - 1) {
    // Strip the temporary '.part' suffix off
    rename("{$filePath}.part", $filePath);

    // Return success JSON-RPC response
    die('{"jsonrpc" : "2.0", "result" : {"status" : 200, "message" : "The file has been uploaded, successfully."}}');
}

The files don't upload into the uploads directory.

I'll appreciate the help.

Answer 1

Try to replace

$targetDir = '/uploads';

By

$targetDir = 'uploads'; 

I'm not sure that you need the first "/"! Let me know!