Skip to content

Latest commit

 

History

History
118 lines (80 loc) · 4.35 KB

README.md

File metadata and controls

118 lines (80 loc) · 4.35 KB
Raw

S3 Web Uploader

Build Status GitHub release

alt text

A minimalistic UI to conveniently upload and download files from AWS S3 / Digital Ocean Space / MinIO

Live Demo: https://gaplo917.github.io/S3WebUploader

Highlights

  • Angular based web client for uploading/downloading file(s) from AWS S3
  • Track multiple upload progress through one consistent UI.
  • Tree-like folder browser so you can find the files you want faster
  • Drag-and-drop upload with support for single file, multiple files and folder upload
  • Support multiple account Login
  • Securely encrypt credential with standalone master password and save in browser
  • Options to rename files during upload
  • Support Virtual-host style endpoint

Built On

This app is built with many amazing framework, including:

Project History

This project is modified from fully-coupled electron-based project https://github.com/Yamazaki93/S3Uploader/tree/762121ab33fe4854b1ec3f94d5bcc260f05f7e6d.

Frictions of Electron

Yamazaki93/S3Uploader use aws-sdk/NodeJs inside the electron to communicate with S3. This solved a lot of limitation of browsers, for example

  • solved CORS(Cross Origin Resource Sharing) issues
  • download a file inside electron using S3 getObject API(able to show progress), then write to file system.
  • choosing a custom download path
  • reading file system to retrieve ~/.aws credentials

However, for whom want to upload things to S3 compatible service momentarily, installing an electron application has too much frictions.

Let alone, I think electron application granted too much permissions for this simple purpose (If it can read your ~/.aws credentials, what else can it read?).

So, I decided to rewrite the S3 communication part completely to build a fully browser-compatible version*.

* Some user experience has been changed due to browser limitation

Browser-compatible Implementation

  • Rewrite the communication part with aws-sdk-js completely, now it is a browser-compatible tree view & drag-drop upload
  • Reuse most of the UI from Yamazaki93/S3Uploader with some enhancements and bug fixes
  • Added MinIO Demo for S3-compatible service
  • Support Virtual-host style endpoint
  • Store all user inputs securely in browser with a custom single master password by applying
    • pbkdf2 hash master password and store in LocalStorage for password verification
    • HmacSHA512 hash master password to produce fixed length secret for AES256 encryption
    • You have to unlock with master password every time

CORS Limitation

MinIO 's API enabled CORS by default on all buckets for all HTTP verbs. However, DigitalOceanSpace & S3 are not.

There are two ways to solve CORS:

  1. Host S3WebUploader (Static Web App) on your own bucket
  2. Configure CORS settings on your bucket (make sure you know the side effects before apply CORS settings)

Getting Start

# development
yarn install
yarn start

# Test
yarn test

# Liniting
yarn lint

# production build
yarn build

More cool projects?

I sincerely believe I couldn't complete this project within a day (< 12 hours) without the following tools that improve my productivity of reading/writing code.

Credit

Thanks for the amazing works of Yamazaki93/S3Uploader that built with a clean and consistent Angular architecture initially.

License

MIT