# Bruksområder for handels-API-et: sju løsninger du ikke kan bygge med en widget

> Når en butikkwidget ikke har riktig form: handel innebygd i SaaS, kataloger på flere flater, white label-butikker, skreddersydd brukeropplevelse, AI-agenter og egen BI. Pluss kodeeksempler fra Shoprocket JS SDK.

Ryan Badger - 4. august 2025 - 5 min lesing

## Hva et nettbutikk-API for innbygging er til for

De fleste nettbutikkplattformer gir deg en widget. Lim inn et skript, få en butikkfront. Fungerer fint for 95 % av butikkene.

Et handels-API er det du strekker deg etter når du vil gjøre noe en widget ikke kan: vise produkter inne i ditt eget grensesnitt, bygge kassen inn i et SaaS-dashbord, distribuere en katalog på flere flater (web + mobil + stemme), eller bygge skreddersydde kjøpsflyter som ingen plattform leverer ferdig.

Shoprocket leverer begge deler. [Widgeten](https://v3.shoprocket.io/nb/blogg/headless-commerce-tre-nivaer-reelle-alternativer-og-hva-du-trenger.md) er standarden. [`@shoprocket/core`-SDK-en](https://github.com/shoprocket/shoprocket-js) er for når du vokser ut av widgeten, eller aldri trengte en til å begynne med.

## Bruksområder som krever et API, ikke en widget

Dette er løsningene der en widget ikke er nok. Hvis ideen din står på denne listen, er du i API-land.

### 1. Handel inne i SaaS-produktet ditt

SaaS-dashbordet ditt har allerede sitt eget grensesnitt. Du vil at kundene skal kunne kjøpe tillegg, kredittpakker, premiumnivåer eller fysisk merch uten å forlate appen din.

En widget ville hatt feil form: den kjenner ikke brukerne dine, passer ikke inn i designsystemet ditt, og forutsetter en butikkfront som fyller hele siden. Med API-et kan du vise produktkort med dine egne komponenter, kalle `cart.addItem()` ved knappeklikk, og åpne et eget kassepanel (eller sende kunden videre til en hostet kasse hvis du vil utsette etterlevelsesarbeidet).

```
import { ShoprocketCore } from '@shoprocket/core'

const sr = new ShoprocketCore({ publicKey: 'pk_...' })

// Vis tilleggsflisene i SaaS-dashbordet ditt
const addons = await sr.products.list({ category: 'addons' })

// Brukeren klikker på knappen // User clicks "Add credits" buttonquot;Legg til kreditter// User clicks "Add credits" buttonquot;
await sr.cart.addItem(addon.id, 1)
```

### 2. Katalog på flere flater (web + native app + stemme + chat)

Én produktkatalog, vist ulikt på hvert sted. Nettbutikken viser full produktinformasjon, den native iOS-appen viser en kompakt liste, stemmeassistenten beskriver varene høyt, og en chatintegrasjon svarer med en lenke man kan kjøpe fra.

Alle fire flatene kaller samme API. Når du oppdaterer prisen på et produkt i Shoprocket-dashbordet, vises den på alle flater ved neste henting. Ingen synkronisering av innhold per flate.

### 3. White label- / partnerbutikker

Du er en plattform der andre selger varene sine: en fellesskapsmarkedsplass, en partnerkatalog, et franchisenettverk med egne forhandlernettsteder. Hver partner har sin egen merkevare, ikke din.

Hver partners nettsted kjører rammeverket ditt, men kaller handels-API-et med sin egen `publicKey`. Deres produkter, deres bestillinger, deres utbetalinger, alt avgrenset per konto. Ingen widget kommer i veien for merkevaren deres.

### 4. Helt skreddersydd kjøpsopplevelse

Interaktive produktkonfiguratorer (skreddersydde PC-er, personlige smykker, møbler laget på bestilling). 3D-visninger av produkter. «Handle rommet»-bildegallerier der et klikk på piksler i et bilde legger produktet i handlekurven. Knapper for rask ombestilling inne i e-post.

Widgeten kan ikke gjøre noe av dette. API-et kan. Du viser det grensesnittet designeren din drømte opp; API-et tar seg av handelsmekanikken bak.

### 5. AI-agenter og agentisk handel

En AI-agent (ChatGPT, Claude, en egen agent) som kan bla i produkter og fullføre kjøp på vegne av brukeren. Agenten trenger programmatisk tilgang til katalogen og handlekurven din, ikke en DOM-widget den må tolke.

Shoprocket leverer feeder for AI-handelsprotokoller ved siden av vanlig API-tilgang. En agent som spørres «hva har du på lager under $50 med gratis frakt» får et strukturert svar, ikke en skjermskraping.

### 6. Innebygd handel i innholdsverktøy

En Notion-side der blokker kan kjøpes. Et Framer-design med klikkbare kjøpspunkter. Et nyhetsbrevverktøy der abonnentene kan trykke på et produktkort og betale uten å forlate e-posten. Alt bygget oppå et API.

### 7. Egen rapportering og BI-dashbord

Shoprocket-dashbordet viser omsetning, konvertering og toppprodukter. Det det ikke viser, er *dine* egne målinger: livstidsverdi per kundekohort, bestillinger per henvisningskilde, margin etter leverandørkostnad. API-et gir tilgang til bestillings- og kundedata, slik at du kan pipe dem inn i ditt eget BI-verktøy, regneark eller interne dashbord.

## Hva SDK-en gir deg i dag

Fra `@shoprocket/core`:

```
// Products
sr.products.list({ limit, offset, sort, category })
sr.products.get(productId)

// Handlekurv
sr.cart.get()
sr.cart.addItem(productId, quantity)
sr.cart.updateItem(itemId, quantity)
sr.cart.removeItem(itemId)

// Økt
sr.session.create()
sr.setSessionToken(token)
```

Pluss hele REST-API-et for alt SDK-en ikke dekker ennå (bestillinger, kunder, rabatter, skriving av produkter). Se [api.shoprocket.io/docs](https://api.shoprocket.io/docs) for den fullstendige referansen.

## Der API-først er en feil

Noen tilfeller der widgeten er riktig valg og API-et er overkill:

- **En enkel butikkfront med 10-200 produkter.** Widgeten gjengir dette perfekt; å skrive ditt eget katalog-grensesnitt er å gjøre om arbeid som allerede er løst.
- **Du har ikke dedikert frontend-kapasitet.** API-først krever at du leverer og vedlikeholder egne lastetilstander, variantgrensesnitt, feilhåndtering, universell utforming og i18n på tvers av 21 språkversjoner. Det er ukesvis med arbeid widgeten gir deg gratis.
- **Lanseringstempo er hovedprioriteten.** Widgeten tar minutter; API-først tar uker som minimum.

Bruk widgeten som standard. Strekk deg etter API-et når du støter på noe widgeten ikke kan.

## Et realistisk første prosjekt

Det vanligste «jeg trenger API-et»-prosjektet: et SaaS-produkt som vil selge kreditter, abonnementer eller enkeltstående tillegg inne i sitt eget dashbord.

Fremgangsmåte:

1. Installer `@shoprocket/core` i frontend
2. Opprett en kategori i Shoprocket som heter «Tillegg» eller lignende
3. Legg til produkter med nøyaktig den prisingen / beskrivelsen du vil ha
4. Vis produktlisten i dashbordet ditt med eget komponentbibliotek
5. Ved klikk legger du i handlekurv + sender kunden videre til Shoprockets hostede kasse (eller bygger kassen inn direkte hvis du er komfortabel med ekstra arbeid)
6. Sett opp et webhook-endepunkt som mottar `order.paid`-hendelser, slik at du kan klargjøre det kjøpet låser opp (kreditter, tilgang, forsendelse)

Det er alt. En håndfull filer, en dags arbeid for noen som er vant til å kalle API-er. Ingen widget, ingen iframe, ingen kompromisser med produktets eget grensesnitt.

## Hva vi ikke anbefaler

Ikke bygg om et fullt katalog-grensesnitt som ligner mye på det widgeten allerede gjør. Hvis du bruker uker på «produktrutenett med filtre og søk», skriver du det widgeten leverer på minutter. Bruk widgeten til den formen, og bruk API-et til de virkelig annerledes formene.

> **Tips:** Hvis du vurderer API-først fordi widgetens standardutseende ikke passer merkevaren din, kan du prøve [widgetens stilkroker først](https://github.com/shoprocket/shoprocket-js). Widgeten tåler mye mer CSS-tilpasning enn den ser ut til. Å bygge alt om via API-et er et mye tyngre løft.

## Kort oppsummert

- **Widget** = standarden, dekker 95 % av butikkene
- **API / SDK** = når widgeten ikke har riktig form (innebygd SaaS-handel, flere flater, white label, skreddersydd brukeropplevelse, AI-agenter, egen BI)
- **SDK-ens flate i dag:** produkter, handlekurv, økter; pluss fullt REST-API for bestillinger / kunder / rabatter
- **Mønster for første prosjekt:** SaaS-dashbord som selger kreditter eller tillegg via SDK + klargjøring styrt av webhook
- **Ikke bygg om via API** det widgeten allerede gjør bra; velg formen din

[Start en gratis prøveperiode](https://app-v3.shoprocket.io/signup) og hent en offentlig nøkkel; SDK-en er gratis å bruke på alle Shoprocket-planer. 14 dager, uten kort.

---

- HTML version: https://v3.shoprocket.io/nb/blogg/handels-api-sju-ting-du-ikke-kan-bygge-med-en-widget
- Language: Norsk (nb)
- Also in: [العربية](https://v3.shoprocket.io/ar/blog/commerce-api-use-cases-seven-builds-you-cant-do-with-a-widget.md), [Deutsch](https://v3.shoprocket.io/de/blog/commerce-api-anwendungsfaelle-sieben-builds-ohne-widget.md), [Ελληνικά](https://v3.shoprocket.io/el/blog/commerce-api-use-cases-seven-builds-you-cant-do-with-a-widget.md), [English](https://v3.shoprocket.io/blog/commerce-api-use-cases-seven-builds-you-cant-do-with-a-widget.md), [Español](https://v3.shoprocket.io/es/blog/casos-de-uso-api-de-comercio-siete-proyectos-que-un-widget-no-puede-hacer.md), [Français](https://v3.shoprocket.io/fr/blog/api-commerce-sept-cas-usage-impossibles-avec-un-widget.md), [עברית](https://v3.shoprocket.io/he/blog/commerce-api-use-cases-seven-builds-you-cant-do-with-a-widget.md), [हिन्दी](https://v3.shoprocket.io/hi/blog/commerce-api-use-cases-seven-builds-you-cant-do-with-a-widget.md), [Bahasa Indonesia](https://v3.shoprocket.io/id/blog/kasus-penggunaan-commerce-api-tujuh-hal-yang-tidak-bisa-dilakukan-widget.md), [Italiano](https://v3.shoprocket.io/it/blog/api-commerce-sette-casi-duso-che-un-widget-non-copre.md), [日本語](https://v3.shoprocket.io/ja/blog/commerce-api-use-cases-seven-builds-you-cant-do-with-a-widget.md), [Lietuvių](https://v3.shoprocket.io/lt/tinklarastis/prekybos-api-panaudojimo-atvejai-septyni-sprendimai-kuriu-nepadarysite-su-valdykle.md), [Nederlands](https://v3.shoprocket.io/nl/blog/commerce-api-use-cases-zeven-projecten-zonder-widget.md), [Polski](https://v3.shoprocket.io/pl/blog/api-do-e-commerce-siedem-zastosowan-ktorych-nie-zrobisz-widzetem.md), [Português](https://v3.shoprocket.io/pt/blog/casos-de-uso-api-de-commerce-sete-projetos-que-widget-nao-faz.md), [Română](https://v3.shoprocket.io/ro/blog/cazuri-de-utilizare-api-comert-sapte-proiecte-fara-widget.md), [Русский](https://v3.shoprocket.io/ru/blog/commerce-api-use-cases-seven-builds-you-cant-do-with-a-widget.md), [ไทย](https://v3.shoprocket.io/th/blog/commerce-api-use-cases-seven-builds-you-cant-do-with-a-widget.md), [Türkçe](https://v3.shoprocket.io/tr/blog/commerce-api-kullanim-senaryolari-widget-ile-yapilamayan-yedi-proje.md), [中文](https://v3.shoprocket.io/zh/blog/commerce-api-use-cases-seven-builds-you-cant-do-with-a-widget.md)