JS 401 loop error while generating a payment token-CodePudding

I'm trying to create a payment token for the payment gateway (Paymob Accept). When I check my browser console I get a loop POST error 401. I've attached two screenshots.

401 Loop Error

Error Details

My code is:

const API = 'APK_KEY'
async function firstStep() {
    let data = {
        "api_key": API
    }
    let request = fetch('https://accept.paymob.com/api/auth/tokens', {
        method: 'post',
        headers: {'content-type' : 'application/json'},
        body: JSON.stringify(data)
    })

    let response = (await request).json()
    let token = (await response).token

    secondStep(token)

}

async function secondStep(token) {
    let data = {
    "auth_token":  token,
    "delivery_needed": "false",
    "amount_cents": "100",
    "currency": "EGP",
    "items": [],
    }
    let request = await fetch('https://accept.paymob.com/api/ecommerce/orders', {
        method : 'POST',
        headers: {'content-type' : 'application/json'},
        body: JSON.stringify(data)
    })

    let response = request.json()
    let id = (await response).id
  
    secondStep()
}

async function thirdStep(token, id) {
    let data = {
        "auth_token": token,
        "amount_cents": "100", 
        "expiration": 3600, 
        "order_id": id,
        "billing_data": {
          "apartment": "803", 
          "email": "[email protected]", 
          "floor": "42", 
          "first_name": "Clifford", 
          "street": "Ethan Land", 
          "building": "8028", 
          "phone_number": " 86(8)9135210487", 
          "shipping_method": "PKG", 
          "postal_code": "01898", 
          "city": "Jaskolskiburgh", 
          "country": "CR", 
          "last_name": "Nicolas", 
          "state": "Utah"
        }, 
        "currency": "EGP", 
        "integration_id": 13034
      }
    let request = fetch('https://accept.paymob.com/api/acceptance/payment_keys', {
        method: 'post',
        headers: {'content-type' : 'application/json'},
        body: JSON.stringify(data)
    })

    let response = (await request).json()
    let finalToken = (await response).token

    cardPayment(finalToken)
}

async function cardPayment() {
    let iframeURL = `https://accept.paymob.com/api/acceptance/iframes/18922?payment_token=${finalToken}`
    console.log(iframeURL)
}
firstStep()

I tried each step in the console, stepOne and stepTwo work fine. After I added stepThree I get the error.

What am I missing? Thanks in advance for your support!

CodePudding user response：

Like said in the comment section, the secondStep is calling itself recursively, also without any arguments. This will cause an infinite loop. We fix it by calling thirdStep.

Also in the cardPayment function, you are using finalToken, which is not defined in the function. We fix it that by making it the argument.

const API = 'APK_KEY'
async function firstStep() {
    let data = {
        "api_key": API
    }
    let request = fetch('https://accept.paymob.com/api/auth/tokens', {
        method: 'post',
        headers: {'content-type' : 'application/json'},
        body: JSON.stringify(data)
    })

    let response = (await request).json()
    let token = (await response).token

    secondStep(token)
}

async function secondStep(token) {
    let data = {
    "auth_token":  token,
    "delivery_needed": "false",
    "amount_cents": "100",
    "currency": "EGP",
    "items": [],
    }
    let request = await fetch('https://accept.paymob.com/api/ecommerce/orders', {
        method : 'POST',
        headers: {'content-type' : 'application/json'},
        body: JSON.stringify(data)
    })

    let response = request.json()
    let id = (await response).id
  
    thirdStep(token, id)
}

async function thirdStep(token, id) {
    let data = {
        "auth_token": token,
        "amount_cents": "100", 
        "expiration": 3600, 
        "order_id": id,
        "billing_data": {
          "apartment": "803", 
          "email": "[email protected]", 
          "floor": "42", 
          "first_name": "Clifford", 
          "street": "Ethan Land", 
          "building": "8028", 
          "phone_number": " 86(8)9135210487", 
          "shipping_method": "PKG", 
          "postal_code": "01898", 
          "city": "Jaskolskiburgh", 
          "country": "CR", 
          "last_name": "Nicolas", 
          "state": "Utah"
        }, 
        "currency": "EGP", 
        "integration_id": 13034
      }
    let request = fetch('https://accept.paymob.com/api/acceptance/payment_keys', {
        method: 'post',
        headers: {'content-type' : 'application/json'},
        body: JSON.stringify(data)
    })

    let response = (await request).json()
    let finalToken = (await response).token

    cardPayment(finalToken)
}

async function cardPayment(finalToken) {
    let iframeURL = `https://accept.paymob.com/api/acceptance/iframes/18922?payment_token=${finalToken}`
    console.log(iframeURL)
}
firstStep()