Airtable - upload images and files

Question

I am new to AirTable. I'm using is as the backend for my Flutter App. I see in my docs, that to upload an image or a file to the airtable, using an API, i need to provide a link to the image or file.

This is what my docs say:

To create new attachments in Picture and Resume, set the field value to an array of attachment objects. When creating an attachment, url is required, and filename is optional. Airtable will download the file at the given url and keep its own copy of it. All other attachment object properties will be generated server-side soon afterward.

Now, my question is, is there anyway to upload an image or file directly to the airtable? Meaning, if I understand correctly, to upload an image to the table, I first have to upload it to my own server, then get a link for that image, then send the link into the table. Is there a way to avoid this, and just upload to the airtable, and get the download link from there?

Bill Christo · Answer 1 · 2023-05-11T13:00:07.160

Unfortunately, at this time, there does not appear to be a method of directly uploading an attachment using Airtable's API. I have even tried sending a data URL, which is a method of embedding binary files as base64 encoded text within a URL string, like so: data:text/plain;base64,SGVsbG8sIFdvcmxkIQ==, but Airtable's API does not accept them.

The approach I am taking is using an Amazon S3 type storage account, setting an expiration policy, and using AWS SDK for JavaScript S3 Client for Node.js to upload to S3. Something like the following. You would then POST to Airtable's API using this format https://BUCKETNAME.REGION.digitaloceanspaces.com/hello-world.txt replacing BUCKETNAME, REGION, and the filename (KEY).

// Step 1: Import the S3Client object and all necessary SDK commands.
import { PutObjectCommand, S3Client } from "@aws-sdk/client-s3";

// Step 2: The s3Client function validates your request and directs it to your Space's specified endpoint using the AWS SDK.
const s3Client = new S3Client({
  endpoint: "https://nyc3.digitaloceanspaces.com", // Find your endpoint in the control panel, under Settings. Prepend "https://".
  forcePathStyle: false, // Configures to use subdomain/virtual calling format.
  region: "nyc3", // Must be "us-east-1" when creating new Spaces. Otherwise, use the region in your endpoint (e.g. nyc3).
  credentials: {
    accessKeyId: "XXXXXXXXXXXXX", // Access key pair. You can create access key pairs using the control panel or API.
    secretAccessKey: "XXXXXXXXX", // Secret access key defined through an environment variable.
  },
});

// Step 3: Define the parameters for the object you want to upload.
const params = {
  Bucket: "123-airtable-uploads", // The path to the directory you want to upload the object to, starting with your Space name.
  Key: "hello-world.txt", // Object key, referenced whenever you want to access this file later.
  Body: "Hello, World!", // The object's contents. This variable is an object, not a string.
  ACL: "public-read", // Defines ACL permissions, such as private or public.
};

// Step 4: Define a function that uploads your object using SDK's PutObjectCommand object and catches any errors.
const uploadObject = async () => {
  try {
    const data = await s3Client.send(new PutObjectCommand(params));
    console.log("Successfully uploaded object: " + params.Bucket + "/" + params.Key);
    return data;
  } catch (err) {
    console.log("Error", err);
  }
};

// Step 5: Call the uploadObject function.
uploadObject();

If you are not using JavaScript, Amazon likely offers other libraries as well.

Airtable - upload images and files

1 Answers1