micro-s3-getSignedUrl
AWS S3 signed url micro service for https://github.com/zeit/micro
Getting Started
- Clone this repo
- Create a .env file:
touch .env
(see next section for contents) - Install dependencies:
yarn
- Generate an auth token:
yarn run token
(make sure to also add this to .env file) - Start the micro service:
yarn start
Now to generate a signed url:
curl -H 'Authorization: Bearer TOKEN_CREATED_IN_STEP_4' http://localhost:3000/?name=fileName.jpg&type=image/jpeg
Environment Variables Needed
AWS_ACCESS_KEY=YOUR_ACCESS_KEY
AWS_SECRET_KEY=YOUR_SECRET_KEY
AWS_S3_BUCKET=YOUR_BUCKET_NAME
AWS_REGION=us-east-1
JWT_PRIVATE_KEY=CREATE_PRIVATE_KEY
Launching Micro Service With Now
- Add all of your environment variables to now secrets: (see below)
- Deploy!
now secrets add aws_access_key "YOUR_ACCESS_KEY"
now secrets add aws_secret_key "YOUR_SECRET_KEY"
now secrets add aws_s3_bucket "YOUR_BUCKET_NAME"
now secrets add jwt_private_key "CREATE_PRIVATE_KEY"
now -e AWS_ACCESS_KEY=@aws_access_key -e AWS_SECRET_KEY=@aws_secret_key -e AWS_S3_BUCKET=@aws_s3_bucket -e JWT_PRIVATE_KEY=@jwt_private_key
Example React Component
import React, { Component } from 'react';
import Dropzone from 'react-dropzone';
import { NOW_URL, JWT_TOKEN } from '../env';
class App extends Component {
onDrop = (acceptedFiles, rejectedFiles) => {
acceptedFiles.forEach(file => {
fetch(`${NOW_URL}/?name=${file.name}&type=${file.type}`, {
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'Authorization': `Bearer ${JWT_TOKEN}`
}
})
.then(res => res.json())
.then(signed => fetch(signed.url, {
method: 'PUT',
body: file
}));
});
}
render() {
return (
<div>
<Dropzone onDrop={this.onDrop}>
<div>Try dropping some files here, or click to select files to upload.</div>
</Dropzone>
</div>
);
}
}
export default App;