Authorization error in spoonacular APi

I have been trying to get a data from spoonacular Api for my recipe application using this link https://api.spoonacular.com/recipes/complexSearch?apiKey=API_KEY&query=pasta
but it’s throwing an error while fetching the data.

Please Help!!!


here’s my code

let searchResultDiv = document.querySelector('.search-result');
let container = document.querySelector('.container');
let searchQuery = '';
let API_KEY ='';


searchForm.addEventListener('submit', (e)=>{
    e.preventDefault();
    searchQuery=e.target.querySelector('input').value;
    console.log(searchQuery);
    fetchAPI();
})

async function fetchAPI(){
    const baseURL = 'https://api.spoonacular.com/recipes/complexSearch?apiKey=API_KEY&query=pasta'
    const response = await fetch(baseURL);
    const data = await response.json();
    console.log(data);

}

What’s the error? Also, you’re publishing your API key

@DanCouper Query updated… please check now…

That is not how you add a variable to a URL string. You just have the literal string API_KEY in the URL. Either use template literals or string concatenation.

@lasjorg here’s my updated code but still not working

let searchForm = document.querySelector('form');
let searchResultDiv = document.querySelector('.search-result');
let container = document.querySelector('.container');
let searchQuery = 'pasta';

const api={
    key: '',
    base: 'https://api.spoonacular.com/recipes'
}

searchForm.addEventListener('submit', (e)=>{
    e.preventDefault();
    searchQuery=e.target.querySelector('input').value;
    console.log(searchQuery);
    
})

fetch(`${api.base}pasta?q=${searchQuery}&units=metric&APPID=${api.key}`)
.then( function (response){
    return response.json();
});

Log out your template string before using it in the fetch and examine it. Make sure the path makes sense.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.