Wasabi Cloud Storage

Demo to preview the settings:

Introduction

Wasabi Hot Cloud Storage is enterprise-class, tier-free, instantly available storage and allows you to store an infinite amount of data affordably. Upload & manage files with your Wasabi account.

Prerequisites

You must have an account with Wasabi to interact with the API. Create your account at: https://wasabi.com/

Tutorial

How to setup

Visit wasabi.com to sign up for their service, you will get an email with link to your console. In your Wasabi console go to Billing->Payment settings then add your Payment method. While you do receive a month free trial to upload private files, a paid account is required to upload public files.
Next, go to the Access Keys page & create a new access key.
Image without caption
Image without caption
Insert the access key/secret from the plugins tab.
Image without caption
Add the element 'Wasabi S3' on your page and configure any other preferences for uploading.​
Image without caption

Plugin Fields, Events, Actions, and States

Plugin contains 3 elements, 14 actions, and 1 API Call.

Wasabi S3

The main element of the plugin. Allow uploading and other interactions with Wasabi.
Image without caption
Image without caption
Image without caption

Fields

Access Key - the access key that is in the downloaded file.
Secret Key - the access key that is in the downloaded file. Session token - is particularly used in situations where temporary authentication is needed, such as when an application needs to access AWS resources on behalf of the user but does not want to share the user's permanent credentials. In this case, the session token can be generated through an authentication and authorization process and then used to perform operations on AWS resources for a certain period of time.
Using the session token can contribute to the security of applications because it allows for limiting privileges and access duration for AWS resources, minimizing exposure of users' or applications' permanent credentials (get the temporary keys once using the "Create Temporary Credentials" action).
SSE key - (optional) In order to use Wasabi server side encryption fill-in this field with 256-bit, base64-encoded encryption key. You can use "Create SSE-C Key" action to create the key.
Type - Set this to 'File (Wasabi)'.
Type - Set this to 'Uploaded File (Wasabi)'.
Type - Set this to 'Retrieved File (Wasabi)'.
Image without caption
Private - Using an access token has full control. No one else has access rights, not public. Yes or No
Bucket Name - The name of the Bucket you would like to upload to. Case sensitive.
Image without caption
Bucket Region - The region of where this Bucket is stored. Enter one of the following: us-west-1, eu-central-1, us-east-1, us-east-2.
Image without caption
Folder Structure - The folder structure of where this file should be saved (example: uploads). You can also specify sub-folders (eg: uploads/images). As a suggestion, you could save the folder as the current user/thing's unique id.
Image without caption
File Name Prefix - Prefix for the file name. Some special characters (for example: !$#@), will not upload correctly.
Input Text - Add text to the input, default Bubble typeface styles will apply. If you would like to style your own input in Bubble, make your element hidden on the page & then use the workflow action to trigger input.
Accept - Specify the file extension(s) (e.g.: .gif, .jpg, .png, .doc) the user can pick from or specify a group of file types like audio/, video/ image/*. Defaults to all if empty. In the case of an extension not validating correctly, you can also use the mime type here.
ℹ️
Note: If you specify β€œimage/heic” only, the iOS user has to upload image as File instead of Photo. When uploading as a Photo, IOS converts heic to jpg on the phone side before sending it for upload.
Max File Size - Total value for all files in bytes, 1000000 = 1MB (Megabyte) or 5000000000 is 5GB (Gigabytes). Defaults to any size if empty.
Max File Count - Max number of files the user can upload. Defaults to any amount if empty.
Auto Submit - Upload the files instantly to the Wasabi S3 server.
Complete Reset - Reset progress & input when a file or all files have been uploaded successfully.
Compress Images - Select this option to compress the size of image files.
Compression Size - The size for image compression, this value is in KB.
Generate Preview - Output base46 URLs for image files when the 'Read Files' option is selected.
Multiple Files - Allow for uploading multiple files at once.
Read Files - Read the input's files and return Name, Extension, Last Modified, Parameters & Size that will be output into the state 'Files'. If generate previews is selected this will also return a base64 URL for each image file. If complete reset is yes and auto submit is yes files will not be read.
Upload Directory - Allows the user to select 1 folder to upload, all child folders and files will be selected. This option is non-standard, supported by most newer browsers except IE.
Filter File Names - Separate with space & commas between names if not dynamic. Only matched (case-sensitive) names will be uploaded, the matching process happens first before calculating the size file count or reading any other file data. Leave empty to ignore this option.
Rename Files - rename uploaded files or not.
File Names - New names for files.

States

Files - list of uploaded files. Contains info about the file.
Image without caption
Full name
Name with extension
Text
Prefix
Prefix for the file name
Text
Name
Name of file without extension
Text
Type
Mime type of the file
Text
Size
Size in bytes
Number
Extension
Extension of the file
Text
Last Modified
Time when the file was modified.
Date
S3 URL
Full path to the file.
Text
Full Name Encoded
Name with extension with encoded special charts
Text
Name
Name without extension with encoded special charts
Text
Location
Path to file is included folder structure and full name. Can be used for action Generate pre sign URL
Text
Files Count - Return a number of uploaded files.
File Size Total - Return the total size of uploaded files.
Upload Progress - Upload the progress of files. From 0 to 100.
Last Uploaded Files - List of all uploaded files.
Retrieved Buckets - List of retrieved buckets returned by the action Retrieve Buckets
Retrieved Files - List of retrieved files returned by the action Retrieve Files
Is Ready - return true if the element is ready
Is Dragged Over - if a file is being dragged over a valid drop target return true else return false
Is Mobile - return true if the user device is mobile, else return false
Is Reading Files - while files are reading return true else return false
Is Uploading - if the element now upload files to Wasabi return true else return false
Error - return the text of the error
Is Compressing Images - if the element now compress images return true else return false
Is Retrieving Files - if element now retrieve files return true else return false
Is Deleting Files - if element now delete files return true else return false
Chosen Files Count - Return number of chosen files.

Actions

Trigger Input - emulate click on input and show file dialog.

Upload - Start uploading files to Wasabi.

Reset File Uploader - Remove all files from this element. Reset states: Files (to the empty list ), Files Count (to 0), File Size Total (to 0), Upload Progress (to 0), Is Uploading (to false), Is Reading Files (to false).

Download File - download a file from Wasabi.

Create Bucket - create a new bucket.

Delete Bucket - delete bucket.

Retrieve Buckets - retrieve a list with all buckets from your Wasabi.

Reset Retrieved Buckets - set value of state Retrieved Buckets to empty list.

Retrieve Files - retrieve all files from the selected bucket.

Reset Retrieved Files - set value of state Retrieved Files to an empty list.

Delete Files/Folders - Delete files and folders from the selected bucket

Remove File From Input - remove the file from the element.

Add Files To Input - through the popup, allows adding new files from the device to the S3 element.

Cancel Upload - cancel current files uploading

Upload Base64 - upload base64 encoded file to Wasabi.

Create a folder

Upload File To Wasabi From Another Cloud

Progress Bar

Display graphically uploading status.
Image without caption

Fields

Percentage - current percent of upload. Can be numbers from 0 to 100
Background Color - The background color of the bar
Progress Color - Color of the progress banner Radius - Radius of the background bar
Outer Radius - Radius of the progress bar

Data Size

Convert bytes to a more readable value.​
Image without caption

Fields

Bytes - Bytes to evaluate.
Decimal - Round to decimal place.

Explain - Explains the size abbreviation in brackets. Actions

  1. Generate Presigned URL
    1. All objects in your bucket, by default, are private. These objects are only accessible by the object owner’s permission.
      However, there might be instances where the object owner might have to share these objects with others by creating a pre-signed URL, using their own security credentials, for a specific duration of time to download the objects.
      Image without caption

      Fields

      Bucket Name - The name of the Bucket you would like to upload to. Case sensitive.
      Bucket Region - The region where this Bucket is stored. Enter one of the following: us-west-1, eu-central-1, us-east-1, us-east-2.
      Filename with path - Full path to the file with the filename. Example: "path/to/file/filename.png"
      Timeslot - Timeslot to use for expiration time.
      ☝
      Note: If "Hours" is selected then expires time expected in hours.
      Expires Time - The time to expire the pre-signed URL operation in.
      βŒ›
      Note: The maximum value of expiration time is 7 days.
  1. Create Temporary Credentials
    1. The "Create Temporary Credentials" function in AWS (Amazon Web Services) allows the generation of temporary access keys and a security token using the AWS Security Token Service (STS). These temporary keys can be used for authentication and authorization requests to other AWS services, as well as for accessing AWS resources. This function is useful in several scenarios, including:”Temporary authentication”, β€œAccess delegation”, β€œAccess controlβ€œ, β€œImproved security”. Essentially, the "Create Temporary Credentials" function provides a flexible and secure mechanism for managing access to AWS resources in distributed environments with complex security requirements and access control needs.
      Image without caption
      Duration Seconds - DurationSeconds is a parameter to specify how long the temporary keys created will be valid. Minimum value: 900 seconds (15 minutes), Maximum value: 3600 seconds (1 hour). Return: Access Key Id, Secret Access Key, Session Token, Expiration
  1. Upload File To Wasabi From Another Cloud
    1. This API Call allows uploading files to your Wasabi Cloud Storage from another cloud storage (for example all uploaded in base files are saved to AWS S3 and you have a URL of them ).
      For an API call to work, you need to enter Wasabi Access Key and Secret Key.
      Image without caption
      ❗
      This API Call is in BETA mode. Max upload file size = 300MB. If you try to upload files with a larger size, it may respond with an error text message.

      Fields

      Image without caption
      Private - Using an access token has full control. No one else has access rights, not public. false or true.
      Bucket_Name - The name of the Bucket you would like to upload to. Case sensitive.
      Bucket_Region - The region where this Bucket is stored. Enter one of the following: us-west-1, eu-central-1, us-east-1, us-east-2.
      Folder_Structure - The folder structure of where this file should be saved (example: uploads). You can also specify subfolders (eg: uploads/images). As a suggestion, you could save the folder as the current user/thing's unique id.
      Filename_Prefix - Prefix for the file name. Some special characters (for example: !$#@), will not upload correctly.
      Filename - File name to save on Wasabi S3 with extension (.png, .mp3, etc.)
      URL_From_Another_Cloud - URL of the file​.

      Response

      Return text contains the URL of the file from the wasabi cloud or an error message.
  1. Upload File To Wasabi From Another Cloud with SSE
    1. The same API call as Upload File To Wasabi From Another Cloud but with field SSE
      This API Call allows uploading files to your Wasabi Cloud Storage from another cloud storage with Wasabi Server Side encription.
      For an API call to work, you need to enter Wasabi Access Key, Secret Key and sse_key.
      Image without caption
      ❗
      This API Call is in BETA mode. Max upload file size = 300MB. If you try to upload files with a larger size, it may respond with an error text message.

      Fields

      Image without caption
      Private - Using an access token has full control. No one else has access rights, not public. false or true.
      Bucket_Name - The name of the Bucket you would like to upload to. Case sensitive.
      Bucket_Region - The region where this Bucket is stored. Enter one of the following: us-west-1, eu-central-1, us-east-1, us-east-2.
      Folder_Structure - The folder structure of where this file should be saved (example: uploads). You can also specify subfolders (eg: uploads/images). As a suggestion, you could save the folder as the current user/thing's unique id.
      Filename_Prefix - Prefix for the file name. Some special characters (for example: !$#@), will not upload correctly.
      Filename - File name to save on Wasabi S3 with extension (.png, .mp3, etc.)
      URL_From_Another_Cloud - URL of the file.

      Response

      Return text contains the URL of the file from the wasabi cloud or an error message.
  1. Create SSE-C Key
    1. This actions generates a random base64-encoded encryption key for Wasabi to use to encrypt or decrypt your data.
      Run the action and save the result to a state or to a database to use it later in others actions. You will need only β€œSSE Customer Key” state in the plugins actions.
      Image without caption
      ❗
      NOTE: Wasabi does not store the encryption key you provide. If you lose the encryption key, any GET request for an object without its encryption key fails, and you lose the object.
  1. Create Bucket - server side action
    1. Image without caption
      Fields:
      • Bucket Name - Must be unique, valid DNS name, 63 characters or less. Case sensitive.
      • Bucket Region - Enter one of the following: us-west-1, eu-central-1, us-east-1, us-east-2.

Use Cases

1. Restrict access to the bucket (allows access only to application visitors).

By default, public use of a bucket, folder, or file is allowed only by certain paid (not trial) accounts. If your account does not have access to this feature, contact Wasabi Support atΒ support@wasabi.comΒ for assistance.
❗
Restricting access to a specific HTTP referrer Suppose that you have a website with a domain name (www.example.com or example.com) with links to photos and videos stored in your Wasabi bucket, YOUR_WEB_SITE_FULL_URL. By default, all the Wasabi resources are private, so only the account that created the resources can access them. To allow read access to these objects from your website, you can add a bucket policy that allows permission with a condition, that the get request must originate from specific web pages.
  1. Go to your Wasabi console
Image without caption
2. Go to bucket settings
Image without caption
Image without caption
3. Go to tab "POLICIES"
Image without caption
4. Add code to this area
Image without caption
javascript
{ "Version": "2012-10-17", "Statement": [ { "Effect": "Allow", "Principal": { "AWS": "*" }, "Action": "s3:*", "Resource": "*", "Condition": { "StringLike": { "aws:Referer": "YOUR_WEB_SITE_FULL_URL" } } } ] }
And Save
Image without caption

2. Restrict access to the bucket (deny access to all except the application visitors).

You can make your files private only for those who are trying to access them through a Bubble app. In your WASABI account, open your list of buckets and select the one you want to protect. Click in Settings.
By default, public use of a bucket, folder, or file is allowed only by certain paid (not trial) accounts. If your account does not have access to this feature, contact Wasabi Support atΒ support@wasabi.comΒ for assistance.
Image without caption
Go to the POLICIES tab
Image without caption
Paste the code below
javascript
{ "Id": "acceptsonlyhttpreferer", "Version": "2012-10-17", "Statement": [ { "Sid": "Public", "Effect": "Deny", "Principal": { "AWS": "*" }, "Action": "s3:GetObject", "Resource": "arn:aws:s3:::YOUR_BUCKET_NAME_HERE/*", "Condition": { "StringNotLike": { "aws:Referer": [ "https://YOUR_BUBBLE_APP_URL_HERE/", "https://YOUR_BUBBLE_APP_URL_HERE/*", "https://console.wasabisys.com/", "https://console.wasabisys.com/*" ] } } } ] }
When all this is set up, your files will be only accessible through
  • Your Bubble app
  • WASABI Console
Even if you copy and paste the file URL in your browser, it will not work. It will only work if the click comes from your app or from Wasabi console.

Quick setup

Place element on the page

Image without caption

Setup your element

Image without caption
βœ…
To correctly configure the fields named Type read the documentation attached to them.
Image without caption

Choose restrictions for uploading files

Image without caption

Change bucket

Image without caption
Image without caption

Customize the file type perceived by the element

Image without caption
βœ…
A filename extension, file extension, or file type is an identifier specified as a suffix to the name of a computer file. The extension indicates a characteristic of the file contents or its intended use. More Information... Example of Extensions:
  • .jpg - JPEG has been the most widely used image compression standard in the world.
  • .psd - Photoshop Document (PSD) is a raster format for storing graphic information using lossless compression, created specifically for Adobe Photoshop and supporting all its capabilities.
  • .pdf - Portable Document Format (PDF) is a file format developed by Adobe in 1993 to present documents, including text formatting and images, in a manner independent of application software, hardware, and operating systems.
  • etc.
Groups of file types:
  1. audio/* -any audio file.
  1. video/* -any video file.
  1. image/* -any image file.

You can allow Auto Submit (Auto upload files to Wasabi after selection) and skip the next steps.

Image without caption
​If you do not want the files to be automatically loaded, you need to set up an action for this action.

Check if Auto Submit is disabled ("no")

Image without caption

Add a button or other element to trigger the action

Image without caption

And setup workflow

Image without caption
Image without caption

If Redefine Fields is "no" - workflow setup is finished.

❕
You have the option to change the trash can by reconfiguring the upload endpoint in the action. To do this, specify the value of the field "redefined fields" to yes and specify a new bucket.

Object Lifecycle Mangement

The Object Lifecycle Management feature establishes a Lifecycle policy with rules to define actions that you want Wasabi to take during the life of an object.
⚠️
This feature replaces the need to manually delete an object after a retention period.

Creating a Lifecycle Rule in Dashboard.

Image without caption
Image without caption
The Lifecycle feature is only supported for new buckets. Create a new bucket in order to create and apply lifecycle rules.
  • ClickΒ CREATE NEW RULE. The Lifecycle Rule Settings panel is displayed.
  • Enter a name for the Lifecycle rule. For example:
Image without caption
  • Choose the scope of the rule. You can:β€” Limit the scope of the rule by using filters.Β Continue with Step 6.β€” Apply the rule to all objects in the bucket.Β Skip to Step 7.
  • Filter options are provided when you choose to limit the scope of the rule. You can filter by a name prefix and/or the size of the object. For size, you can enter the minimum and/or maximum size in bytes, kilobytes, megabytes, or gigabytes.
Image without caption
  • Check at least one of the Action options. Follow the on-screen instructions for the selected option(s), as described inΒ Lifecycle Rule ActionsΒ below.
  • ClickΒ CREATE.
A rule list is displayed. Each rule is shown with its name, status, scope, and action information.
Image without caption

Troubleshooting

If you need to create a folder or file with diacritic you need to use text formatted as URL Encoded:
Image without caption

Workflow example

How to use the Pre-signed URL

New Beta Element and Actions πŸš€

Wasabi Cloud Storage (BETA)

Changelogs

Share
Content