1

I am trying to upload a file from a file upload web page to AWS S3 bucket. I am able to connect to my s3 bucket and I can create folders from naking PHP calls, but I cannot seem to upload files. The errors that I am getting is:

 1) 'Undefined index: file1 in '
 2) 'Error:Found 2 errors while validating the input provided for the PutObject operation:[Key] is missing and is a required parameter [Key] expected string length to be >= 1, but found string length of 0'

HTML file upload code:

 <form id="uploadDoc" enctype="multipart/form-data" method="post">
        <input type="file" name="fileSelect" id="fileSelect">
        <input type="button" value="uploadValue" onclick="upld.uploadFile()">
        <progress id="progressBar" value="0" max="100" style="width: 300px;"></progress>
        <div id="uploadStatus">status</div>
        <div id="loaded_n_total">error msessage</div>

    </form>

My PHP code:

 $bucketName = 'testlabbookbucket1';


try{
    $tempPath =  $_FILES["file1"]['tmp_name'];
    $folder = 'lseMember';
    $fileName = $_FILES["file1"]['name'];

    $result = $client -> putObject(array(
        'Bucket' => $bucketName,
        'Key' => $fileName,
        'SourceFile' => $tempPath
    ));


}catch (S3Exception $e) {
    die('Error:' . $e->getMessage());
} catch (Exception $e) {
    die('Error:' . $e->getMessage());
}

JS:

 // Onclick upload file
 upld.uploadFile = function(){

// Get selected file
var file = upld.el('fileSelect').files[0];
console.log(file.name);
console.log(file.size);
console.log(file.type);


var formdata = new FormData();
formdata.append('file1', file);

var xmh = new XMLHttpRequest;
xmh.onreadystatechange = function(){
    if(xmh.readyState == 4 && xmh.status == 200){

        var response = xmh.responseText;

        console.log('response: '+response);
    }
}
// Event listeners
xmh.upload.addEventListener('progress', upld.progressHandler, false);
xmh.addEventListener('load', upld.completeHandler, false);
xmh.addEventListener('error', upld.errorHandler, false);
xmh.addEventListener('abort', upld.abortHandler, false);

xmh.open('POST', 's3Test.php');
xmh.send();

}

Below is my bucket policy for this AWS s3:

 {
"Version": "2012-10-17",
"Id": "Policy1520243101111",
"Statement": [
    {
        "Sid": "Stmt1520243091111",
        "Effect": "Allow",
        "Principal": {
            "AWS": "arn:aws:iam::123456789012:root"
        },
        "Action": [
            "s3:Put*",
            "s3:Get*"
        ],
        "Resource": "arn:aws:s3:::testlabbookbucket1"
    }
]

}

John Rotenstein
  • 241,921
  • 22
  • 380
  • 470
jamesMcKey
  • 481
  • 5
  • 28

1 Answers1

1

You are initializing the data to send in the XMLHttpRequest as formdata, but you're not actually sending it. Change the last line in the uploadFile function to this:

xmh.send(formdata);
ishegg
  • 9,685
  • 3
  • 16
  • 31
  • Thanks for the answer above. When i upload a file of 1.1M it works. But when I upload a file of 3.7M I get the following error: 'Error:Unable to open using mode r: fopen(): Filename cannot be empty'. do you know why? – jamesMcKey Mar 05 '18 at 13:11
  • 1
    Take a look at [this answer](https://stackoverflow.com/questions/2184513/change-the-maximum-upload-file-size). You probably have `upload_max_filesize` set to `2M` (it's the default), so it works for 1.1MB but not for 3.7MB. – ishegg Mar 05 '18 at 13:14