Godta betalinger
Oversikt
Fenerum integreres med ledende betalingsleverandører for å hjelpe deg med å innhente og administrere kundenes betalingsmetoder. Når et betalingskort er registrert i Fenerum, kan du automatisk belaste det for fakturaer og abonnementer.
Støttede leverandører:
Forutsetninger
Før du kan godta betalinger, konfigurer din betalingsleverandør i Fenerum:
- Gå til Settings → Integrations i Fenerum
- Legg til API-legitimasjon for din betalingsleverandør
- Aktiver betalingsgatewayen for din organisasjon
Stripe Integration
Slik fungerer det
Å integrere Stripe med Fenerum innebærer to trinn:
- Frontend: Innhent kortdetaljer med Stripe Elements (PCI-kompatibelt, kortdata går direkte til Stripe)
- Backend: Registrer Stripe payment method-ID hos Fenerum (serveren din, med sikker håndtering av token)
Sikkerhetsmerknad: Eksponer aldri din Fenerum API-token i frontend-kode. Kall alltid Fenerums API fra backend der token er trygt lagret i miljøvariabler.
Frontend: Innhent betalingsmetode
Bruk Stripe Elements til å innhente kortinformasjon sikkert. Kortdata sendes direkte til Stripe—serveren din ser dem aldri.
<!DOCTYPE html>
<html>
<head>
<title>Add Payment Method</title>
<script src="https://js.stripe.com/v3/"></script>
<style>
#payment-form { max-width: 500px; margin: 50px auto; padding: 20px; }
#card-element { border: 1px solid #ccc; padding: 10px; border-radius: 4px; }
button { margin-top: 20px; padding: 10px 20px; background: #5469d4; color: white; border: none; border-radius: 4px; cursor: pointer; }
button:hover { background: #4158c4; }
.success { color: green; margin-top: 20px; }
.error { color: red; margin-top: 20px; }
</style>
</head>
<body>
<form id="payment-form">
<h2>Add Payment Method</h2>
<div id="card-element"></div>
<button type="submit">Save Card</button>
<div id="message"></div>
</form>
<script>
// Initialize Stripe with your publishable key (safe for frontend)
const stripe = Stripe('pk_test_YOUR_PUBLISHABLE_KEY')
const elements = stripe.elements()
const cardElement = elements.create('card')
cardElement.mount('#card-element')
const form = document.getElementById('payment-form')
const messageDiv = document.getElementById('message')
form.addEventListener('submit', async (event) => {
event.preventDefault()
messageDiv.textContent = ''
// Step 1: Create payment method with Stripe (card data stays secure)
const {error, paymentMethod} = await stripe.createPaymentMethod({
type: 'card',
card: cardElement,
})
if (error) {
messageDiv.textContent = error.message
messageDiv.className = 'error'
return
}
// Step 2: Send ONLY the payment method ID to YOUR backend
<!-- focus-start -->
try {
const response = await fetch('/api/register-payment-card', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
paymentMethodId: paymentMethod.id,
accountId: 'ACCOUNT_UUID_HERE'
})
})
const data = await response.json()
<!-- focus-end -->
if (response.ok) {
messageDiv.textContent = `Card saved: ${data.brand} ending in ${data.card_number.slice(-4)}`
messageDiv.className = 'success'
form.reset()
} else {
messageDiv.textContent = data.error || 'Failed to save card'
messageDiv.className = 'error'
}
} catch (err) {
messageDiv.textContent = 'Network error: ' + err.message
messageDiv.className = 'error'
}
})
</script>
</body>
</html>Viktige punkter:
- Stripe publishable key (
pk_test_...) er trygg å bruke i frontend-kode - Kortdata sendes direkte til Stripe og berører aldri serveren din
- Kun payment method-ID sendes til backend-en din
- Ingen Fenerum API-token i frontend!
Backend: Registrer hos Fenerum
Backend-en din mottar Stripe payment method-ID og registrerer den hos Fenerum ved å bruke din API-token lagret i miljøvariabler.
// Example backend endpoint (works with Express, Fastify, Next.js, etc.)
// Endpoint: POST /api/register-payment-card
// Body: { paymentMethodId: string, accountId: string }
async function registerPaymentCard(req, res) {
const { paymentMethodId, accountId } = req.body
// Validate inputs
if (!paymentMethodId || !accountId) {
return res.status(400).json({ error: 'Missing required fields' })
}
<!-- focus-start -->
try {
// Call Fenerum API with token from environment variables
const response = await fetch('https://app.fenerum.com/api/v1/paymentcards/', {
method: 'POST',
headers: {
'Authorization': `Token ${process.env.FENERUM_API_TOKEN}`,
'X-Client-System': 'YourApp',
'Content-Type': 'application/json',
},
body: JSON.stringify({
account: accountId,
token: paymentMethodId,
gateway: 'stripe_new'
})
})
const data = await response.json()
<!-- focus-end -->
if (!response.ok) {
console.error('Fenerum API error:', data)
return res.status(response.status).json({
error: 'Failed to register card with Fenerum'
})
}
// Return success with card details
return res.status(200).json({
uuid: data.uuid,
brand: data.brand,
card_number: data.card_number,
month: data.month,
year: data.year
})
} catch (error) {
console.error('Error registering payment card:', error)
return res.status(500).json({ error: 'Internal server error' })
}
}Oppsett av miljøvariabler:
# .env file (NEVER commit this to version control!)
FENERUM_API_TOKEN=your_actual_token_hereEksempelrespons:
{
"uuid": "09655a26-12e0-4a82-8524-7851998886fc",
"brand": "Visa",
"card_number": "XXXXXXXXXXXX4242",
"month": 12,
"year": 2025
}Customer Self-Service
Anbefales: Bruk Fenerum Self-Service
Den beste måten å la kunder administrere betalingsmetoder på er via Fenerum Self-Service—en fullt hostet portal der kunder kan legge til betalingskort, administrere abonnementer og se fakturaer uten behov for koding.
Viktige fordeler:
- Kunder kan selv legge til og administrere betalingskort via Stripe eller Quickpay
- Automatisk integrasjon med din merkevareprofil
- Ingen koding nødvendig—aktiver det i organisasjonsinnstillingene
- Sikker autentisering via e-postlenke
API-integrasjon:
Generer en direkte tilgangslenke til Self-Service for kundene dine:
# Generate Self-Service access link
curl -X POST https://app.fenerum.com/api/self-service/initiate-organization/ \
-H "Authorization: Token YOUR_FENERUM_TOKEN" \
-H "X-Client-System: YourApp" \
-H "Content-Type: application/json" \
-d '{
"email": "customer@example.com"
}'Respons:
{
"url": "https://your-company.hostedsignup.com/access/abc123..."
}Send denne URL-en til kunden, så kan vedkommende umiddelbart få tilgang til kontooppsettet sitt for å legge til betalingskort og administrere abonnementer.
Når kunder legger til et betalingskort via Self-Service, gjør Fenerum automatisk følgende:
- Lagrer kortet på kontoen deres
- Setter "Betalingskort" som standard innkrevingsmetode
- Oppdaterer alle aktive abonnementer til å bruke den nye betalingsmetoden
Les mer: Self-Service-dokumentasjon
Quickpay Integration
Slik fungerer det
Fenerum bruker QuickPay subscriptions til å lagre betalingskort. Slik er flyten i integrasjonen:
- Backend: Opprett en QuickPay-betalingslenke via QuickPays API
- Frontend: Vis QuickPays betalingsskjema til kunden (kortdata går direkte til QuickPay)
- Callback: QuickPay sender en callback med abonnement-ID når det er fullført
- Backend: Registrer abonnement-ID-en hos Fenerum
Sikkerhetsmerknad: Alle API-kall (både QuickPay og Fenerum) må skje på backend der token lagres sikkert.
Trinn 1: Opprett QuickPay-betalingslenke
Backend-en din oppretter en QuickPay-betalingslenke via QuickPays payment link API.
// Backend endpoint to create QuickPay payment link
// Endpoint: POST /api/create-quickpay-link
// Body: { accountId: string, customerEmail: string }
async function createQuickpayLink(req, res) {
const { accountId, customerEmail } = req.body
<!-- focus-start -->
try {
// Create QuickPay payment (subscription)
const paymentResponse = await fetch('https://api.quickpay.net/payments', {
method: 'POST',
headers: {
'Authorization': `Basic ${Buffer.from(':' + process.env.QUICKPAY_API_KEY).toString('base64')}`,
'Accept-Version': 'v10',
'Content-Type': 'application/json'
},
body: JSON.stringify({
currency: 'DKK',
order_id: `sub_${accountId}_${Date.now()}`,
variables: {
fenerum_account_id: accountId,
customer_email: customerEmail
}
})
})
const payment = await paymentResponse.json()
// Create payment link for the subscription
const linkResponse = await fetch(`https://api.quickpay.net/payments/${payment.id}/link`, {
method: 'PUT',
headers: {
'Authorization': `Basic ${Buffer.from(':' + process.env.QUICKPAY_API_KEY).toString('base64')}`,
'Accept-Version': 'v10',
'Content-Type': 'application/json'
},
body: JSON.stringify({
amount: 0, // 0 for card authorization only
auto_capture: false,
callback_url: `${process.env.YOUR_DOMAIN}/api/quickpay-callback`
})
})
const link = await linkResponse.json()
<!-- focus-end -->
return res.json({ url: link.url })
} catch (error) {
console.error('Error creating QuickPay link:', error)
return res.status(500).json({ error: 'Internal server error' })
}
}Miljøoppsett:
QUICKPAY_API_KEY=your_quickpay_api_key_here
YOUR_DOMAIN=https://yourdomain.com
FENERUM_API_TOKEN=your_fenerum_token_hereTrinn 2: Omdirigeringsrute
Opprett en backend-rute som genererer QuickPay-lenken og omdirigerer kunden direkte til QuickPays hostede side.
// Backend redirect route
// When customer visits: GET /add-payment-card
// They are redirected to QuickPay's hosted payment page
async function redirectToQuickpay(req, res) {
// Get logged-in user's information from session/auth
const accountId = req.user.fenerumAccountId
const email = req.user.email
<!-- focus-start -->
try {
// Create QuickPay payment (subscription)
const paymentResponse = await fetch('https://api.quickpay.net/payments', {
method: 'POST',
headers: {
'Authorization': `Basic ${Buffer.from(':' + process.env.QUICKPAY_API_KEY).toString('base64')}`,
'Accept-Version': 'v10',
'Content-Type': 'application/json'
},
body: JSON.stringify({
currency: 'DKK',
order_id: `sub_${accountId}_${Date.now()}`,
variables: {
fenerum_account_id: accountId,
customer_email: email
}
})
})
const payment = await paymentResponse.json()
// Create payment link
const linkResponse = await fetch(`https://api.quickpay.net/payments/${payment.id}/link`, {
method: 'PUT',
headers: {
'Authorization': `Basic ${Buffer.from(':' + process.env.QUICKPAY_API_KEY).toString('base64')}`,
'Accept-Version': 'v10',
'Content-Type': 'application/json'
},
body: JSON.stringify({
amount: 0,
auto_capture: false,
callback_url: `${process.env.YOUR_DOMAIN}/api/quickpay-callback`
})
})
const link = await linkResponse.json()
// Redirect customer to QuickPay
return res.redirect(link.url)
<!-- focus-end -->
} catch (error) {
console.error('Error creating QuickPay link:', error)
return res.status(500).send('Failed to create payment link')
}
}Bruk:
Gi kundene en lenke til backend-ruten din:
<a href="/add-payment-card">Add Payment Method</a>Ruten bruker den innloggede brukerens økt for å hente konto-ID og e-post—ingen sensitiv data i URL-en.
Trinn 3: Håndter QuickPay-callback
Når kunden fullfører betalingsskjemaet, sender QuickPay en callback til serveren din med abonnement-ID.
// QuickPay callback handler
// Endpoint: POST /api/quickpay-callback
// Receives QuickPay callback when card is added
async function handleQuickpayCallback(req, res) {
const { id: subscriptionId, variables } = req.body
const accountId = variables?.fenerum_account_id
if (!subscriptionId || !accountId) {
return res.status(400).json({ error: 'Missing required data' })
}
<!-- focus-start -->
try {
// Register the QuickPay subscription with Fenerum
const response = await fetch('https://app.fenerum.com/api/v1/paymentcards/', {
method: 'POST',
headers: {
'Authorization': `Token ${process.env.FENERUM_API_TOKEN}`,
'X-Client-System': 'YourApp',
'Content-Type': 'application/json'
},
body: JSON.stringify({
account: accountId,
token: subscriptionId.toString(), // QuickPay subscription ID
gateway: 'quickpay'
})
})
const data = await response.json()
<!-- focus-end -->
if (response.ok) {
console.log('Payment card registered with Fenerum:', data)
return res.status(200).json({ success: true })
} else {
console.error('Failed to register card with Fenerum:', data)
return res.status(500).json({ error: 'Failed to register card' })
}
} catch (error) {
console.error('Error in QuickPay callback:', error)
return res.status(500).json({ error: 'Internal server error' })
}
}Respons fra Fenerum:
{
"uuid": "09655a26-12e0-4a82-8524-7851998886fc",
"brand": "Visa",
"card_number": "XXXXXXXXXXXX4242",
"month": 12,
"year": 2025,
"payment_gateway": "quickpay",
"account": "50e9aa0b-8d35-4da7-9a9b-8a35b11579b2"
}Viktige punkter:
- QuickPay-abonnement-ID må lagres som en streng i Fenerum
- Verdien for
gatewaymå værequickpay - Kortdata berører aldri serveren din—de går direkte til QuickPay
- Se QuickPay integration guide for oppsett
Customer Self-Service
Anbefales: Bruk Fenerum Self-Service
Den beste tilnærmingen er å bruke Fenerum Self-Service, der kunder selv kan legge til QuickPay-betalingskort gjennom den hostede portalen.
Self-Service-portalen støtter både Stripe og QuickPay som betalingsmetoder, og gir en enhetlig opplevelse for kundene dine. Se Customer Self-Service section under Stripe Integration ovenfor for API-integrasjonsdetaljer.
Administrere betalingskort
List opp kort for en konto
curl https://app.fenerum.com/api/v1/paymentcards/?account=CUST001 \
-H "Authorization: Token YOUR_FENERUM_TOKEN" \
-H "X-Client-System: YourApp"Respons:
{
"count": 2,
"next": null,
"previous": null,
"results": [
{
"uuid": "09655a26-12e0-4a82-8524-7851998886fc",
"active": true,
"brand": "Visa",
"card_number": "XXXXXXXXXXXX4242",
"month": 12,
"year": 2025,
"payment_gateway": "stripe_new",
"account": "50e9aa0b-8d35-4da7-9a9b-8a35b11579b2"
}
]
}Hent kortdetaljer
curl https://app.fenerum.com/api/v1/paymentcards/{card_uuid}/ \
-H "Authorization: Token YOUR_FENERUM_TOKEN" \
-H "X-Client-System: YourApp"Deaktiver et kort
curl -X POST https://app.fenerum.com/api/v1/paymentcards/{card_uuid}/disable/ \
-H "Authorization: Token YOUR_FENERUM_TOKEN" \
-H "X-Client-System: YourApp"Merk: Å deaktivere et kort i Fenerum sletter det ikke hos betalingsleverandøren. Det hindrer bare Fenerum i å belaste det.
Gateway-referanse
Når du oppretter betalingskort, bruk disse gateway-identifikatorene:
| Leverandør | Gateway-verdi | Token-type |
|---|---|---|
| Stripe | stripe_new | Payment Method ID (pm_...) |
| Quickpay | quickpay | Subscription ID (heltall) |
Feilsøking
Registrering av kort mislykkes:
- Verifiser legitimasjon for betalingsleverandøren i Fenerum-innstillingene
- Sjekk at konto-UUID finnes i Fenerum
- Kontroller at token-formatet samsvarer med gateway-typen (pm_... for Stripe, heltall for Quickpay)
- Bekreft at du bruker riktig gateway-verdi (
stripe_newellerquickpay)