@uppy/aws-s3

What is @uppy/aws-s3?

@uppy/aws-s3 is a plugin for Uppy, a file uploader for web browsers, that allows users to upload files directly to an AWS S3 bucket. It handles the necessary steps to securely upload files to S3, including generating signed URLs and managing the upload process.

What are @uppy/aws-s3's main functionalities?

Direct Upload to S3

This feature allows users to upload files directly to an AWS S3 bucket using Uppy. The code sample demonstrates how to set up Uppy with the AwsS3 plugin, specifying a companion URL for handling the S3 upload process.

const Uppy = require('@uppy/core');
const AwsS3 = require('@uppy/aws-s3');

const uppy = Uppy();
uppy.use(AwsS3, {
  companionUrl: 'https://companion.uppy.io/'
});

uppy.on('complete', (result) => {
  console.log('Upload complete! We’ve uploaded these files:', result.successful)
});

Customizing Upload Parameters

This feature allows customization of upload parameters by providing a function to fetch parameters from a server. The code sample shows how to configure the AwsS3 plugin to use a custom endpoint to retrieve upload parameters for each file.

const Uppy = require('@uppy/core');
const AwsS3 = require('@uppy/aws-s3');

const uppy = Uppy();
uppy.use(AwsS3, {
  companionUrl: 'https://companion.uppy.io/',
  getUploadParameters(file) {
    return fetch('/s3/params', {
      method: 'post',
      headers: {
        'content-type': 'application/json'
      },
      body: JSON.stringify({ filename: file.name, contentType: file.type })
    }).then((response) => {
      return response.json()
    })
  }
});

Other packages similar to @uppy/aws-s3

aws-sdk

The aws-sdk package is the official AWS SDK for JavaScript, which provides a comprehensive set of tools for interacting with AWS services, including S3. Unlike @uppy/aws-s3, which is specifically designed for file uploads in the browser, aws-sdk is a general-purpose library that can be used for a wide range of AWS operations, including managing S3 buckets and objects.

s3-upload-stream

s3-upload-stream is a Node.js package that provides a streaming interface for uploading files to S3. It is more low-level compared to @uppy/aws-s3 and is typically used in server-side applications to handle large file uploads efficiently. While @uppy/aws-s3 is focused on browser-based uploads, s3-upload-stream is designed for server environments.

react-s3-uploader

react-s3-uploader is a React component for uploading files to S3. It provides a simple interface for integrating S3 uploads into React applications. Compared to @uppy/aws-s3, which is part of the Uppy ecosystem and can be used with various frameworks, react-s3-uploader is specifically tailored for React applications.

README

@uppy/aws-s3

The AwsS3 plugin can be used to upload files directly to an S3 bucket. Uploads can be signed using Companion or a custom signing function.

Uppy is being developed by the folks at Transloadit, a versatile file encoding service.

Example

import Uppy from '@uppy/core'
import AwsS3 from '@uppy/aws-s3'

const uppy = new Uppy()
uppy.use(AwsS3, {
  limit: 2,
  timeout: ms('1 minute'),
  companionUrl: 'https://companion.myapp.com/',
})

Installation

$ npm install @uppy/aws-s3

Alternatively, you can also use this plugin in a pre-built bundle from Transloadit’s CDN: Smart CDN. In that case Uppy will attach itself to the global window.Uppy object. See the main Uppy documentation for instructions.

Documentation

Documentation for this plugin can be found on the Uppy website.

License

The MIT License.