Authentication & tokens

dropin never sees a password or an OAuth flow: your backend is the identity provider. It signs a short-lived HS256 JWT locally with your tenant’s api_secret — zero network calls to dropin to mint one — and hands that token to the client. apiSecret must never reach the browser; only @dropin/server (Node-only) can use it.

Mint a user token (server only)

server

// server-only — never bundle this into a browser build
import { DropInServer } from '@dropin/server'

const server = new DropInServer({
  tenantId: process.env.DROPIN_TENANT_ID!,
  apiKey: process.env.DROPIN_API_KEY!,
  apiSecret: process.env.DROPIN_SIGNING_SECRET!,
  url: 'https://api.getnodex.cloud',
})

// Inside your own token endpoint, after you've authenticated the caller yourself:
const token = await server.createUserToken(userId, { expiresIn: '1h' }) // max 24h

expiresIn accepts "30s", "15m", "1h", "1d"-style strings and is capped at 24 hours — a longer value throws before a token the gateway would reject is even minted.

There’s no client- or react-side equivalent: minting requires apiSecret, which only ever lives on your server.

Construct a client with a tokenProvider

The client (and the React provider wrapping it) never holds apiSecret — only a tokenProvider callback that fetches a token from your own backend endpoint. tokenProvider is called once on init and again on a 401, not per request (spec §9).

client

import { DropInClient } from '@dropin/client'

const client = new DropInClient({
  url: 'https://api.getnodex.cloud',
  apiKey: process.env.NEXT_PUBLIC_DROPIN_API_KEY!,
  tokenProvider: async () => {
    const res = await fetch('/api/token')
    const { token } = await res.json()
    return token
  },
})

react

import { DropInProvider } from '@dropin/react'

function Providers({ children }: { children: React.ReactNode }) {
  return (
    <DropInProvider
      url={process.env.NEXT_PUBLIC_DROPIN_API_URL!}
      apiKey={process.env.NEXT_PUBLIC_DROPIN_API_KEY!}
      tokenProvider={async () => {
        const res = await fetch('/api/token')
        return (await res.json()).token as string
      }}
    >
      {children}
    </DropInProvider>
  )
}

DropInProvider also accepts an already-constructed client directly: <DropInProvider client={myClient}> — useful if you need to build the DropInClient yourself (e.g. to share it outside React).