Tips for resolving Cross-Origin Resource Sharing (CORS) challenges in Dunzo's developer API when making calls from Nuxt.js with AX

Encountering a CORS error when attempting to use the Dunzo developer API. The base URL for the API can be found at

This is my code:

await axios
    .get("https://apis-staging.dunzo.in/api/v1/token", {
      headers: {
        "client-id": "<MY_CLIENT_ID>",
        "client-secret": "<MY_CLIENT_SECRET>",
        "Accept-Language": "en_US",
        "Content-Type": "application/json",
      },
    })
    .then((response) => {
      return res.status(200).json(response);
    })
    .catch((err) => {
      console.log("err =====", err);
      return res.status(400).json({
        error: err,
      });
    });

Answer №1

Shoutout to Kissu for helping me with this post (not the ideal solution though)

If you want to get around the CORS issue, which is not a recommended practice, you can follow these steps in your nuxt.config.js file:

axios: {
  proxy: true
},

proxy: {
  '/api': {
    target: 'http://back-url:<some-port>/',
    pathRewrite: { '^/api': '' }
  }
}

With this setup, you can make requests like this:

this.$axios.get('/api/some-getter-request')

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Guide to triggering a change event on a react-number-format component

I am attempting to trigger a change event in order to modify the value of a react-number-format component within my component. During testing, I encounter a TypeError: value.replace is not a function error on the simulate('change', event) method ...

The sidebar vanishes when you move your cursor over the text contained within

My issue is that the side menu keeps closing when I hover over the text inside it. The "About" text functions correctly, but the other three don't seem to work as intended. Despite trying various solutions, I am unable to identify the root cause of th ...

Attempting to switch between classes with the click of a button

I am attempting to create a basic animation that involves changing an image from A to B to C when a button is clicked. However, I am encountering an issue with the error message Cannot read properties of undefined (reading 'classList'). I am puzz ...

Trouble with initializing the Ionic map controller

I have a mobile app with 5 tabs, one of which features a map. However, the map only loads when directly accessed through the URL bar. It seems that the controller is not loaded when navigating to the map tab through the app, as indicated by console logs. S ...

The caching of AJAX POST requests is a common occurrence

In my web application, I have implemented a functionality where a POST request is sent to the URL /navigate.php and it works correctly. However, the challenge arises when the application needs to function offline. In such cases, I aim to display a notifica ...

Oops! Looks like there was an issue during the testing process with Postman

Encountering an issue during the API testing using Postman with error messages like "something went wrong" authRoute.js In the authRoute file, I have implemented the application logic. I need assistance in resolving the error. Additionally, I have attach ...

What is the reason for being unable to submit the value of an input that is disabled?

When I try to save the value of an input field that is disabled and has the required attribute, I receive an error message stating that "field_name is required". Why am I unable to insert a value when the input field is disabled? <input disabled type=&q ...

Animating toasts in Bootstrap

Exploring the options available at https://getbootstrap.com/docs/4.3/components/toasts/ To customize your toasts, you can pass options via data attributes or JavaScript. Simply append the option name to data- when using data attributes. If you're lo ...

Tips for sending information from PHP to Javascript using jQuery?

I am looking to move data from a PHP page that pulls information from MySQL, with the goal of displaying this data on my mobile app using Cordova. I plan to achieve this using JavaScript. Here is the PHP code I currently have implemented: if($count == ...

What is the best way to stop webpack from generating typescript errors for modules that are not being used?

The directory structure is set up as follows: └── src ├── tsconfig.json ├── core │ ├── [...].ts └── ui ├── [...].tsx └── tsconfig.json Within the frontend, I am importing a limi ...

"Converting GMT date time to a Unix TimeStamp in GMT with JavaScript: A Step-by-Step

There are a multitude of methods available for converting date time into Unix timestamp. The issue arises when trying to convert the date time of GMT into Unix timestamp as it displays the value of the timestamp based on my local timezone (Asia/Kolkata). ...

What is the best way to simulate an external class using jest?

My Vue page code looks like this: <template> // Button that triggers the submit method </template> <script> import { moveTo } from '@/lib/utils'; export default { components: { }, data() { }, methods: { async ...

Creating a triangle number pattern in JavaScript with a loop

Hi there, I'm currently facing an issue. I am trying to generate a triangular number pattern like the one shown below: Output: 1223334444333221 =22333444433322= ===3334444333=== ======4444====== I attempted to write a program for this, however, ...

jquery code to count the number of children in an html table

I'm struggling to grasp the behavior of the jquery method children. I can successfully count the number of <p> elements within a <div> using the following code: var abc = $("div").children("p"); alert(abc.length); However, when I a ...

What is the best method for showcasing a nested JSON value?

I need to show the data for the month of April. Here is the code snippet: {{my_dates['2018-04-23']}} This code displays: { "april":0, "may":0, "june":0, "july":0, "august":0, "september":0, "october":0, "income_trips":" ...

How to use JavaScript and regex to control the state of a disabled submit button

I have a challenge where I need to activate or deactivate a submission button in a form called btn-vote using JavaScript. The button will only be activated if one of the 10 radio buttons is selected. Additionally, if the person-10 radio button is chosen, t ...

Error: The function .default.auth.signout is not recognized in the REACT and Firebase environment

I've come across several error questions on StackOverflow, but most remain unanswered. The ones that are answered don't seem to solve my issue. I need help debugging this particular error. In my REACT project using Firebase, I'm working on ...

Refresh the dataTable once all external data has been successfully fetched

I am struggling to find the correct method for reloading a datatable. Here is my current process: Retrieve data through ajax for specific columns Generate a table with the fetched data Initialize the datatable for the table Make a new ajax request using ...

Error: FullCalendar does not display a header for the timeGridWeek view when the dates fall

Currently, I am integrating fullcalendar 5.5.0 with Angular 10. After migrating from fullcalendar v4 to v5, I noticed an annoying issue where the header for the date before the validRange start is no longer displayed: https://i.sstatic.net/kvVUW.png Thes ...

Customize the text that appears when there are no options available in an Autocomplete component using React

Recently, I came across this Autocomplete example from MaterialUI that caught my attention. https://codesandbox.io/s/81qc1 One thing that got me thinking was how to show a "No options found" message when there are no search results. ...