javascriptvue.jsamazon-pay

How to authorize amazon pay request to "get checkout session"?


I've been trying to integrate Amazon pay as a payment method for customers on my website but am running into issues with some of what's detailed in the documentation. I'm hoping to better understand the request headers that are to be associated with a call to the amazon pay api.

I'm making a request to 'https://pay-api.amazon.com/v2/checkoutSessions/checkoutSessionId' and receiving a CORS policy error.

Access to fetch at 'https://pay-api.amazon.com/v2/checkoutSessions/d9b4418d-0c6f-4085-8c37-08bef6da6807' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Here is the fetch request where I am trying to make the request

fetch(`https://pay-api.amazon.com/v2/checkoutSessions/${this.$route.query.amazonCheckoutSessionId}`, {
    method: 'GET',
    headers: {
      'Content-Type': 'application/json',
      'authorization': 'Px2e5oHhQZ88vVhc0DO%2FsShHj8MDDg%3DEXAMPLESIGNATURE',
      'x-amz-pay-date': `${new Date()}`
    }
  })

this.$route.query.amazonCheckoutSessionId references the returned url extension after the user creates a checkout session using the amazon pay button.

The documentation outlines a request should be made as follows

curl "https://pay-api.amazon.com/:version/checkoutSessions/:checkoutSessionId"
-X GET
-H "authorization:Px2e5oHhQZ88vVhc0DO%2FsShHj8MDDg%3DEXAMPLESIGNATURE"
-H "x-amz-pay-date:20201012T235046Z"

Can someone please explain where I'm supposed to get the authorization string and its format? Also, is there a way to easily format a date string into the format displayed in the documentation? Or does the date string format not matter?

I have searched quite extensively through the stack overflow posts associated with Amazon pay (of which there are few) as well as searching other Amazon and AWS documentation for elaboration on how to format the auth string. Unfortunately, I can't seem to find an answer. I have also tried passing my button signature as my authorization string, but that didn't seem to help.

Thank you for any help you can give.


Solution

  • There are two parts to your problem:

    1. The API is not designed to listen to Browser JS (AJAX) requests as in your sample. The CORS restriction is in place to prevent this. Rather this part of the process is to be done on the server side
    2. To use the API, I would strongly recommend using one of the SDKs (https://pay.amazon.co.uk/help/201212390?ld=APUKLPADirect). You will notice in the docs (https://developer.amazon.com/docs/amazon-pay-checkout/add-the-amazon-pay-button.html), that they always have the code samples for all four offered SDKs. So it is much easier to follow those instructions.enter image description here