https://github.com/robotmay/s3-direct-file-upload

Elm S3/Shrine direct file uploader
https://github.com/robotmay/s3-direct-file-upload

elm

Last synced: 5 months ago
JSON representation

Elm S3/Shrine direct file uploader

• Host: GitHub
• URL: https://github.com/robotmay/s3-direct-file-upload
• Owner: robotmay
• License: mit
• Created: 2019-11-13T22:19:26.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2021-04-19T21:19:33.000Z (about 5 years ago)
• Last Synced: 2025-11-23T18:06:32.594Z (8 months ago)
• Topics: elm
• Language: Elm
• Size: 4.88 KB
• Stars: 4
• Watchers: 1
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# S3 Direct File Uploads in Elm

This is a simple library that allows you to upload files directly to Amazon S3 (or compatible services, except Digital Ocean Spaces which will rate limit you immediately).

## Usage

I've basically ripped this out of the [Senryu.pub](https://senryu.pub) editor for the moment, so documentation is

a bit thin on the ground, however the following code should be most of what is needed to get it working.

```elm

  -- Import this library

  import S3DirectFileUpload exposing (FileUpload)

  -- Other dependencies for the example code below

  import File exposing (File)

  import File.Select as Select

  import Html.Events exposing (onClick)

  import Task

  -- Example upload button in the view:

  uploadButton : Model -> Html Message

  uploadButton model =

    a [ class "btn", onClick Pick ]

      [ text "Upload images" ]

  update : Message -> Model -> (Model, Cmd Message)

  update message model =

    Pick ->

      ( model

      , Select.files ["image/*"] GotFiles

      )

    GotFiles file files ->

      let

        allFiles = (file :: files)

        commands =

          List.map

            (\file_ ->

              -- "media/sign" here is the endpoint on the application which generates some needed

              -- params for this to work. Shrine defaults to "/s3/params" when mounted, but you

              -- need it without the preceding / here, e.g. "s3/params"

              Task.attempt GotFileUpload (FileUpload.upload file_ "media/sign")

            )

            allFiles

      in

        ( model

        , Cmd.batch commands

        )

    GotFileUpload fileUpload ->

      case fileUpload of

        Err err ->

          -- Most likely a HTTP error

          -- Do something with the error, e.g.

          ( { model | state = Broken }, Cmd.none )

        Ok data ->

          -- Do something with the returned FileUpload type, e.g.

          saveToServer data

```