Angular 6: S3 uploads using Cognito authentication
This is a fully functional Angular 6 App to upload to S3 directly from browser using Cognito user and identity pools. For architecture and background details go here.
<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
<AllowedOrigin>*</AllowedOrigin>
<AllowedMethod>PUT</AllowedMethod>
<AllowedMethod>GET</AllowedMethod>
<AllowedMethod>POST</AllowedMethod>
<AllowedMethod>DELETE</AllowedMethod>
<MaxAgeSeconds>3000</MaxAgeSeconds>
<ExposeHeader>ETag</ExposeHeader>
<AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>
git clone https://github.com/tensult/ngx-s3-upload.git
cd ngx-s3-upload
npm install
npm start
Once app is successfully started: open http://localhost:4200/ in your browser
Video instructions are available at :https://www.screencast.com/t/ye42zx51
add files
button.
upload all
button or individually by clicking on upload
button.signout
link.
Downloads
link from upload page, this page will be opened.{
"Version": "2008-10-17",
"Statement": [
{
"Sid": "Allow Public Access to All Objects",
"Effect": "Allow",
"Principal": "*",
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::s3-website-hosting/*"
}
]
}
npm run build
Note: We are uploading files at a folder named by your email in S3 bucket.