Skip to main content

Save Images from Unsplash

JonathanBowen
Forum|alt.badge.img+18

This base uses the Unsplash API to search for images and save them to your base for review.

The base is published on the Airtable Universe here.

To use this base, copy it from the Universe into your workspace. You will need an Airtable Pro account and access to the scripting block to make it work.

To get going, go to the Unsplash Developer pages, create an account, then create an Unsplash application. This will create an access key and a secret key for the app (we only need the access key).

Open the script block in Airtable, click on “Edit” and replace the access key default string with your access key:

Close the script editor and run the script. You will be prompted to enter a search term:

Enter your term and click on “Next”. The script will pull 10 images from Unsplash using their API based on your search term. These will be stored in the “Photos” table:

For a nicer look, switch to the gallery view:

The script saves the image, the image link, the photographer’s name and the search term you entered.

The script is marked up with comments to explain what it is doing at each step, but any questions, please add a comment below.

Happy photo hunting!

JB

    H
    W
    S
    4 people like this
    • H
      Hiroshi328_Staf
    • W
      Wonderweb_Wonde
    • S
      Sam_Fischer
    • B
      Borja_ROMERO_OR

    8 replies

    JonathanBowen
    Forum|alt.badge.img+18
    • JonathanBowen
    • Author
    • Inspiring
    • 1110 replies
    • February 22, 2020

    This is the script:

    // Add your Unsplash API access key here
let access_key = "YOUR_API_ACCESS_KEY";

// set the unsplash search url
let unsplash_url = 'https://api.unsplash.com/search/photos?query=';

// get the search term from the user
let query = await input.textAsync('Enter a photo search term');

// make the full unsplash url to be queried
let url = unsplash_url + query.toLowerCase();

// set the headers required to make the API call to Unsplash
let headers = {
    "Accept-Version": "v1",
    "Authorization": "Client-ID " + access_key
}

// set the table that stores the photos
let table = base.getTable("Photos");

// make the API call
let response = await fetch(url, {
    method: "GET",
    headers: headers
})

// get the API response
let data = await response.json();

// for each result in the response, create a record in Airtable
// saving the photographer's name, link to the photo on Unsplash 
// and save the photo into Airtable
// Other fields are returned - uncomment the console.log below to see options
data.results.forEach(async photo => {
    // console.log(photo);
    let newRecord = await table.createRecordAsync({
        "Search Term": query,
        "Photographer": photo.user.name,
        "Link": photo.links.html,
        "Photo": [{"url": photo.urls.regular}]
    });    
})
    B
    Forum|alt.badge.img+13
    • BobBannanas
    • Known Participant
    • 28 replies
    • February 23, 2020
    JonathanBowen wrote:

    This is the script:

    // Add your Unsplash API access key here
let access_key = "YOUR_API_ACCESS_KEY";

// set the unsplash search url
let unsplash_url = 'https://api.unsplash.com/search/photos?query=';

// get the search term from the user
let query = await input.textAsync('Enter a photo search term');

// make the full unsplash url to be queried
let url = unsplash_url + query.toLowerCase();

// set the headers required to make the API call to Unsplash
let headers = {
    "Accept-Version": "v1",
    "Authorization": "Client-ID " + access_key
}

// set the table that stores the photos
let table = base.getTable("Photos");

// make the API call
let response = await fetch(url, {
    method: "GET",
    headers: headers
})

// get the API response
let data = await response.json();

// for each result in the response, create a record in Airtable
// saving the photographer's name, link to the photo on Unsplash 
// and save the photo into Airtable
// Other fields are returned - uncomment the console.log below to see options
data.results.forEach(async photo => {
    // console.log(photo);
    let newRecord = await table.createRecordAsync({
        "Search Term": query,
        "Photographer": photo.user.name,
        "Link": photo.links.html,
        "Photo": [{"url": photo.urls.regular}]
    });    
})

    This is pretty nifty.

    Makes me think what can be done with automated pdf creation.

    ie:

    1. http post html string with airtable field data
    2. response -> upload pdf into attachment field

    this would sort of solve the feature request where folks would like to “save the PDF from page designer” to the record


    https://pdfcrowd.com/

    JonathanBowen
    Forum|alt.badge.img+18
    • JonathanBowen
    • Author
    • Inspiring
    • 1110 replies
    • February 25, 2020

    I’ve had to unpublish the base from the Airtable Universe for now. There were some breaking changes to the Script Block (see here). Not a big deal for my example above, but now when you access the base from the Universe the script is lost and the default script shown.

    In the meantime, here’s a link that users can access the base with:

    JB

    K
    Forum|alt.badge.img+4
    • Kasra
    • Inspiring
    • 192 replies
    • February 27, 2020
    JonathanBowen wrote:

    I’ve had to unpublish the base from the Airtable Universe for now. There were some breaking changes to the Script Block (see here). Not a big deal for my example above, but now when you access the base from the Universe the script is lost and the default script shown.

    In the meantime, here’s a link that users can access the base with:

    JB


    @JonathanBowen we just added a setting for controlling when scripts should be shared:

    Do you mind turning that on in your shared base & re-publishing to Universe? Thank you!

    JonathanBowen
    Forum|alt.badge.img+18
    • JonathanBowen
    • Author
    • Inspiring
    • 1110 replies
    • February 27, 2020

    @Kasra - thanks, now working here:

    K
    1 person likes this
    • K
      Kasra
    H
    JonathanBowen wrote:

    This is the script:

    // Add your Unsplash API access key here
let access_key = "YOUR_API_ACCESS_KEY";

// set the unsplash search url
let unsplash_url = 'https://api.unsplash.com/search/photos?query=';

// get the search term from the user
let query = await input.textAsync('Enter a photo search term');

// make the full unsplash url to be queried
let url = unsplash_url + query.toLowerCase();

// set the headers required to make the API call to Unsplash
let headers = {
    "Accept-Version": "v1",
    "Authorization": "Client-ID " + access_key
}

// set the table that stores the photos
let table = base.getTable("Photos");

// make the API call
let response = await fetch(url, {
    method: "GET",
    headers: headers
})

// get the API response
let data = await response.json();

// for each result in the response, create a record in Airtable
// saving the photographer's name, link to the photo on Unsplash 
// and save the photo into Airtable
// Other fields are returned - uncomment the console.log below to see options
data.results.forEach(async photo => {
    // console.log(photo);
    let newRecord = await table.createRecordAsync({
        "Search Term": query,
        "Photographer": photo.user.name,
        "Link": photo.links.html,
        "Photo": [{"url": photo.urls.regular}]
    });    
})

    Thanks a lot. This is pretty useful. My first script and it was a great experience understanding how it works.

    JonathanBowen
    1 person likes this
    • JonathanBowen
      JonathanBowen
    M
    • Marco1
    • New Participant
    • 1 reply
    • November 9, 2021
    JonathanBowen wrote:

    @Kasra - thanks, now working here:


    Hey @JonathanBowen ,
    Seems like all the links to your base are broken. Would you mind re-sharing it? Would help out a ton :pray:

    JonathanBowen
    Forum|alt.badge.img+18
    • JonathanBowen
    • Author
    • Inspiring
    • 1110 replies
    • November 11, 2021
    Marco1 wrote:

    Hey @JonathanBowen ,
    Seems like all the links to your base are broken. Would you mind re-sharing it? Would help out a ton :pray:


    Hi @Marco1 - I don’t have this base in the universe any more, but if you create a base and add a table (named Photos) with the following fields:

    • ID - autonumber
    • Search term - single line text
    • Photographer - single line text
    • Link - URL
    • Photo - attachment

    Then add the script further up in this post. It should all work OK.

    Reply


    Most helpful members this week

    Terms & Conditions