# Google Image return using Javascript

**URL:** <https://community.glideapps.com/t/google-image-return-using-javascript/69934>\
**Category:** Ask for Help\
**Created:** [January 24, 2024, 10:38am UTC](https://community.glideapps.com/t/google-image-return-using-javascript/69934 "2024-01-24T10:38:17Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Jon\_Lee](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jon_lee/32/54749_2.png) [@Jon\_Lee](https://community.glideapps.com/u/Jon_Lee)\
**Post date:** [January 24, 2024, 10:38am UTC](https://community.glideapps.com/t/google-image-return-using-javascript/69934/1 "2024-01-24T10:38:17Z")

</div>

I am building a travel app and want to automatically fill out an image for a location, eg a cafe to visit. As the normal resources like Pexels and unsplashed are too generic, I was looking to extract the first Google Image result.

I tried doing this using Bards help and got the following result:

Glide.fetch(‘[https://www.googleapis.com/customsearch/v1?key=YOUR\_API\_KEY&q=KEYWORD](https://www.googleapis.com/customsearch/v1?key=YOUR_API_KEY&cx=YOUR_CSE_ID&q=London+landmarks)’)

.then(response =\> {

const data = JSON.parse(response.body);

const firstImage = data.items[0].link;

// Use the firstImage URL as needed

})

.catch(error =\> {

console.error(error);

});

But I think the Glide.fetch is wrong and not initiating the code. Any JS gurus able to help?

---

<div class="post-metadata">

**Author:** ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)\
**Post date:** [January 24, 2024, 11:03am UTC](https://community.glideapps.com/t/google-image-return-using-javascript/69934/2 "2024-01-24T11:03:48Z")

</div>

yeah, there are a couple of things wrong with that 🙂

- there is no such thing as `Glide.fetch`, so that will fail right away
- the code doesn’t actually return anything
- your API key will be loaded on the client device, so it is potentially exposed

Which plan are you on?  
If you have a Business or Enterprise Plan, you may find this easier (and more secure) using a Call API action.

---

<div class="post-metadata">

**Author:** ![Jon\_Lee](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jon_lee/32/54749_2.png) [@Jon\_Lee](https://community.glideapps.com/u/Jon_Lee)\
**Post date:** [January 24, 2024, 11:37am UTC](https://community.glideapps.com/t/google-image-return-using-javascript/69934/3 "2024-01-24T11:37:42Z")

</div>

Thanks Darren. I am on Starter so don’t have access to Glide’s API’s. After more research I cant find a ways its possible which is a shame as the existing tools to automatically extract images are very generic.  
If there’s any advice on tools to use it that would be great. I have been trying out different google or bing API’s but cant work it to retrieve the direct URL to embed in the app.

---

<div class="post-metadata">

**Author:** ![Nataliya\_Kovaleva](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/nataliya_kovaleva/32/67518_2.png) [@Nataliya\_Kovaleva](https://community.glideapps.com/u/Nataliya_Kovaleva)\
**Post date:** [January 24, 2024, 11:40am UTC](https://community.glideapps.com/t/google-image-return-using-javascript/69934/4 "2024-01-24T11:40:59Z")

</div>

I wonder if the new Get Webpage Source may be useful in this case… 🤔

---

<div class="post-metadata">

**Author:** ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)\
**Post date:** [January 24, 2024, 12:07pm UTC](https://community.glideapps.com/t/google-image-return-using-javascript/69934/5 "2024-01-24T12:07:14Z")

</div>

One option on a Starter Plan would be to connect a Google Sheet, and use Apps Script to fetch the image link.

- Advantages  
– It will be secure  
– It will work
- Disadvantages  
– Requires some Apps Script knowledge  
– Will be slow, as you’ll have to wait for the sheet to sync

---

<div class="post-metadata">

**Author:** ![Yod](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/yod/32/64472_2.png) [@Yod](https://community.glideapps.com/u/Yod)\
**Post date:** [February 10, 2024, 11:06am UTC](https://community.glideapps.com/t/google-image-return-using-javascript/69934/6 "2024-02-10T11:06:38Z")

</div>

I’ve got this working in a google sheet without app scripts !

=MAP(B1:B;LAMBDA(n;{n\TRANSPOSE(QUERY(IMPORTXML(“[https://www.google.com/search?q=“&n&”&source=lnms&tbm=isch](https://www.google.com/search?q=%22&n&%22&source=lnms&tbm=isch)”; “//a//@src”);“where Col1 contains ‘image’ limit 2”))}))

Put this in a new column and have 3 columns after completly empty to let the map formula expand. The “B” column will be the one where every cell will be used for the google image searched.
