|
<!DOCTYPE html> |
|
<html><head> |
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
|
<title>ŠiauliaiPHP v17: Upload to S3 Example</title> |
|
<script src="https://sdk.amazonaws.com/js/aws-sdk-2.523.0.min.js"></script> |
|
</head> |
|
<body> |
|
|
|
<div>Current user: <span id="user-arn"></span></div> |
|
<div><input type="file" id="file-chooser"> |
|
<button id="upload-button">Upload</button> |
|
</div> |
|
<div>Uploaded: |
|
<div id="content"></div> |
|
</div> |
|
|
|
<script type="text/javascript"> |
|
// |
|
// Configuration |
|
// |
|
const STORAGE_BUCKET = 'siauliaiphp-v17-filestorage-1at9ml1lrp1gg'; // Change to your S3 bucket (AWS Role/Policy should allow to write to this bucket) |
|
const REGION = 'eu-west-1'; // Update to your rea |
|
const CREDENTIALS = { // Change with outout from: aws sts assume-role --role-arn "arn:aws:iam::..." --role-session-name "siauliaiphp-test" |
|
"AccessKeyId": "ASIAUYWM3ECGTTV2TR4W", |
|
"SecretAccessKey": "7fcRa9Pa5Y7jPKzMNy/hUG2Rmk89kr01KTKyQ2aZ", |
|
"SessionToken": "FwoGZXIvYXdzED4aDMVul2ph8sEvdiOkGSK0AQYI/Y1NG6gYod7Nog6bPlvbRthe9YuNzHI6YLMVXMYhvEiCextO6gHQpxyWvhIlFKt/d9fxb7ACF3W3exILAKdmVQcYDW5y3/LQgkIXkPiPN/hcremn5rWYcZysOCT41jqHxf4rH3qynM645OMgTjq7b8J/qyFCAF+QAqQ457b81olRpmZndAzgtdcw8vDjai18aMrb8nhnXUC6FYTEUWQphSOiWyDBSsbBbLfo2D4ryCiK0yjD7vDuBTItoxYmJpqllYHIF1CM9Efp9XpmuSxA1gEkAALrb15nbVAcNzp3ieY+AdvQH3E4", |
|
"Expiration": "2019-11-25T21:19:15Z" |
|
}; |
|
var prefix = "demo-session"; // To limit upload scope |
|
|
|
|
|
// |
|
// Utility functions |
|
/// |
|
const display = (id, value) => { |
|
document.getElementById(id).innerHTML = value |
|
}; |
|
|
|
const displayContent = () => { |
|
bucket.listObjects({Prefix: prefix}).promise().then((data) => { |
|
let objKeys = ''; |
|
data.Contents.forEach(function (obj) { |
|
objKeys += `<a href="https://${STORAGE_BUCKET}.s3-${REGION}.amazonaws.com/${obj.Key}">${obj.Key}</a><br>`; |
|
}); |
|
display('content', objKeys) |
|
}).catch((err, data) => console.log(err, err.stack, data)); |
|
}; |
|
|
|
|
|
// |
|
// AWS Specific part |
|
// |
|
|
|
|
|
// Act as another user (role) |
|
AWS.config.update({ |
|
region: REGION, |
|
credentials: new AWS.Credentials({ |
|
accessKeyId: CREDENTIALS.AccessKeyId, |
|
secretAccessKey: CREDENTIALS.SecretAccessKey, |
|
sessionToken: CREDENTIALS.SessionToken |
|
}) |
|
}); |
|
|
|
// Configuration |
|
AWS.config.setPromisesDependency(Promise); |
|
let sts = new AWS.STS(); |
|
|
|
var bucket = new AWS.S3({ |
|
params: { |
|
Bucket: STORAGE_BUCKET |
|
} |
|
}); |
|
|
|
// |
|
// Check, if we can connect to AWS |
|
// |
|
sts.getCallerIdentity({}).promise() |
|
.then((data) => { |
|
console.log('Caller identity', data); |
|
display("user-arn", data.Arn); |
|
displayContent(); |
|
}) |
|
.catch((err, data) => console.log(err, err.stack, data)); |
|
|
|
|
|
// |
|
// File upload logic |
|
// |
|
let button = document.getElementById('upload-button'); |
|
button.addEventListener('click', () => { |
|
let file = document.getElementById('file-chooser').files[0]; |
|
console.log('file', file); |
|
|
|
// Call to upload |
|
bucket.putObject({ |
|
Key: prefix + "/" + file.name, |
|
ContentType: file.type, |
|
Body: file, |
|
ACL: 'public-read' |
|
}).promise().then((data) => { |
|
console.log("Sent", data); |
|
displayContent(); |
|
}).catch((err, data) => console.log(err, err.stack, data)); |
|
|
|
}); |
|
|
|
displayContent(); |
|
</script> |
|
|
|
<pre> |
|
</pre> |
|
|
|
|
|
</body></html> |