Get Screenshots from URLs in Airtable

In this guide, we'll get screenshots for a list of URLs in Airtable. We'll first use the Data Fetcher Airtable app with the microlink.io API to turn URLs into screenshot URLs. Then we'll use the Scripting app to update the convert these into the raw image files as an attachment in Airtable.

Set up Airtable

  • Create a table called 'Screenshots'.
  • Create a field called 'URL' where you will input the URLs you want to screenshot.
  • Create a field called 'Screenshot URL' with type 'URL'.
  • Create a field called 'Screenshot file' with type 'Attachment'.
Screenshot 2021-05-10 at 18.58.37.png
  • Create a new Grid view called 'To process' with the following filters:
    • The 'URL' field is not empty.
    • The 'Screenshot URL' field is empty.
Screenshot 2021-05-10 at 19.00.21.png

Install Data Fetcher

Get Screenshots from URLs in Airtable

  • On the home screen of the Data Fetcher app, click 'Create request'.

Screenshot 2021-02-17 at 16.12.14.png
  • On the create request screen, enter the request name 'Get URL Screenshots'.
  • We're going to use the Microlink API to create screenshots. Microlink will create screenshots, and return them as a URL for a hosted image file of the screenshot (which we'll later turn into an attachment). If you'd like, you can read Microlink's API documentation here.
  • On the create request screen, enter the following URL:

https://api.microlink.io/?screenshot=true

  • Add a parameter called url with the value of ***Screenshots*URL***. This is a reference to the 'URL' field in our 'Screenshots' table and means the values in the table will get substituted when we run the request.
  • Set the 'Output Table' to the 'Screenshots' table.
  • Set the 'Output View' to the 'To process' view.
  • Click 'Advanced' to open the Advanced settings and under 'Run on multiple records', select the 'Screenshots' table and 'To process' view.
Screenshot 2021-09-28 at 14.19.33.png

Screenshot 2021-05-10 at 19.15.44.png
  • Click 'Run'. You'll see a loading message while the request runs, then the response field mapping modal will open. This is where we select which fields from microlink to keep and how they should map to our Airtable fields.
  • Click 'Filter all' to deselect all fields, then re-add the following field mapping:
Screenshot 2021-05-11 at 08.57.57.png
  • Click 'Confirm'. The request will run again for every record in the 'To process' view, adding a screenshot URL to each and moving them out of the view.
  • Click 'Save'.
  • If you have more screenshots, you can simply add them to the table, then click 'Run' to run the request again.
  • Microlink's API will let you take 50 screenshots a month for free, then you need to upgrade. If you do this you need to add a header in Data Fetcher with value x-api-key and the value of your microlink API key. You'll also need to change the base URL from api.microlink.io to pro.microlink.io.

Convert Screenshot URLs to Attachments

// Change the names of this table/fields according to your base.
let submissionsTable = base.getTable('Screenshots');
let urlField = submissionsTable.getField('Screenshot URL');
let attachmentField = submissionsTable.getField('Screenshot file');

let submissionsQuery = await submissionsTable.selectRecordsAsync({
    fields: [urlField, attachmentField]
});

let updates = [];

for (let record of submissionsQuery.records) {
    let url = record.getCellValue(urlField);
    let attachments = record.getCellValue(attachmentField);

    // If this record already has an attachment, skip it.
    if (url === null || attachments !== null) {
        continue;
    }

    // Otherwise, attach the image at the URL.
    updates.push({
        id: record.id,
        fields: {
            [attachmentField.id]: [{
                url: url
            }]
        }
    });
}

// Update records in batches of 50.
while (updates.length > 0) {
    await submissionsTable.updateRecordsAsync(updates.slice(0, 50));
    updates = updates.slice(50);
}
  • Click 'Run'. The script will convert every 'Screenshot URL' field to a file in the 'Screenshot File' field.
Screenshot 2021-05-11 at 09.12.23.png

Get Screenshots in Airtable on a Schedule

At the moment we have to convert our URLs to screenshots manually by clicking the 'Run' button. Using Data Fetcher's scheduled requests feature we can import them on a schedule, e.g. every Monday.

  • In Data Fetcher, scroll to 'Schedule'.
  • You will need a paid account to use this feature, so click the link to upgrade your account if you haven't already. After upgrading, click the 'I've done this' button.
  • Add your Airtable API key if you haven't already.
  • Turn on 'Schedule this API request'.
  • Set how often you want the request to run.
  • Click 'Save'.
Screenshot 2021-05-10 at 09.07.04.png