Code Monkey home page Code Monkey logo

dropdot's Introduction

Dropdot

Dropdot is a simple file uploader built on NodeJS, Express and S3 API as the object storage platform. It supports AWS S3 and DreamHost Objects as storage provider.

Configuring Dropdot is simple, just follow the steps below:

AWS S3 Demo: http://dropdot.alfg.co/

##Installation## Clone and install dependencies

$ git clone https://github.com/alfg/dropdot.git
$ cd dropdot
$ npm install

Open config.js.sample and configure

module.exports.port = 3000; // App port
module.exports.aws_key = "YourAWSKey"; // AWS Key
module.exports.aws_secret = "YourSuperSecretAWSKey"; // AWS Secret
module.exports.aws_bucket = "NameOfS3Bucket"; // S3 bucket
module.exports.redirect_host = "http://localhost:3000/"; // Redirect page after successful upload
module.exports.host = "YOUR_S3_PROVIDER"; // S3 provider host
module.exports.bucket_dir = "uploads/"; // Subdirectory in S3 bucket where uploads will go
module.exports.max_filesize = 20971520; // Max filesize in bytes (default 20MB)

Rename config.js.sample to config.js and run the app

$ mv config.js.sample config.js
$ node app.js

Load http://localhost:3000 into the browser

The app is set, now you need to create and configure your S3 Bucket.

Configuring your S3 Bucket

In order to allow S3 to accept CORS uploads from your app, it needs to be properly configured.

AWS S3

Log into your S3 Console and create a bucket.

Right-click your bucket and go to properties > permissions > Edit CORS Configuration.

Enter the following:

<CORSConfiguration>
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>PUT</AllowedMethod>
        <AllowedMethod>GET</AllowedMethod>
        <AllowedMethod>POST</AllowedMethod>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <AllowedHeader>*</AllowedHeader>
    </CORSRule>
</CORSConfiguration>

Of course, the * in AllowedOrigin is only for development. Be sure to use your domain when going public.

DreamObjects S3

Log into your DreamHost account and go to DreamObjects section. Then upload cors.xml in the root of that bucket which you are seleceted as upload destionation ( aws_bucket in config.js ).

CNAME your S3 bucket (optional)

Objects will be available by accessing the public URL directly. Example: http://bucket-name.s3.amazonaws.com/uploads/439fbca8-b79b-40e9-8172-4d318737ee14_file.jpg

However, if you wish to customize the URL, you can use a CNAME. First, create/rename your bucket to match the subdomain (uploads.domain.com). Then create the CNAME (via your DNS settings) using the exact name of the bucket/subdomain.

To be clear, the bucket's name and CNAME should be identical. i.e. uploads.domain.com

You can now access your files as: http://uploads.domain.com/uploads/439fbca8-b79b-40e9-8172-4d318737ee14_file.jpg

That's it!

All done! Now go upload stuff.

License

Dropdot is open-source under the MIT License.

Credits

Dropdot uses the following technologies, check them out!

  • NodeJS The core backend
  • Express Framework for Node. Serves the JSON policy
  • mime Mime-type detection
  • crypto Used for SHA1, Base64 digestion
  • uuid Generating the unique IDs
  • Amazon S3 Cloud Object/File Storage Platform

Guides that saved me a few gray hairs dealing with CORS:

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.