| Package | Version | Package | Version | | ---------------------- | ------------ | ---------------------- | ------------ | | @uppy/companion | 5.0.0-beta.6 | @uppy/status-bar | 4.0.0-beta.7 | | @uppy/companion-client | 4.0.0-beta.6 | @uppy/unsplash | 4.0.0-beta.6 | | @uppy/compressor | 2.0.0-beta.7 | @uppy/url | 4.0.0-beta.6 | | @uppy/core | 4.0.0-beta.7 | @uppy/utils | 6.0.0-beta.6 | | @uppy/dashboard | 4.0.0-beta.7 | @uppy/webcam | 4.0.0-beta.6 | | @uppy/dropbox | 4.0.0-beta.6 | @uppy/xhr-upload | 4.0.0-beta.4 | | @uppy/image-editor | 3.0.0-beta.4 | uppy | 4.0.0-beta.7 | | @uppy/screen-capture | 4.0.0-beta.5 | | | - @uppy/companion: switch from `node-redis` to `ioredis` (Dominik Schmidt / #4623) - meta: Fix headings in xhr.mdx (Merlijn Vos) - @uppy/xhr-upload: introduce hooks similar to tus (Merlijn Vos / #5094) - @uppy/core: close->destroy, clearUploadedFiles->clear (Merlijn Vos / #5154) - @uppy/companion-client,@uppy/dropbox,@uppy/screen-capture,@uppy/unsplash,@uppy/url,@uppy/webcam: Use `title` consistently from locales (Merlijn Vos / #5134) | Package | Version | Package | Version | | ------------------ | ------- | ------------------ | ------- | | @uppy/core | 3.11.3 | uppy | 3.25.3 | | @uppy/image-editor | 2.4.6 | | | - @uppy/image-editor: fix tooltips (Avneet Singh Malhotra / #5156) - meta: Remove redundant `plugins` prop from examples (Merlijn Vos / #5145) - @uppy/image-editor: Remove `target` option from examples and document consistently (Merlijn Vos / #5146) - @uppy/core: make getObjectOfFilesPerState more efficient (Merlijn Vos / #5155) |
||
|---|---|---|
| .. | ||
| public | ||
| index.js | ||
| package.json | ||
| README.md | ||
Uppy + AWS S3 with Node.JS
A simple and fully working example of Uppy and AWS S3 storage with Node.js (and Express.js). It uses presigned URL at the backend level.
AWS Configuration
It's assumed that you are familiar with AWS, at least, with the storage service (S3) and users & policies (IAM).
These instructions are not fit for production but tightening the security is out of the scope here.
S3 Setup
-
Create new S3 bucket in AWS (e.g.
aws-nodejs). -
Add a bucket policy.
{ "Version": "2012-10-17", "Statement": [ { "Sid": "PublicAccess", "Effect": "Allow", "Principal": "*", "Action": "s3:GetObject", "Resource": "arn:aws:s3:::aws-nodejs/*" } ] } -
Make the S3 bucket public.
-
Add CORS configuration.
[ { "AllowedHeaders": ["*"], "AllowedMethods": ["GET", "PUT", "HEAD", "POST", "DELETE"], "AllowedOrigins": ["*"], "ExposeHeaders": [] } ]
AWS Credentials
You may use existing AWS credentials or create a new user in the IAM page.
- Make sure you setup the AWS credentials properly and write down the Access Key ID and Secret Access Key.
- You may configure AWS S3 credentials using
environment variables
or a
credentials file in
~/.aws/credentials. - You will need at least
PutObjectandPutObjectAclpermissions.
{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "VisualEditor0",
"Effect": "Allow",
"Action": ["s3:PutObject", "s3:PutObjectAcl"],
"Resource": "arn:aws:s3:::aws-nodejs/*"
}
]
}
Prerequisites
Download this code or clone repository into a folder and install dependencies:
CYPRESS_INSTALL_BINARY=0 corepack yarn install
Add a .env file to the root directory and define the S3 bucket name and port
variables like the example below:
COMPANION_AWS_BUCKET=aws-nodejs
COMPANION_AWS_REGION=…
COMPANION_AWS_KEY=…
COMPANION_AWS_SECRET=…
PORT=8080
N.B.: This example uses COMPANION_AWS_ environnement variables to facilitate
integrations with other examples in this repository, but this example does not
uses Companion at all.
Enjoy it
Start the application:
corepack yarn workspace @uppy-example/aws-nodejs start
Dashboard demo should now be available at http://localhost:8080.
You have also a Drag & Drop demo on http://localhost:8080/drag.
Feel free to check how the demo works and feel free to open an issue.