javascript fetch responding with a 403 error

Question

I am trying to make a recipe app that shows recipes related to the users kitchen items. I am using the spoonacular API with rapidapi and I keep getting a 403 result of the fetch can someone help?

This is my code:

const fetch = require("node-fetch");
fetch("https://spoonacular-recipe-food-nutrition-v1.p.rapidapi.com/recipes/findByIngredients?ingredients=apples%2Cflour%2Csugar&number=5&ranking=1&ignorePantry=true", {
    "method": "GET",
    "headers": {
        "x-rapidapi-key": "I used the premade  rapidapi key from their website examples, i think that thats my key",
        "x-rapidapi-host": "spoonacular-recipe-food-nutrition-v1.p.rapidapi.com"
    }
})
.then(response => {
    console.log(response);
})
.catch(err => {
    console.error(err);
});

and this is the result I am getting:

Response {
  size: 0,
  timeout: 0,
  [Symbol(Body internals)]: {
    body: PassThrough {
      _readableState: [ReadableState],
      _events: [Object: null prototype],
      _eventsCount: 2,
      _maxListeners: undefined,
      _writableState: [WritableState],
      allowHalfOpen: true,
      [Symbol(kCapture)]: false,
      [Symbol(kTransformState)]: [Object]
    },
    disturbed: false,
    error: null
  },
  [Symbol(Response internals)]: {
    url: 'https://spoonacular-recipe-food-nutrition-v1.p.rapidapi.com/recipes/findByIngredients?ingredients=apples%2Cflour%2Csugar&number=5&ranking=1&ignorePantry=true',
    status: 403,
    statusText: 'Forbidden',
    headers: Headers { [Symbol(map)]: [Object: null prototype] },
    counter: 0
  }
}

If I write response.body instead as someone commented the result is:

PassThrough {
  _readableState: ReadableState {
    objectMode: false,
    highWaterMark: 16384,
    buffer: BufferList { head: [Object], tail: [Object], length: 1 },
    length: 49,
    pipes: [],
    flowing: null,
    ended: true,
    endEmitted: false,
    reading: false,
    sync: false,
    needReadable: false,
    emittedReadable: false,
    readableListening: false,
    resumeScheduled: false,
    errorEmitted: false,
    emitClose: true,
    autoDestroy: true,
    destroyed: false,
    errored: null,
    closed: false,
    closeEmitted: false,
    defaultEncoding: 'utf8',
    awaitDrainWriters: null,
    multiAwaitDrain: false,
    readingMore: false,
    decoder: null,
    encoding: null,
    [Symbol(kPaused)]: null
  },
  _events: [Object: null prototype] {
    prefinish: [Function: prefinish],
    error: [Function (anonymous)]
  },
  _eventsCount: 2,
  _maxListeners: undefined,
  _writableState: WritableState {
    objectMode: false,
    highWaterMark: 16384,
    finalCalled: false,
    needDrain: false,
    ending: true,
    ended: true,
    finished: true,
    destroyed: false,
    decodeStrings: true,
    defaultEncoding: 'utf8',
    length: 0,
    writing: false,
    corked: 0,
    sync: false,
    bufferProcessing: false,
    onwrite: [Function: bound onwrite],
    writecb: null,
    writelen: 0,
    afterWriteTickInfo: null,
    buffered: [],
    bufferedIndex: 0,
    allBuffers: true,
    allNoop: true,
    pendingcb: 0,
    prefinished: true,
    errorEmitted: false,
    emitClose: true,
    autoDestroy: true,
    errored: null,
    closed: false
  },
  allowHalfOpen: true,
  [Symbol(kCapture)]: false,
  [Symbol(kTransformState)]: {
    afterTransform: [Function: bound afterTransform],
    needTransform: false,
    transforming: false,
    writecb: null,
    writechunk: null,
    writeencoding: 'buffer'
  }
}

Check what the actual response body contained, likely you’ll find a human-readable error message in there. — CBroe, Mar 09 '21 at 10:40
thanks for responding, when i write that it still does not work, i edited the post and thats what happens if i do that :) — DominikDev, Mar 09 '21 at 11:17

score 0 · Answer 1 · answered Aug 27 '21 at 07:58

I'm assuming you're already subscribed to this API. I checked this API, and the following code is working fine for me.

fetch("https://spoonacular-recipe-food-nutrition-v1.p.rapidapi.com/recipes/findByIngredients?ingredients=apples%2Cflour%2Csugar&number=5&ignorePantry=true&ranking=1", {
    "method": "GET",
    "headers": {
        "x-rapidapi-host": "spoonacular-recipe-food-nutrition-v1.p.rapidapi.com",
        "x-rapidapi-key": "**************************************"
}
})
.then(response => {
    console.log(response);
})
.catch(err => {
    console.error(err);
});

Generally, the main cause of the 403 status code is a mistyped URL. However, the only difference between your code and mine code is in the URL — rearrangement of query parameters. A properly written application is not ordered sensitive but sometimes it matters if the application is not well written. So you can use the code that RapidAPI provides in the code-snippet generator.

Moreover, the 403 status code is sometimes caused by the browser itself. So try after switching the browser if the error still persists.

Remember, you can always write to the support team (support@rapidapi.com) of RapidAPI.

javascript fetch responding with a 403 error

1 Answers1