├── .gitignore
├── README.md
├── app.js
├── package.json
├── public
├── guide-screenshots
│ ├── account1.png
│ └── cors1.png
└── images
│ └── default.png
├── views
└── account.html
└── yarn.lock
/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules/
2 | *.sw*
3 | *.env
4 | .DS_Store
5 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # NodeDirectUploader
2 |
3 |
4 | ## Licensing
5 |
6 | The files in this repository are, unless stated otherwise, released under the Apache License. You are free to redistribute this code with or without modification. The full license text is available [here](http://www.apache.org/licenses/LICENSE-2.0).
7 |
8 |
9 | ## Direct-to-S3 uploads in a Node.js application running on Heroku
10 |
11 | Simple example demonstrating how to accomplish a direct upload to Amazon's S3 in a Node.js web application.
12 |
13 | This example uses the [express](http://expressjs.com/) web framework to facilitate request-handling. However, the process of signing the S3 PUT request would be identical in most Node apps.
14 |
15 | This code is mostly ready to be run as cloned, but a function will need to be properly defined to handle the storing of the POSTed information. The current example simply demonstrates the upload to S3.
16 |
17 |
18 | ## Dependencies and Installation
19 |
20 | Ensure Node is installed. This can be done through your package manager or from their [website](http://nodejs.org/).
21 |
22 | Clone this repository:
23 | ```term
24 | $ git clone https://github.com/willwebberley/NodeDirectUploader.git
25 | ```
26 |
27 | Change directory into the application and install the application's dependencies:
28 | ```term
29 | $ cd NodeDirectUploader
30 | $ yarn
31 | ```
32 |
33 | If you prefer `npm` to `yarn`, then run `npm install` instead.
34 |
35 | ## Running the application
36 | * Set environment variables for your AWS access key, secret, and bucket name (see [companion article](https://devcenter.heroku.com/articles/s3-upload-node))
37 | * Run `yarn start` (or `npm start`)
38 | * Visit [localhost:3000/account](http://localhost:3000/account) to try it out
39 |
40 |
41 | ## Deploying the application
42 |
43 | See the article [Deploying with Git](https://devcenter.heroku.com/articles/git) for more detailed information on deploying to Heroku.
44 |
45 | * Download and install the [Heroku CLI](https://devcenter.heroku.com/articles/heroku-cli)
46 | * Commit your application to a local Git repository (e.g. `git init`, `git add .`, `git commit -m "version 1 commit"`, etc.)
47 | * Create the application on Heroku by adding a Git remote (`$ heroku create`)
48 | * Push your code to the new Heroku repo (`$ git push heroku master`)
49 |
--------------------------------------------------------------------------------
/app.js:
--------------------------------------------------------------------------------
1 | /*
2 | Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at
3 |
4 | http://www.apache.org/licenses/LICENSE-2.0
5 |
6 | Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
7 | */
8 |
9 |
10 | /*
11 | * Import required packages.
12 | * Packages should be installed with "npm install".
13 | */
14 | const express = require('express');
15 | const aws = require('aws-sdk');
16 |
17 | /*
18 | * Set-up and run the Express app.
19 | */
20 | const app = express();
21 | app.set('views', './views');
22 | app.use(express.static('./public'));
23 | app.engine('html', require('ejs').renderFile);
24 | app.listen(process.env.PORT || 3000);
25 |
26 | /*
27 | * Configure the AWS region of the target bucket.
28 | * Remember to change this to the relevant region.
29 | */
30 | aws.config.region = 'eu-west-1';
31 |
32 | /*
33 | * Load the S3 information from the environment variables.
34 | */
35 | const S3_BUCKET = process.env.S3_BUCKET;
36 |
37 | /*
38 | * Respond to GET requests to /account.
39 | * Upon request, render the 'account.html' web page in views/ directory.
40 | */
41 | app.get('/account', (req, res) => res.render('account.html'));
42 |
43 | /*
44 | * Respond to GET requests to /sign-s3.
45 | * Upon request, return JSON containing the temporarily-signed S3 request and
46 | * the anticipated URL of the image.
47 | */
48 | app.get('/sign-s3', (req, res) => {
49 | const s3 = new aws.S3();
50 | const fileName = req.query['file-name'];
51 | const fileType = req.query['file-type'];
52 | const s3Params = {
53 | Bucket: S3_BUCKET,
54 | Key: fileName,
55 | Expires: 60,
56 | ContentType: fileType,
57 | ACL: 'public-read'
58 | };
59 |
60 | s3.getSignedUrl('putObject', s3Params, (err, data) => {
61 | if(err){
62 | console.log(err);
63 | return res.end();
64 | }
65 | const returnData = {
66 | signedRequest: data,
67 | url: `https://${S3_BUCKET}.s3.amazonaws.com/${fileName}`
68 | };
69 | res.write(JSON.stringify(returnData));
70 | res.end();
71 | });
72 | });
73 |
74 | /*
75 | * Respond to POST requests to /submit_form.
76 | * This function needs to be completed to handle the information in
77 | * a way that suits your application.
78 | */
79 | app.post('/save-details', (req, res) => {
80 | // TODO: Read POSTed form data and do something useful
81 | });
82 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "NodeDirectUploader",
3 | "version": "0.0.1",
4 | "private": true,
5 | "scripts": {
6 | "start": "node app.js"
7 | },
8 | "dependencies": {
9 | "aws-sdk": "2.x",
10 | "ejs": "2.x",
11 | "express": "4.x"
12 | }
13 | }
14 |
--------------------------------------------------------------------------------
/public/guide-screenshots/account1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/willwebberley/NodeDirectUploader/e8daf8509e9ace17c0c3f42573bd5082a3c5de93/public/guide-screenshots/account1.png
--------------------------------------------------------------------------------
/public/guide-screenshots/cors1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/willwebberley/NodeDirectUploader/e8daf8509e9ace17c0c3f42573bd5082a3c5de93/public/guide-screenshots/cors1.png
--------------------------------------------------------------------------------
/public/images/default.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/willwebberley/NodeDirectUploader/e8daf8509e9ace17c0c3f42573bd5082a3c5de93/public/images/default.png
--------------------------------------------------------------------------------
/views/account.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
13 |
14 |