AWS S3

UI Bakery allows you to easily connect to your Amazon S3 bucket with no need for additional layers like APIs or third-party services.

Configuration

Prerequisites

There are certain steps you need to take first before connecting your AWS S3 datasource to UI Bakery:

• Create an S3 bucket

• Allow CORS for S3 file upload

• Create IAM user

• Generate Access key ID and Secret access key ID

Creating an S3 bucket

Log in to your AWS console, go to the S3 page, and click Create bucket. Here, specify bucket name, select a region, and set bucket permissions.

Allowing CORS for S3 file upload

If you are planning to use the S3 file uploader component in UI Bakery, you need to set up CORS policies for your bucket.

To do so, navigate to your Bucket Settings > Permissions, then scroll to the Cross-origin resource sharing (CORS) section. For the cloud version of UI Bakery, add the following JSON:

[
  {
    "AllowedOrigins": ["https://*.uibakery.io"],
    "AllowedMethods": ["PUT", "POST", "DELETE"],
    "AllowedHeaders": ["*"]
  },
  {
    "AllowedOrigins": ["*"],
    "AllowedMethods": ["GET"]
  }
]

If you're using a self-hosted or managed version of UI Bakery on a custom domain, you need to use the domain where you run your UI Bakery platform in the AllowedOrigins section. Usually, it equals the value of the UI_BAKERY_APP_SERVER_NAME environment variable.

Creating IAM user

After you have set up your bucket, you need to create an IAM user that will be used to access your S3 data.

On the S3 page, navigate to Identity and Access Management (IAM) > Users, and click Add Users. After entering user name, you will be prompted to set up the permissions of your IAM user. In Permission options, select Attach policies directly and in Permissions policies, select AmazonS3FullAccess.

When running UI Bakery in the Production environment, we strongly recommend limiting IAM user's access to the exact bucket that user is allowed to access. In this case, you can use the Amazon Resource Name (ARN) of the bucket you created in a custom policy. Refer to AWS documentation for instructions on writing IAM policies.

Generating Access key Id and Secret access key ID

Once you created your IAM user, the next step is to create access keys that could be used by UI Bakery. In IAM user's settings, click on Security credentials, scroll down to the Access keys section, and click Create access key. For the access key type, select Third-party service.

Copy the created Access key ID and Secret access key ID and save them for later.

Connecting the data source

After you've completed all the steps above, you can now proceed to connecting your AWS S3 data source. Follow the instruction below👇

1. On the Data sources page, click Connect, and select AWS S3 in the Data sources list.

2. Enter the data source name and specify all other connection settings:

   1. Paste the Access key ID and Secret access key ID you've created before.

   2. If you're using AssumeRole, specify it in the Role to assume (ARN) field.

You can also specify the Default S3 bucket name - this value can be overridden in an action or in the S3 file uploader component.

1. Click Test connection to check whether the data source can be connected, and then click Connect Datasource.

Check out the following pages for more S3-related information👇

S3 compatible endpoints (DigitalOcean spaces)

S3 query