NuxtJs Page Redirection With Backend

Question

I am building a website that include payment option with NuxtJs. But I am getting CORS error when i want to rediect to payment page of virtual POS integrator.

On backend side I am using Golang/Echo like this:

func startPaymentProcess(c echo.Context) {
    header := c.Response().Header()
    header.Add("Access-Control-Allow-Origin", "*")
    header.Add("Access-Control-Allow-Methods", "DELETE, POST, GET, OPTIONS")
    header.Add("Access-Control-Allow-Headers", "Content-Type, Authorization")

    //...
    // do some controls
    //..

    c.Redirect(http.StatusSeeOther, "https://web-test.vercel.app/workplace/payment/success")
}

On frontend axios call like this

export const SetSubscription = async () => {
  try {
    return await axios({
      method: "GET",
      url: API_URL + `/workplaces/payment-test`,
      headers: {
        "Authorization": shared.getAuthorizationHeader()
      }
    });
  } catch (error) {
    return error
  }
}

On developer console error like this:

Access to XMLHttpRequest at 'https://web-test.vercel.app/workplace/payment/success' (redirected from 'https://api.test.domain.tech/workplaces/payment-test') from origin 'https://web-test.vercel.app' has been blocked by CORS policy: Request header field authorization is not allowed by Access-Control-Allow-Headers in preflight response.
688030a.js:2 

GET https://web-test.vercel.app/workplace/subscription/success net::ERR_FAILED

On developer console network error like this: enter image description here

Which point that I'm missing?

Answer 1

Try adding withCredentials: true to the axios request's options