Lookup Cocktails or Ingredients Using IDs
Learn how to use API-assigned IDs to look up cocktails or ingredients.
We'll cover the following
When we search for a cocktail or an ingredient by name, we might get a big list of products with similar names, which we’ll have to go through to locate the necessary information. Searching by API-assigned ID returns only the information we need, saving us the time and effort of manual searching.
Fetch required info using ID
TheCocktailDB API provides us with an endpoint with which we can search for the cocktails or ingredients using the API-assigned IDs. The base URI for this endpoint is https://www.thecocktaildb.com/api/json/v1/1/lookup.php
.
Request parameter
We can use any one of the following query parameters with this endpoint:
Parameters | Type | Category | Description |
| Integer | Optional | Used to search for a cocktail using its API-assigned ID |
| Integer | Optional | Used to search for an ingredient using its API-assigned ID |
We can obtain these IDs using the endpoints discussed in the previous lesson.
Note: We need to use one of these parameters with this endpoint. Calling it without any query parameters will return an error.
When we combine the query parameter, i
, with the base URI of this endpoint, it can be used to look up a cocktail using its ID. The code below demonstrates how we can get the cocktail recipe using the cocktail ID.
const endpointUrl = new URL('https://www.thecocktaildb.com/api/json/v1/1/lookup.php');const queryParameters = new URLSearchParams({i: '11007' // 11007 is the API-assigned ID for margarita});const options = {method: 'GET'};async function fetchCocktailByID() {try {endpointUrl.search = queryParameters;const response = await fetch(endpointUrl, options);printResponse(response);}catch (error) {printError(error);}}fetchCocktailByID();
Following is a brief explanation of the above code:
Line 1: We define the URL of the endpoint.
Lines 3–9: We define the query parameter and set the appropriate request type.
Lines 11–21: We define the
fetchCocktailbyID()
function that calls the endpoint and prints the response.Line 23: We call the
fetchCocktailbyID()
function.
We can replace the ID 11007
in line 4 with the ID of any other cocktail to get its details.
Similarly, we can look up an ingredient using the query parameter, iid
, with this endpoint. The code below shows how we can fetch information about an ingredient using its ID.
const endpointUrl = new URL('https://www.thecocktaildb.com/api/json/v1/1/lookup.php');const queryParameters = new URLSearchParams({iid: '552' // 552 is the API-assigned ID for cordial});const options = {method: 'GET'};async function fetchIngredientByID() {try {endpointUrl.search = queryParameters;const response = await fetch(endpointUrl, options);printResponse(response);}catch (error) {printError(error);}}fetchIngredientByID();
Let’s look at how we’ve modified the code:
- Line 4: We replace
i
withiid
. - Line 11: We change the name of the function to
fetchIngredientsbyID()
.
We can get the information about other ingredients by replacing 552
in line 4 with the ID of the other ingredients. The table below contains the API-assigned IDs of some cocktails we can use:
Cocktail | API-assigned ID |
3-Mile Long Island Iced Tea | 15300 |
A Furlong Too Late | 17831 |
Absolutely Fabulous | 17224 |
Champagne Cocktail | 11227 |
Abbey Martini | 17223 |
Response fields
The table below contains some important response fields:
Response field | Associated query parameter | Type | Description |
|
| Integer | The API-assigned ID of the drink |
|
| String | The name of the drink retrieved by this endpoint |
|
| String | The category of the drink |
|
| String | The instructions to prepare the drink |
|
| String | A link for the image of the drink |
|
| String | The names of the required ingredients to make the drink |
|
| String | The amount of ingredients required to make the drink |
|
| Integer | The API-assigned ID of the ingredient |
|
| String | The name of the ingredient retrieved by this endpoint |
|
| String | Information about the ingredient |
Note: The value of some of the response objects might be
null
depending on the availability of the data.