Skip to content

Instantly share code, notes, and snippets.

@xpsdeset
Created October 25, 2022 14:56
Show Gist options
  • Save xpsdeset/735746ee0179e33fc576dbb96b4822ae to your computer and use it in GitHub Desktop.
Save xpsdeset/735746ee0179e33fc576dbb96b4822ae to your computer and use it in GitHub Desktop.
<!doctype html>
<head>
<script src="https://sdk.amazonaws.com/js/aws-sdk-2.357.0.min.js"></script>
<script type="text/javascript">
//Bucket Configurations
var bucketName = '';
var bucketRegion = '';
var IdentityPoolId = "";
var path='uploads';
// ensure the s3 bucket has proper upload and cors permissions.
AWS.config.update({
region: bucketRegion,
credentials: new AWS.CognitoIdentityCredentials({
IdentityPoolId: IdentityPoolId
})
});
var s3 = new AWS.S3({
apiVersion: '2006-03-01',
params: {Bucket: bucketName}
});
</script>
</head>
<body>
<!-- A functional html code-->
<div>
<input type="file" id="fileUpload">
</div>
<div>
<button onclick="s3upload()">Submit</button>
</div>
<progress max=”100” value=”0”></progress>
<script type="text/javascript">
s3.listObjects({ Delimiter: "/"+path }, function(err, data) {
data.Contents.forEach(d => {
console.log(d)
console.log(`https://${bucketName}.s3.${bucketRegion}.amazonaws.com/${d.Key}`)
});
})
function s3upload() {
var files = document.getElementById('fileUpload').files;
if (files)
{
var file = files[0];
var fileName = file.name;
var filePath = path+'/' + fileName;
var fileUrl = 'https://' + bucketRegion + '.amazonaws.com/'+path+'/' + filePath;
s3.upload({
Key: filePath,
Body: file,
ACL: 'public-read'
}, function(err, data) {
if(err) {
console.log(err)
}
alert('Successfully Uploaded!');
}).on('httpUploadProgress', function (progress) {
var uploaded = parseInt((progress.loaded * 100) / progress.total);
document.querySelector('progress').value=uploaded
});
}
};
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment