Calling Swiggy API

Swiggy is a popular food delivery platform, and while its API isn’t officially documented, many developers want to use its data for building fun apps. You might have noticed that even though you can see network requests in the browser, calling the API directly from your frontend often results in a CORS error. That’s because the API isn’t set up to handle cross-origin requests from the browser. Fixing CORS Error in Swiggy API The root cause of the CORS error is simple: Swiggy’s API doesn’t return the appropriate CORS headers. This isn’t usually an issue when you’re working from the backend, using tools like Postman, or even directly opening the URL in your browser, these environments aren’t subjected to the same cross-origin restrictions as your frontend code. To work around this issue on the frontend, you can use a CORS proxy. A CORS proxy, such as Corsfix, fetches the data on your behalf and then returns it with the proper CORS headers. This lets you fetch the datay from your frontend application without running into CORS errors. Swiggy API CORS Code Example Here’s a quick code example demonstrating how to use Corsfix to call Swiggy’s restaurant listing API without running into CORS errors. In this example, we’re simply fetching the data and logging the result to the console: const swiggyApiUrl = "https://www.swiggy.com/dapi/restaurants/list/v5?lat=18.97210&lng=72.82460"; fetch(`https://proxy.corsfix.com/?${swiggyApiUrl}`) .then((response) => { if (!response.ok) { throw new Error( `Network response was not ok, status: ${response.status}` ); } return response.json(); }) .then((data) => { // Process the API data as needed console.log("Swiggy API Data:", data); }) .catch((error) => { console.error("Error fetching data from Swiggy API:", error); }); This code bypasses the CORS restriction by using Corsfix to forward the request to Swiggy’s API and then returning the response with the appropriate CORS headers. The response will look something like this: { "statusCode": 0, "data": { "statusMessage": "done successfully", "pageOffset": { "nextOffset": "CJhlELQ4KICwopPHoJ+CajCnEzgC", "widgetOffset": { "NewListingView_category_bar_chicletranking_TwoRows": "", "NewListingView_category_bar_chicletranking_TwoRows_Rendition": "", "Restaurant_Group_WebView_PB_Theme": "", "Restaurant_Group_WebView_SEO_PB_Theme": "", "collectionV5RestaurantListWidget_SimRestoRelevance_food_seo": "9", "inlineFacetFilter": "", "restaurantCountWidget": "" } }, "cards": [...], "firstOffsetRequest": true, "cacheExpiryTime": 240, "nextFetch": 1 }, "tid": "eef3628e-4683-4a12-9663-80cd0709d3ab", "sid": "jwec1726-46b9-4578-82ee-f1e50fff5efb", "deviceId": "d5a5fba0-7a97-e91d-247d-979c51d1cfed", "csrfToken": "SeRwZNJ7sJ4T-jI0-kyjuCUFOzDT-J3ahOlJiJZo" } Conclusion Calling APIs that don’t support CORS, like Swiggy’s API, can be a headache, especially when everything seems to work fine in Postman or on the backend. However, you don’t have to be stuck with these limitations. By using a CORS proxy like Corsfix, you can fetch the data you need directly from your frontend without encountering CORS issues. Give Corsfix a try for your development projects, it’s free to start with, and you only need to upgrade when you move to production.

Apr 7, 2025 - 10:40

Swiggy is a popular food delivery platform, and while its API isn’t officially documented, many developers want to use its data for building fun apps. You might have noticed that even though you can see network requests in the browser, calling the API directly from your frontend often results in a CORS error. That’s because the API isn’t set up to handle cross-origin requests from the browser.

Fixing CORS Error in Swiggy API

The root cause of the CORS error is simple: Swiggy’s API doesn’t return the appropriate CORS headers. This isn’t usually an issue when you’re working from the backend, using tools like Postman, or even directly opening the URL in your browser, these environments aren’t subjected to the same cross-origin restrictions as your frontend code.

To work around this issue on the frontend, you can use a CORS proxy. A CORS proxy, such as Corsfix, fetches the data on your behalf and then returns it with the proper CORS headers. This lets you fetch the datay from your frontend application without running into CORS errors.

Swiggy API CORS Code Example

Here’s a quick code example demonstrating how to use Corsfix to call Swiggy’s restaurant listing API without running into CORS errors. In this example, we’re simply fetching the data and logging the result to the console:

const swiggyApiUrl =
  "https://www.swiggy.com/dapi/restaurants/list/v5?lat=18.97210&lng=72.82460";

fetch(`https://proxy.corsfix.com/?${swiggyApiUrl}`)
  .then((response) => {
    if (!response.ok) {
      throw new Error(
        `Network response was not ok, status: ${response.status}`
      );
    }
    return response.json();
  })
  .then((data) => {
    // Process the API data as needed
    console.log("Swiggy API Data:", data);
  })
  .catch((error) => {
    console.error("Error fetching data from Swiggy API:", error);
  });

This code bypasses the CORS restriction by using Corsfix to forward the request to Swiggy’s API and then returning the response with the appropriate CORS headers.

The response will look something like this:

{
  "statusCode": 0,
  "data": {
    "statusMessage": "done successfully",
    "pageOffset": {
      "nextOffset": "CJhlELQ4KICwopPHoJ+CajCnEzgC",
      "widgetOffset": {
        "NewListingView_category_bar_chicletranking_TwoRows": "",
        "NewListingView_category_bar_chicletranking_TwoRows_Rendition": "",
        "Restaurant_Group_WebView_PB_Theme": "",
        "Restaurant_Group_WebView_SEO_PB_Theme": "",
        "collectionV5RestaurantListWidget_SimRestoRelevance_food_seo": "9",
        "inlineFacetFilter": "",
        "restaurantCountWidget": ""
      }
    },
    "cards": [...],
    "firstOffsetRequest": true,
    "cacheExpiryTime": 240,
    "nextFetch": 1
  },
  "tid": "eef3628e-4683-4a12-9663-80cd0709d3ab",
  "sid": "jwec1726-46b9-4578-82ee-f1e50fff5efb",
  "deviceId": "d5a5fba0-7a97-e91d-247d-979c51d1cfed",
  "csrfToken": "SeRwZNJ7sJ4T-jI0-kyjuCUFOzDT-J3ahOlJiJZo"
}

Conclusion

Calling APIs that don’t support CORS, like Swiggy’s API, can be a headache, especially when everything seems to work fine in Postman or on the backend. However, you don’t have to be stuck with these limitations. By using a CORS proxy like Corsfix, you can fetch the data you need directly from your frontend without encountering CORS issues.

Give Corsfix a try for your development projects, it’s free to start with, and you only need to upgrade when you move to production.