OK, so those file plugins are the right way to start. They work.
First thing is to check your server’s php.ini file and make sure you are allowing the file sizes you’re trying to upload. This alone could account for some of your file being missing.
Here’s some javascript I used. I had to cut some stuff out but it should be enough for you to understand how I was doing this.
var win = function (r) {
// if r.response status = OK
// then we have an image we can build a URL from
// once that's done we can delete the local image
// console.log("Win Code = " + r.responseCode);
// console.log("Response = " + r.response);
// console.log("Sent = " + r.bytesSent);
}
var fail = function (error)
{
var code;
switch(error.code)
{
case FileTransferError.FILE_NOT_FOUND_ERR:
code = "FileTransferError.FILE_NOT_FOUND_ERR";
break;
case FileTransferError.INVALID_URL_ERR:
code = "FileTransferError.INVALID_URL_ERR";
break;
case FileTransferError.CONNECTION_ERR:
code = "FileTransferError.CONNECTION_ERR";
break;
case FileTransferError.ABORT_ERR:
code = "FileTransferError.ABORT_ERR";
break;
case FileTransferError.NOT_MODIFIED_ERR:
code = "FileTransferError.NOT_MODIFIED_ERR";
break;
default:
code = "FileTransferError.UNKNOWN_UNDOCUMENTED_ERR";
break;
}
// console.log("An upload error has occurred: Code = " + code +" : " +error.code);
// console.log("upload error source " + error.source);
// console.log("upload error target " + error.target);
}
// userid
// video
// type = crime || weather || accident)
// eventid
// entryid
function upload(userID, video, type, eventID, itemID)
{
var tVideo = extractFileName(video);
window.resolveLocalFileSystemURL(cordova.file.documentsDirectory, function (dir) {
dir.getFile(tVideo, {create: false}, function (fileEntry) {
var fileURL = fileEntry.nativeURL;
var options = new FileUploadOptions();
options.fileKey = "file";
options.fileName = tVideo;
// you can code and figure out which to use
options.mimeType = "video/mp4"; // .mp4, .m4a, .m4p, .m4b, .m4r, .m4v
options.mimeType = "video/mpeg";
var params = {};
params.userid = userID;
params.type = type; // crime/weather/accident
if(eventID)
{
params.eventid = eventID; // event id
}
if(item)
{
params.itemid = itemID; // item id
}
options.params = params;
var ft = new FileTransfer();
// serviceURL = https://something.domain.com/
ft.upload(fileURL, encodeURI(serviceURL +"domainImageUpload.php"), win, fail, options);
}, onErrorCreateFile);
}, onErrorLoadFs);
}
function extractFileName(file)
{
var pieces = file.split('/');
var tVideo = pieces[pieces.length-1];
tVideo = "videos/" +tVideo.split('?')[0]; // trimmed photo
return(tVideo);
}
Here’s the php on the server side. Again, I had to strip a bunch of stuff out but there’s enough comments and debugging stuff to show you what I was doing.
<?php
$upload = $_FILES['file']; // the file package
$userid = $_POST['userid'];
$eventid = $_POST['eventid'];
$itemid = $_POST['itemid'];
$purpose = $_POST['type']; // weather / crime/ accident etc
$max_size = 24000000; // (24mb) define the maximum size we'll accept for a video
// output the header
header('Content-type: application/json'); // use this and iframe wraps <pre></pre> around our json
// header('Content-type: text/html'); // use this since we're returning to an iFrame
// log the $_FILE input structure so we can see whats going on
// error_log("PHP File Info: " .print_r($_FILES, true));
//Check that we have a file
if( (!empty($upload['tmp_name'])) && ($upload['error'] == 0) )
{
$img_info = getimagesize($upload['tmp_name']);
// error_log("Image Info: " .print_r($img_info, true));
// now make sure it's a valid/accepted file type
switch($upload["type"])
{
case "image/gif":
case "image/pjpeg":
case "image/jpeg":
if($img_info['bits'] >= 8)
break;
case "video/mp4":
case "video/mpeg":
break;
default:
$response = Array('status' => "ERR", 'text' => "Error: " .$_FILE['FILE']["type"] ." is not a supported file type.");
$output = json_encode($response);
echo $output;
exit;
}
// now make sure it's an acceptable size
if($upload["size"] < $max_size)
{
// Determine the path to which we want to save this file
// $newname = dirname(__FILE__).'/images/'.$filename;
$file_info = buildNewFileName($filename, $userid, $purpose);
//Check if the file with the same name is already exists on the server
// error_log("checking if file exist" .$file_info['save']);
if (!file_exists($file_info['save']))
{
// error_log("File didn't exist!");
//Attempt to move the uploaded file to it's new place
if ((move_uploaded_file($upload['tmp_name'], $file_info['save'])))
{
// tell the database where this file is stored
$rc = updateDatabase(....);
if($rc)
{
$response = Array('status' => "OK", 'text' => $file_info['url']);
// error_log("It's done! The file has been saved as: ".$newname);
}
else
{
$response = Array('status' => "ERR", 'text' => "Error: A problem occurred updating your record!");
}
}
else
{
$response = Array('status' => "ERR", 'text' => "Error: A problem occurred during file upload!");
// error_log("Error: A problem occurred during file upload!");
}
}
else
{
$response = Array('status' => "ERR", 'text' => "Error: File " .$upload['name'] ." already exists");
// error_log("Error: File " .$_FILES["uploaded_file"]["name"] ." already exists");
}
}
else
{
$response = Array('status' => "ERR", 'text' => "Error: Only videos under $max_size Kb are accepted for upload");
// error_log("Error: Only images under $max_size" ."Kb are accepted for upload");
}
}
else
{
$response = Array('status' => "ERR", 'text' => "Error: No file uploaded");
// error_log("Error: No file uploaded");
}
$output = json_encode($response);
// error_log("json sent to browser: $output");
echo $output;
?>
HTH!
