DigitalOcean Spaces - Browser Upload with Presigned URL - CORS

Here is a quick guide to uploading a file from the browser to DO spaces.
It is crude, but will hopefully save sometime time and frustration.

I was getting an errors such as “SignatureDoesNotMatch” from DO, when it was a CORS issue.
Specifically, I think the CORS headers where not setup correctly.
They should be restricted again once your initial tests are working.

** Elixir Config**

config :ex_aws,
debug_requests: true,
json_codec: Jason,
access_key_id: “redacted”,
secret_access_key: “redacted”

config :ex_aws, :s3,
scheme: “https://”,
host: “nyc3.digitaloceanspaces.com”,
region: “nyc3”

** Elixir Function Snippet - Generate Presigned Url**

{:ok, presigned_url} = ExAws.Config.new(:s3) |> S3.presigned_url(:put, “redacted_bucket_name”, “somefile.zip”, expires_in: 3600)

** DigitalOcean Spaces - Advances CORS Configuration**

Screenshot - FuseBase

Origin: *
Methods: Tick all boxes
Allowed Headers: Allow all headers be setting the Header Name to *
Age: 0

** Frontend Uploads **

I’m using Uppy and the S3 plugin. AWS S3 | Uppy
But I won’t go into detail here on that.

There is some additional info at ExAws with DigitalOcean Spaces · Elixir
But it does not deal with CORS issues.