Skip to content
/
First Payment
Last updated

First Payment

This guide walks through the complete end-to-end flow for processing your first payment with Nelnet Payment Services (NPS).

By the end of this guide, you will:

  • Authenticate using Bearer (JWT) authentication
  • Embed the hosted tokenization iframe
  • Securely collect payment details in the browser
  • Receive a payment token
  • Submit that token to the Payments API to process a transaction

Important
All integrations must use the NPS tokenization iframe or embedded Payment Widget. Sensitive payment details never touch your servers.

How the Flow Works

  1. Your backend creates a JWT using your API keys
  2. Your backend creates a payment session
  3. Your frontend loads the tokenization iframe
  4. The browser tokenizes payment details
  5. Your backend submits the token to the Payments API

Prerequisites

Before you begin, make sure you have:

  • An NPS API Key ID and API Key
  • A backend service capable of creating JWTs
  • A web page where you can embed the tokenization iframe

Never expose API keys or secrets in client-side code.

Step 1: Create a JWT for API Authentication (Backend)

All NPS backend APIs use Bearer authentication with a short-lived JWT.

JWT Requirements

  • Algorithm: HS512
  • Authorization Header: Authorization: Bearer <JWT>
  • Required Claims:
    • sub – API Key ID
    • iat – Issued-at timestamp
    • exp – Expiration timestamp

Example: Creating a JWT (Node.js)

import jwt from 'jsonwebtoken';

function createJwt() {
  const payload = {
    sub: process.env.NPS_API_KEY_ID,
    iat: Math.floor(Date.now() / 1000),
    exp: Math.floor(Date.now() / 1000) + 300
  };

  return jwt.sign(payload, process.env.NPS_API_KEY, {
    algorithm: 'HS512'
  });
}

Step 2: Create a Payment Session (Backend)

Before loading the tokenization iframe, your backend must create a payment session.

Example Backend Endpoint

app.post('/create-payment-session', async (req, res) => {
  const jwt = createJwt();

  const response = await fetch('https://api.nelnetpay.com/tokenization/session', {
    method: 'POST',
    headers: {
      Authorization: `Bearer ${jwt}`,
      'Content-Type': 'application/json'
    }
  });

  const session = await response.json();

  res.json({
    sessionId: session.id,
    sessionToken: session.token,
    expiresAt: session.expiresAt
  });
});

Step 3: Load the Tokenization SDK (Frontend)

<script src="https://cdn.nelnetpay.com/sdk/v1.0.0/nps.js"></script>
<div id="payment-form"></div>

Step 4: Initialize the Tokenization Iframe (Frontend)

async function initializePayment() {
  const response = await fetch('/create-payment-session', { method: 'POST' });
  const { sessionId, sessionToken } = await response.json();

  const nps = new NPS({
    sessionId,
    sessionToken,
    onReady: () => console.log('Payment form ready'),
    onError: console.error
  });

  nps.mount('#payment-form', { paymentMethod: 'card' });
  return nps;
}

Step 5: Tokenize Payment Details (Frontend)

const result = await nps.tokenize({
  amount: 49.99,
  cardholderName: 'Jane Doe',
  billingAddress: {
    name: 'Jane Doe',
    street: '123 Main St',
    city: 'Omaha',
    state: 'NE',
    postalCode: '68102',
    country: 'US'
  }
});

Fraud, Risk & Validation

During tokenization, NPS automatically performs:

  • Fraud analytics using transaction context and metadata
  • Bot and abuse detection
  • Embedded CAPTCHA challenges (when enabled)

If a merchant is configured for CAPTCHA:

  • A user-interactable challenge may be presented inside the iframe
  • Tokenization cannot complete until the challenge is resolved

Tokenization Response Details

In addition to the payment token, the tokenization response may include:

Credit Card Payments

  • BIN information (card network, issuer metadata)
  • Surcharge calculations, if enabled for the merchant
  • Card brand and funding indicators

These values can be used to:

  • Display surcharges before processing
  • Adjust final amounts
  • Drive merchant/partner checkout logic and UX decisions

Step 6: Process the Payment (Backend)

{
  "entityId": 1325691045,
  "transactionType": "SALE",
  "amount": 49.99,
  "paymentType": {
    "creditCard": {
      "token": "4NTSIT839d9b1234"
    }
  },
  "accountHolder": {
    "accountHolderName": "Jane Doe",
    "ipAddress": "10.10.10.10"
  }
}

Payments API Endpoint

POST https://api.nelnetpay.com/payments
Authorization: Bearer <JWT>
Content-Type: application/json
Previous page
Next page