Techsy
Kontakt
Kom i gang
Tilbage til blog
guides

Tilføj AI-funktioner til din app: En kode-først guide

Skrevet af Mert Batur Gürbüz
Opdateret Jun 6, 2026
14 minutters læsning
Indholdsfortegnelse
Tilføj AI-funktioner til din app: En kode-først guide

Tilføj AI-funktioner til din app: En kode-først guide

Sidst opdateret: 6. juni 2026.

De fleste guider om "tilføjelse af AI til din app" er skrevet af bureauer, der forsøger at sælge dig en konsulentopgave til seks cifre. Denne guide giver dig den kode-først tilgang: fungerende OpenAI- og Anthropic API-kald, streaming UI med Vercel AI SDK, omkostningsformler, du kan indsætte i et regneark, og produktionsmønstre, der holder din app stabil, når LLM'en beslutter sig for at opføre sig mærkeligt. Du integrerer AI i din eksisterende app uden at skulle omskrive noget.

Hurtigt overblik: Hvad du kan bygge (og hvad det koster)

Før du vælger, hvilken AI-funktion du skal lancere først, får du her en realistisk oversigt. Disse estimater antager 100 aktive brugere og gpt-4o-mini som standardmodel, medmindre funktionen kræver noget tungere.

AI-funktionSværhedsgradMånedlige omkostninger (100 brugere)ByggetidBedste udbyder
AI Chat / AssistentLet$5-151-2 dageopenai, anthropic
Semantisk søgningMellem$8-203-5 dageopenai embeddings + pgvector
IndholdsopsummeringLet$3-101 daggpt-4o-mini, claude-haiku
Smart autoudfyldningMellem$10-253-5 dagegpt-4o-mini
Dokument Q&A (RAG)Svær$15-401-2 ugeropenai + vektor-DB
Klassificering / RoutingLet$2-81-2 dagegpt-4o-mini
BilledforståelseMellem$15-503-5 dagegpt-4o, gemini-2.5-pro
Agent-handlingerSvær$20-802-4 ugeropenai + function calling

Vælg den funktion, der er lettest og har højest værdi for dit produkt. For de fleste SaaS-apps er det enten en chat-assistent i appen eller indholdsopsummering. Start der, bevis at det virker, og udvid derefter.

Resten af denne guide går gennem hvert trin, fra dit første API-kald til en produktionssikker implementering.

Før du skriver en linje kode: Hvornår du IKKE skal tilføje AI

Her er noget, ingen andre fortæller dig: brug ikke en LLM, hvis et regex, en SQL-forespørgsel eller en simpel if-sætning løser problemet. Hvert AI API-kald koster penge, tilføjer latency og introducerer ikke-determinisme. Før du integrerer AI i din eksisterende app, så lav "regex-testen".

Regex-testen

OpgaveBrug AI?Bedre alternativHvorfor
E-mail-valideringNejRegex + MX-opslagDeterministisk, gratis, øjeblikkeligt
DatofortolkningNejdayjs / dateutilBiblioteker håndterer dette perfekt
CRUD-filtrering ("vis mig ordrer over $100")NejSQL WHERE-klausul100% nøjagtig, respons på millisekunder
Kategorisering af supporttickets i 5 faste bucketsMåskeStart med nøgleordsregler, opgrader til AI hvis nøjagtigheden falderRegelbaseret er gratis og forudsigeligt
Opsummering af et 10-siders juridisk dokumentJaIntet andet virker godtUstruktureret tekst er hvor LLM'er skinner
Naturligsproglig søgning i din vidensbaseJaElasticsearch giver dig 70%, AI giver dig 95%Semantisk forståelse slår nøgleordsmatching
Generering af personlige e-mailudkastJaSkabeloner rækker kun så langtLLM'er håndterer tone, kontekst og variation naturligt
Klassificering af rodet, ustruktureret brugerfeedbackJaManuel mærkning skalerer ikkeLLM'er håndterer tvetydighed og edge cases

Hvornår AI faktisk tilfører værdi

Brug en LLM, når inputtet er rodet, ustruktureret eller varierer meget, og når outputtet skal være naturligt, kontekstbevidst eller kreativt. Hvis dine data er rene, og dine regler er klare, så spring AI'en over og spar dit budget.

En hurtig virkelighedscheck på omkostninger: selv gpt-4o-mini til $0,15 per million input-tokens løber op. Tusind brugere, der laver 10 forespørgsler om dagen med 500 tokens hver = 5 millioner tokens/måned = cirka $0,75/måned i input-omkostninger. Billigt, men ikke gratis. Og hvis du ved et uheld routerer disse forespørgsler til gpt-4o ($2,50/1M tokens), bliver det $12,50/måned, hvilket stadig er håndterbart, men 16 gange dyrere for opgaver, der ikke har brug for den ekstra intelligens.

Valg af model og udbyder

Du har tre store udbydere, der er værd at overveje til de fleste SaaS LLM-integrationsopgaver. Her er status i begyndelsen af 2026.

ModelInput (per 1M tokens)Output (per 1M tokens)KontekstvindueBedst til
GPT-4o$2,50$10,00128KGenerelle opgaver, største økosystem
GPT-4o-mini$0,15$0,60128KOmkostningsfølsomme workload, højt volumen
Claude Sonnet 4.6$3,00$15,001MLange dokumenter, nøje instruktionfølge
Claude Haiku 4.5$1,00$5,00200KHurtig, billig, god kvalitet
Gemini 2.5 Pro$1,25$10,001MMultimodal (billede + tekst), lang kontekst

Priser hentet fra OpenAI, Anthropic og Google AI pr. juni 2026.

Start billigt, opgrader når nødvendigt

Her er tilgangen, der sparer dig for penge: start med gpt-4o-mini eller claude-haiku-4.5 til alt. Kør det i en uge, mål kvaliteten med rigtig brugerfeedback, og opgrader kun til en større model for de specifikke opgaver, hvor den billige model kommer til kort. De fleste opsummerings-, klassificerings- og autoudfyldningsfunktioner fungerer fint på mini-modeller.

For et dybere kig på opbygningen af hele din AI-stack, se vores AI SaaS Stack Guide.

Din første AI-funktion: API-integration

Det er tid til at skrive kode. Her er præcis den samme operation, et chat completion-kald, i både Python og TypeScript. Vælg den, som din backend bruger.

Python (OpenAI SDK)

python
# pip install openai
import os
from openai import OpenAI

client = OpenAI(api_key=os.environ["OPENAI_API_KEY"])

def ask_ai(user_message: str) -> str:
    """Call the LLM and return the response text."""
    response = client.chat.completions.create(
        model="gpt-4o-mini",
        messages=[
            {"role": "system", "content": "You are a helpful assistant for our SaaS product."},
            {"role": "user", "content": user_message},
        ],
        temperature=0.7,
        max_tokens=1024,
    )
    return response.choices[0].message.content

TypeScript (OpenAI SDK)

typescript
// npm install openai
import OpenAI from "openai";

const client = new OpenAI({ apiKey: process.env.OPENAI_API_KEY });

async function askAI(userMessage: string): Promise<string> {
  const response = await client.chat.completions.create({
    model: "gpt-4o-mini",
    messages: [
      { role: "system", content: "You are a helpful assistant for our SaaS product." },
      { role: "user", content: userMessage },
    ],
    temperature: 0.7,
    max_tokens: 1024,
  });
  return response.choices[0].message.content ?? "";
}

Hvor denne kode hører hjemme i din app

Kald aldrig OpenAI fra din frontend. Aldrig. Denne kode hører hjemme i:

  • Next.js: en API-rute (app/api/chat/route.ts)
  • FastAPI: et endpoint (@app.post("/api/chat"))
  • Express: en handler (router.post("/api/chat", ...))

Din frontend sender en anmodning til din backend, din backend kalder OpenAI og returnerer resultatet. Dette holder din OPENAI_API_KEY på serveren, hvor den hører hjemme.

Sådan. Du har en fungerende AI-funktion. Men det føles trægt; brugeren klikker på "send" og stirrer på en tom skærm i 2-3 sekunder. Streaming løser det.

Få det til at føles ægte: Streaming af AI-svar

En ventetid på 2-3 sekunder uden feedback føles defekt. Streaming får det samme svar til at føles øjeblikkeligt ved at vise tokens, efterhånden som de ankommer – den skrivemaskineeffekt, du har set i ChatGPT. Alle produktions-AI-apps bruger det, og det er overraskende nemt at implementere.

Server-side streaming (Python + TypeScript)

Her er Python-tilgangen ved hjælp af FastAPI og Server-Sent Events:

python
# pip install fastapi openai sse-starlette
from fastapi import FastAPI
from fastapi.responses import StreamingResponse
from openai import OpenAI
import os

app = FastAPI()
client = OpenAI(api_key=os.environ["OPENAI_API_KEY"])

@app.post("/api/chat")
async def chat(user_message: str):
    """Stream the LLM response token by token."""
    def generate():
        stream = client.chat.completions.create(
            model="gpt-4o-mini",
            messages=[
                {"role": "system", "content": "You are a helpful SaaS assistant."},
                {"role": "user", "content": user_message},
            ],
            stream=True,
        )
        for chunk in stream:
            if chunk.choices[0].delta.content:
                yield chunk.choices[0].delta.content

    return StreamingResponse(generate(), media_type="text/event-stream")

Og den tilsvarende TypeScript-løsning ved hjælp af Next.js med Vercel AI SDK, som håndterer streaming-infrastrukturen for dig:

typescript
// npm install ai openai
// app/api/chat/route.ts (Next.js App Router)
import { openai } from "@ai-sdk/openai";
import { streamText } from "ai";

export async function POST(req: Request) {
  const { messages } = await req.json();

  const result = streamText({
    model: openai("gpt-4o-mini"),
    system: "You are a helpful SaaS assistant.",
    messages,
  });

  return result.toDataStreamResponse();
}

Client-side: Vercel AI SDK-måden

På React-siden håndterer useChat hook'en alt: beskedtilstand, streaming og fejlhåndtering:

typescript
// components/Chat.tsx
"use client";
import { useChat } from "@ai-sdk/react";

export default function Chat() {
  const { messages, input, handleInputChange, handleSubmit, isLoading } = useChat({
    api: "/api/chat",
  });

  return (
    <div>
      {messages.map((m) => (
        <div key={m.id} className={m.role === "user" ? "user-msg" : "ai-msg"}>
          {m.content}
        </div>
      ))}
      <form onSubmit={handleSubmit}>
        <input value={input} onChange={handleInputChange} placeholder="Ask something..." />
        <button type="submit" disabled={isLoading}>Send</button>
      </form>
    </div>
  );
}

Det er en fuldt funktionel streaming AI-chat på omkring 40 linjer kode på tværs af server og klient. useChat hook'en administrerer besked-arrayet, tilføjer streamede tokens i realtid og håndterer loading-tilstande automatisk. Du behøver ikke røre ved EventSource eller ReadableStream direkte. For mere om, hvordan streaming fungerer under motorhjelmen, er Vercel AI SDK-dokumentationen den definitive reference.

Gør outputs pålidelige: Strukturerede outputs og function calling

Rå LLM-tekst er fantastisk til chat. Det er forfærdeligt til alt, hvad din kode skal parse. Hvis du udtrækker data, udløser handlinger eller bygger struktureret UI, har du brug for strukturerede outputs.

Strukturerede outputs (JSON Mode)

OpenAI's response_format parameter tvinger modellen til at returnere gyldig JSON, der matcher dit skema. Ikke flere gætterier på, om modellen outputter parserbar tekst:

python
from pydantic import BaseModel
from openai import OpenAI

client = OpenAI()

class ProductReview(BaseModel):
    sentiment: str  # "positive", "negative", "neutral"
    key_points: list[str]
    rating: int  # 1-5
    recommended: bool

response = client.beta.chat.completions.parse(
    model="gpt-4o-mini",
    messages=[
        {"role": "system", "content": "Extract a structured review from user text."},
        {"role": "user", "content": "Amazing product! Fast shipping, great quality. Only downside is the price."},
    ],
    response_format=ProductReview,
)

review = response.choices[0].message.parsed
print(review.sentiment)    # "positive"
print(review.rating)       # 4
print(review.key_points)   # ["Fast shipping", "Great quality", "High price"]

Modellen er begrænset til at returnere præcis de felter, du definerer. Ingen parse-fejl, ingen regex-udtrækning, ingen "nogle gange returnerer den markdown, og nogle gange gør den ikke." For den komplette reference til skemaer, tilstande og edge cases, se vores LLM Structured Outputs Guide.

Function calling til app-handlinger

Function calling lader LLM'en udløse handlinger i din applikation, såsom at opdatere en databasepost, sende en e-mail eller kalde et eksternt API. Du definerer de tilgængelige værktøjer, og modellen beslutter, hvornår de skal bruges:

typescript
import OpenAI from "openai";

const client = new OpenAI();

const response = await client.chat.completions.create({
  model: "gpt-4o-mini",
  messages: [{ role: "user", content: "Update my email to [email protected]" }],
  tools: [
    {
      type: "function",
      function: {
        name: "update_user_profile",
        description: "Updates a field on the user's profile",
        parameters: {
          type: "object",
          properties: {
            field: { type: "string", enum: ["email", "name", "avatar_url"] },
            value: { type: "string" },
          },
          required: ["field", "value"],
        },
      },
    },
  ],
});

// The model returns a tool_call -- you execute it in your backend
const toolCall = response.choices[0].message.tool_calls?.[0];
if (toolCall?.function.name === "update_user_profile") {
  const args = JSON.parse(toolCall.function.arguments);
  await db.users.update({ [args.field]: args.value }); // Your DB call
}

Modellen udfører ikke noget direkte. Den fortæller dig, hvad der skal kaldes, og med hvilke argumenter, og du kører den faktiske funktion i din sikre backend. Det er sådan, du bygger AI-funktioner, der går ud over chat og faktisk gør ting. For avancerede mønstre som multi-step tool chains og parallelle kald, se vores LLM Function Calling Guide. Anthropic har en lignende tool use API, hvis du bruger Claude.

Tilføj viden: RAG på 50 linjer

Din LLM ved ikke noget om dit produkt, dine dokumenter eller dine brugere. RAG (Retrieval-Augmented Generation) løser det: søg i dine data først, og fodr derefter de relevante bidder til modellen som kontekst. Det er det mest almindelige mønster til at gøre AI-funktioner virksomhedsspecifikke.

Mønsteret: Søg, og spørg derefter

  1. Embed dine dokumenter i vektorer (én gang, ved indtagelsestidspunktet)
  2. Gem vektorerne i en database (pgvector, Pinecone, Qdrant, Weaviate)
  3. Hent de mest relevante bidder, når en bruger stiller et spørgsmål
  4. Indsæt disse bidder i LLM-prompten som kontekst

Minimal RAG-implementering

python
# pip install openai numpy psycopg2-binary pgvector
from openai import OpenAI
import numpy as np

client = OpenAI()

# Step 1: Embed a document chunk
def embed(text: str) -> list[float]:
    response = client.embeddings.create(model="text-embedding-3-small", input=text)
    return response.data[0].embedding

# Step 2: Store in pgvector (assumes table with vector column exists)
def store_chunk(cursor, text: str, embedding: list[float]):
    cursor.execute(
        "INSERT INTO documents (content, embedding) VALUES (%s, %s)",
        (text, np.array(embedding).tolist()),
    )

# Step 3: Retrieve relevant chunks
def search(cursor, query: str, top_k: int = 3) -> list[str]:
    query_embedding = embed(query)
    cursor.execute(
        """SELECT content FROM documents
           ORDER BY embedding <=> %s::vector LIMIT %s""",
        (np.array(query_embedding).tolist(), top_k),
    )
    return [row[0] for row in cursor.fetchall()]

# Step 4: Ask the LLM with context
def ask_with_context(question: str, cursor) -> str:
    chunks = search(cursor, question)
    context = "\n\n".join(chunks)
    response = client.chat.completions.create(
        model="gpt-4o-mini",
        messages=[
            {"role": "system", "content": f"Answer using this context:\n\n{context}"},
            {"role": "user", "content": question},
        ],
    )
    return response.choices[0].message.content

Det er hele RAG-pipelinen på omkring 40 linjer. For en produktionsklar opsætning med chunking-strategier, hybrid søgning og evaluering, se vores fulde guide til opbygning af en RAG-applikation. Hvis du evaluerer frameworks, tilbyder både LangChain og LlamaIndex abstraktioner på højere niveau.

Produktionsmønstre: Omkostninger, sikkerhed og fejlhåndtering

Alt ovenfor fungerer fint i udviklingsmiljøet. Produktion er hvor tingene bliver interessante. Dette afsnit dækker de problemer, du vil støde på to uger efter lanceringen af din AI-funktion, og hvordan du løser dem, før de koster dig søvn (eller penge).

Token-budget matematik (Hvad din AI-funktion faktisk koster)

Hold op med at gætte. Her er formlen: brugere x forespørgsler/dag x gennemsnitlige_tokens x pris_per_token = månedlige omkostninger.

ScenarioBrugereForespørgsler/dagGns. Tokens (in+out)ModelMånedlige omkostninger
Hobby / Internt værktøj505800gpt-4o-mini~$1,50
Tidlig startup50081.000gpt-4o-mini~$18
Voksende SaaS5.000121.200gpt-4o~$540
Skalering (blandet routing)20.000151.500gpt-4o-mini + gpt-4o~$800-1.200

Vækst-niveauet er hvor folk bliver overraskede. Ved 5.000 brugere vil du have model-routing: send lette forespørgsler (opsummering, klassificering) til gpt-4o-mini og rout kun komplekse forespørgsler (multi-step ræsonnement, kodegenerering) til gpt-4o. Dette kan skære omkostningerne med 60-70%.

Andre taktikker til optimering af omkostninger:

  • Prompt caching: OpenAI og Anthropic tilbyder begge op til 50-90% besparelse på gentagne prompt-præfikser
  • max_tokens grænser: begræns output-længden, så modellen ikke snakker for meget
  • Semantisk caching: hvis en bruger stiller det samme spørgsmål to gange, returner det cachede svar

For avanceret prompt-optimering og caching-strategier, se vores guide om context engineering-teknikker.

API-nøgle sikkerhed (Backend Proxy-mønsteret)

Det burde være indlysende, men det dukker stadig op i produktionsapps: eksponér aldrig dine API-nøgler i frontend-kode. Ikke i miljøvariabler, der bundtes til klienten. Ikke i en "skjult" JavaScript-variabel. OWASP Top 10 for LLM Applications lister afsløring af følsomme oplysninger (LLM02:2025) som en top-risiko.

Løsningen er enkel: din frontend kalder din backend API. Din backend kalder OpenAI. API-nøglen lever udelukkende på serveren, indlæst fra en miljøvariabel eller en secrets manager.

Implementer også bruger-specifik rate limiting for at forhindre, at en enkelt bruger dræner dit API-budget. Hvilket bringer os til:

Rate limiting per bruger

PlanAI-forespørgsler/dagToken-budget/månedFunktioner
Gratis20100K tokensGrundlæggende chat, opsummering
Pro ($29/md)2001M tokensFuldde AI-funktioner, RAG-søgning
EnterpriseUbegrænset10M tokensPrioritetskø, dedikeret model-routing

Spor brugen på brugerniveau, ikke kun globalt. En gratis-bruger, der opdager dit AI-endpoint og fyrer 10.000 forespørgsler afsted, vil gøre din CFO meget ulykkelig.

Fejlhåndtering og fallback-kæder

LLM-API'er går ned. De returnerer vrøvl. De rammer rate limits. Din app skal håndtere alt dette elegant. Her er et retry-med-fallback mønster:

typescript
import OpenAI from "openai";
import Anthropic from "@anthropic-ai/sdk";

const openai = new OpenAI();
const anthropic = new Anthropic();

async function aiWithFallback(prompt: string): Promise<string> {
  const models = [
    () => callOpenAI("gpt-4o-mini", prompt),
    () => callOpenAI("gpt-4o", prompt),
    () => callAnthropic("claude-3-5-haiku-latest", prompt),
  ];

  for (const callModel of models) {
    try {
      return await withRetry(callModel, { maxRetries: 2, baseDelay: 1000 });
    } catch (err) {
      console.warn(`Model failed, trying next fallback...`, err);
    }
  }
  // All models failed -- return cached or static response
  return "I'm temporarily unable to process your request. Please try again shortly.";
}

async function withRetry<T>(fn: () => Promise<T>, opts: { maxRetries: number; baseDelay: number }): Promise<T> {
  for (let i = 0; i <= opts.maxRetries; i++) {
    try {
      return await fn();
    } catch (err: any) {
      if (i === opts.maxRetries) throw err;
      if (err?.status === 429 || err?.status >= 500) {
        await new Promise((r) => setTimeout(r, opts.baseDelay * 2 ** i)); // Exponential backoff
      } else {
        throw err; // Don't retry client errors (400, 401, etc.)
      }
    }
  }
  throw new Error("Unreachable");
}

De vigtigste principper: genforsøg 429 og 5xx fejl med exponential backoff, fald tilbage til den næste modeludbyder, når genforsøg er udtømt, og hav altid en sidste fallback (cached svar, statisk indhold eller en klar fejlmeddelelse). Lad aldrig en AI-fejl crashe din app.

Hvordan Techsy tilgår AI-funktionsudvikling

Vi starter hvert AI-projekt med det samme spørgsmål fra afsnit 3: "Har dette virkelig brug for en LLM, eller er der en enklere løsning?" Du vil blive overrasket over, hvor ofte svaret er "en veldesignet SQL-forespørgsel håndterer 80% af dette."

Når AI er det rigtige valg, er her vores proces:

  1. Prototyp hurtigt, fungerende proof-of-concept på 1-2 uger ved hjælp af gpt-4o-mini og den simplest mulige arkitektur
  2. Mål med rigtige brugere, ikke syntetiske benchmarks, men faktisk brugertilfredshed (thumbs up/down, task completion rate)
  3. Iterér med evals, automatiserede LLM-evalueringer, der fanger kvalitetsforringelser, før brugerne gør
  4. Hærd til produktion, rate limits, fallback-kæder, omkostningsovervågning og sikkerhedsmønstrene fra denne guide
  5. Optimér omkostninger, model-routing, prompt caching og right-sizing af modeller per funktion

Hvad man kan forvente ved rigtige builds: Offentlige benchmark-retningslinjer

Vi offentliggør ikke klientmetrics uden tilladelse, men følgende tal er baseret på publicerede modelbenchmarks og offentlige API-prisdata, nyttige som engineering-mål, før du har dine egne tal:

  • Streaming first-token latency på gpt-4o-mini lander typisk mellem 200ms og 600ms under normal belastning. gpt-4o er lignende eller lidt højere. Forvent p95 til at være 1,5-2x medianen.
  • Omkostning per samtale for et typisk 600-token supportsvar (400 input + 200 output) på gpt-4o-mini: (400/1.000.000 × $0,15) + (200/1.000.000 × $0,60) = $0,000060 + $0,000120 = $0,00018 per svar, under en cent selv ved 5.000 svar/dag.
  • RAG overhead: embedding af hver forespørgsel via text-embedding-3-small ($0,02/1M tokens) tilføjer cirka $0,000010 per opslag, hvilket er ubetydeligt sammenlignet med completion-kaldet.

Disse er repræsentative startpunkter. Hvis du lancerer og instrumenterer dine egne kald, vil de faktiske tal variere afhængigt af prompt-længde, system-besked størrelse og trafikspids. Hvis du har kørt Techsy-byggede integrationer og ønsker at dele benchmark-data til denne guide, kontakt os.

For strategier til at reducere, hvad du bruger i stor skala, se vores LLM API omkostningsreduktionsguide.

Vi har bygget streaming AI-chat, RAG-drevne vidensbaser og AI-drevne klassificeringssystemer til SaaS-produkter. Mønstrene i denne guide er de samme, vi bruger i klientprojekter, intet er holdt tilbage. Hvis din "AI-funktion" driver mod en fuld autonom agent, dækker vores guide om hvornår man skal hyre et AI-agentudviklingsbureau omkostningsintervaller, stack og diskvalifikatorer, så du kan afgøre, om DIY stadig er det rigtige valg.

Bygger du AI-funktioner og har brug for et andet sæt øjne? Få en gratis arkitekturgennemgang.

Ofte stillede spørgsmål

Hvordan tilføjer jeg AI-funktioner til min SaaS uden at genopbygge fra bunden?

Du genopbygger ikke. Du tilføjer en backend API-rute, der kalder OpenAI eller Anthropic, forbinder den til din eksisterende UI og deployer. Kodeeksemplerne i denne guide viser præcis det – et nyt endpoint, ikke en ny arkitektur. Start med én funktion som chat eller opsummering, og udvid derfra.

Hvad er den hurtigste måde at integrere OpenAI i en eksisterende app?

Installer SDK'et (pip install openai eller npm install openai), opret en backend API-rute, kald chat.completions.create(), og returner resultatet. Med Vercel AI SDK's useChat hook kan du have streaming AI-chat kørende på under 30 minutter.

Hvor meget koster det at tilføje AI-funktioner til en SaaS-app?

API-omkostninger for en app med 1.000 brugere varierer fra $15-150/måned afhængigt af modellen og brugsmønstre. gpt-4o-mini til $0,15/1M input-tokens holder omkostningerne meget lave. Udviklingstiden er typisk 1-4 uger for din første funktion. Se afsnittet om token-budget matematik for detaljerede scenarier.

Skal jeg bruge RAG eller fine-tuning for at tilføje AI til mit produkt?

RAG til 90% af use cases. Fine-tuning kun når du har brug for, at modellen lærer en specifik stil eller domæneviden, der ikke kan leveres gennem kontekst. RAG er billigere, hurtigere at implementere og meget lettere at opdatere – du tilføjer blot nye dokumenter til din vektorbutik i stedet for at genoptræne en model.

Hvordan undgår jeg at eksponere min OpenAI API-nøgle i en webapp?

Kald aldrig OpenAI API'en fra frontend. Opret en backend-proxy; din frontend kalder din API, din backend kalder OpenAI. Gem nøglen i miljøvariabler på serversiden. Tilføj bruger-specifik rate limiting, så ingen kan misbruge dit endpoint.

Hvor lang tid tager det at tilføje AI-funktioner til en eksisterende app?

En grundlæggende chat-funktion tager 1-2 dage. Streaming UI tilføjer 2-3 dage. RAG med dine virksomhedsdata tager 1-2 uger. Fuld produktionshærdning med rate limits, fejlhåndtering og omkostningskontrol tager 2-4 uger. Du kan lancere den grundlæggende version på dage og iterere derfra.

Hvornår skal jeg bruge GPT-4o vs Claude vs Gemini?

GPT-4o til generelle opgaver med det største økosystem og bedste værktøjsstøtte. Claude Sonnet 4.6 til lange dokumenter, nøje instruktionfølge og kodningsopgaver. Gemini 2.5 Pro til multimodalt arbejde (billeder + tekst) og Google Cloud-integration. Start med GPT-4o-mini for at spare omkostninger, og opgrader kun når du kan måle en kvalitetsforskel.

Hvordan håndterer jeg AI-fejl i produktion?

Implementér retry-logik med exponential backoff for 429 (rate limit) og 5xx fejl. Byg en fallback-modelkæde; prøv din primære model, fald tilbage til en alternativ udbyder, og fald derefter tilbage til et cached eller statisk svar. Lad aldrig en AI-fejl crashe din app eller vise en tom skærm.

Hvilke AI-funktioner bør en SaaS-app have i 2026?

Start med den funktion med højest værdi og lavest kompleksitet for dit specifikke produkt. For de fleste SaaS-apps: AI-drevet søgning, indholdsopsummering eller en assistent i appen. Tjek tabellen med hurtig oversigt øverst i denne guide for omkostnings- og sværhedsgradsestimater per funktionstype.

Hvordan ved jeg, om min AI-funktion faktisk virker?

Opsæt LLM-evals, automatiserede tests, der måler svar kvalitet, relevans og sikkerhed på et sæt repræsentative inputs. Spor brugertilfredsheds-metrics som thumbs up/down ratings og frekvensen af opfølgende spørgsmål. Sammenlign AI-assisteret task completion med non-AI-flowet. Hvis brugerne ikke fuldfører opgaver hurtigere eller mere succesfuldt, har funktionen brug for arbejde.

Din checkliste til lancering af AI-funktioner

Du har nu det fulde overblik. Her er din trin-for-trin vej til lancering:

  1. Vælg din funktion, brug tabellen med hurtig oversigt til at vælge den mulighed med højest værdi og lavest sværhedsgrad for dit produkt
  2. Kør regex-testen, bekræft at AI genuint er det rigtige værktøj til denne opgave
  3. Start med en billig model, gpt-4o-mini eller claude-haiku-4.5, mål kvaliteten før opgradering
  4. Byg det grundlæggende API-kald, Python eller TypeScript, bag en backend-proxy
  5. Tilføj streaming, Vercel AI SDK gør dette trivielt for React-apps
  6. Tilføj strukturerede outputs, hvis din funktion har brug for parserbare data, ikke fri-form tekst
  7. Beregn dit token-budget, brugere x forespørgsler x tokens x pris = månedlig regning
  8. Implementér rate limits og fejlhåndtering, bruger-specifikke limits, retry-logik, fallback-kæde
  9. Deploy og mål, spor brugertilfredshed, ikke bare om API'en returnerer 200

Din første AI-funktion er tættere på, end du tror. Den sværeste del er ikke koden, det er at beslutte, hvilken funktion der skal bygges først. Vælg én, lancér den denne uge, og iterér baseret på, hvad rigtige brugere fortæller dig.

Kilder

  • OpenAI API Pricing
  • Anthropic Claude API Pricing
  • Vercel AI SDK, Streaming
  • OpenAI Structured Outputs Guide
  • OpenAI Production Best Practices
  • OWASP Top 10 for LLM Applications 2025
  • Anthropic Tool Use Documentation
  • LangChain RAG Tutorial
  • LlamaIndex Introduction to RAG

Tags

tilføj-ai-funktioneropenai-apillm-integrationstreaming-airagvercel-ai-sdkai-saasstrukturerede-outputs

Del denne artikel

Relaterede artikler

Mere fra guides

guides
Jul 18, 2026

Sammenligning af LLM API-priser 2026: Alle store modeller, prissat

En komplet sammenligning af LLM API-priser for 2026 — Claude, GPT-5.6, Gemini, DeepSeek, Qwen, GLM og Mistral prissat side om side per million tokens, direkte fra de officielle prissider.

12 min read minutters læsning
Læs
guides
Apr 12, 2026

Surfer SEO-guide 2026: Content Editor, NLP-scoring og AI-søgning

En praktisk Surfer SEO-guide, der dækker workflowet i Content Editor, NLP-scoringssystemet, AI Tracker til GEO-optimering og API-automatisering. Baseret på tests af over 50 artikler.

14 min read minutters læsning
Læs
guides
Apr 12, 2026

Semrush-guide 2026: Alle værktøjer forklaret (med eksempler)

En praktisk Semrush-guide, der dækker søgeordsresearch, site-audit, konkurrentanalyse, AI-synlighedssporing og opsætning af MCP-server. Indeholder kodeeksempler og workflows fra en rigtig SEO-pipeline.

14 min read minutters læsning
Læs
Se alle indlæg
Start dit projekt

Klar til at bygge noget ekstraoordinær?

Lad os gøre din vision til virkelighed. Vores team står klar til at hjælpe dig med at skabe software, der gør en forskel.

Book et 30 min. scopemødeSe vores arbejde

Fra biblioteket

Claude Skills

Se alle
  • New Post

    Full SEO blog pipeline: research, brief, write, validate, image, translate, publish to Sanity. Autonomous from start to finish.

  • Content Refresh

    Audit a stale post, find decay drivers, and ship a SERP-aligned refresh without losing existing rankings.

  • SEO Audit

    Site-wide SEO audit with prioritized fix list: technical, on-page, and EEAT signals.

AI-automatiseringer

Se alle
  • Security Auditor

    Weekly SCA + IaC scan with prioritized fix PRs.

  • Cold Email Writer

    Generates first-touch emails grounded in one specific public detail.

  • Lead Research Agent

    Enrich an email into a profile, score fit, alert in Slack.

Fra biblioteket

Claude Skills

Se alle
  • New Post

    Full SEO blog pipeline: research, brief, write, validate, image, translate, publish to Sanity. Autonomous from start to finish.

  • Content Refresh

    Audit a stale post, find decay drivers, and ship a SERP-aligned refresh without losing existing rankings.

  • SEO Audit

    Site-wide SEO audit with prioritized fix list: technical, on-page, and EEAT signals.

AI-automatiseringer

Se alle
  • Security Auditor

    Weekly SCA + IaC scan with prioritized fix PRs.

  • Cold Email Writer

    Generates first-touch emails grounded in one specific public detail.

  • Lead Research Agent

    Enrich an email into a profile, score fit, alert in Slack.

Tjenester

  • Entertainmentløsninger
  • Mobilapps
  • Webapplikationer

Løsninger

  • CRM-systemer
  • AI-integration
  • ERP-løsninger
  • Stemmeargenter
  • Processautomatisering
  • Cybersikkerhed

Bibliotek

  • Blog
  • Portfolio

Fællesskab

  • AI-automatiseringer
  • Claude Skills

Værktøjer

  • Pris på mobil-app
  • OpenAI / LLM API-prisreknemaskine
  • Pris på MVP
  • Pris på stemme-AI-agent

Virksomhed

  • Om
  • Partnere
  • Kontakt

Juridisk

  • Privatlivspolitik
  • Salgsbetingelser
  • Cookiepolitik

Tjenester

  • Entertainmentløsninger
  • Mobilapps
  • Webapplikationer

Løsninger

  • CRM-systemer
  • AI-integration
  • ERP-løsninger
  • Stemmeargenter
  • Processautomatisering
  • Cybersikkerhed

Bibliotek

  • Blog
  • Portfolio

Fællesskab

  • AI-automatiseringer
  • Claude Skills

Værktøjer

  • Pris på mobil-app
  • OpenAI / LLM API-prisreknemaskine
  • Pris på MVP
  • Pris på stemme-AI-agent

Virksomhed

  • Om
  • Partnere
  • Kontakt
JuridiskPrivatlivspolitikSalgsbetingelserCookiepolitik
TECHSY
© 2026 Techsy. Alle rettigheder forbeholdes.