How to make a GET request to ContextualWeb image search API in JavaScript?

Question

I am using RapidAPI to access ContextualWeb image search API . The code examples which are given are for server side only: https://rapidapi.com/contextualwebsearch/api/web-search/

I am trying to integrate the API in a React JS app. How can I make the GET request in JavaScript ?

Here is a CURL example from the Rapid API web site:

curl --get --include 'https://contextualwebsearch-websearch-v1.p.rapidapi.com/api/Search/ImageSearchAPI?autoCorrect=false&pageNumber=1&pageSize=10&q=Taylor+Swift&safeSearch=false' \
  -H 'X-RapidAPI-Host: contextualwebsearch-websearch-v1.p.rapidapi.com' \
  -H 'X-RapidAPI-Key: XXXXXXXX'

The image search API should return a resulting JSON.

Answer 1

The given curl request translate to following fetch API (implemented by browsers) request.

const url ="https://contextualwebsearch-websearch-v1.p.rapidapi.com/api/Search/ImageSearchAPI?autoCorrect=false&pageNumber=1&pageSize=10&q=Taylor+Swift&safeSearch=false"
const options = {
  method: 'GET',
  headers: {
    "X-RapidAPI-Host": "contextualwebsearch-websearch-v1.p.rapidapi.com",
    "X-RapidAPI-Key": "XXXXXXXX"
  },
}

fetch(url, options)
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(e => console.error(e))