CORS error when trying to access Razorpay Payments API

Viewed 1041

I'm using Razorpay's Payment API to get details of a payment:

const paymentData = await axios.get(
          `https://api.razorpay.com/v1/payments/${paymentId}`
        );
console.log("paymentData", paymentData);

After this is run, I get this error in the console:

Access to XMLHttpRequest at 'https://api.razorpay.com/v1/payments/{my-payment-id}' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

How do I overcome this?

Thanks in advance.

2 Answers

Razorpay APIs are not supposed to be used from a browser, most of the APIs require basic auth credentials which are pair of Key Id and Key secret, which can be generated from Razorpay Dashboard.

Since all the APIs require access using a secret, the APIs are not supposed to be accessed from the browser and hence the APIs are not designed to handle CORS request or requests with method OPTIONS

From Razorpay API doc:

All Razorpay APIs are authenticated using Basic Auth. Basic auth requires the following:

  • [YOUR_KEY_ID]
  • [YOUR_KEY_SECRET]

Basic auth expects an Authorization header for each request in the Basic base64token format. Here, base64token is a base64 encoded string of YOUR_KEY_ID:YOUR_KEY_SECRET.

Related