How to Integrate Next.js for banking with Vercel AI SDK for RAG

Combining Next.js for banking with Vercel AI SDK gives you a clean path to build regulated AI experiences on top of retrieval-augmented generation. In practice, that means a customer-facing banking app can answer policy, product, and account questions from approved documents while keeping the UI responsive and the orchestration layer under control.

Prerequisites

• •Python 3.10+
• •A Next.js for banking project with API routes enabled
• •A Vercel project with AI SDK installed in your Next.js app
• •Access to your banking knowledge base:
  • •PDFs
  • •policy docs
  • •product FAQs
  • •internal SOPs
• •An embedding provider and chat model provider configured for your RAG pipeline
• •Environment variables set for:
  • •OPENAI_API_KEY or equivalent model key
  • •NEXT_PUBLIC_* config used by your Next.js banking app
• •A backend service account or API token for calling your Next.js banking endpoints

Integration Steps

1. •

   Expose a retrieval endpoint from Next.js for banking

   Your Next.js banking app should own the domain logic: customer permissions, document filtering, and retrieval policies. The AI layer should not guess what it can access.

   import requests
   
   NEXTJS_BANKING_BASE_URL = "https://banking-app.example.com"
   TOKEN = "service-account-token"
   
   def fetch_allowed_docs(customer_id: str, query: str):
       url = f"{NEXTJS_BANKING_BASE_URL}/api/rag/retrieve"
       payload = {
           "customerId": customer_id,
           "query": query,
           "topK": 5,
       }
       headers = {
           "Authorization": f"Bearer {TOKEN}",
           "Content-Type": "application/json",
       }
   
       response = requests.post(url, json=payload, headers=headers, timeout=30)
       response.raise_for_status()
       return response.json()
   

2. •

   Call the Vercel AI SDK chat endpoint from Python

   In the browser or server runtime, Vercel AI SDK typically exposes streaming helpers like streamText on the server side and useChat on the client side. If you want Python to orchestrate the flow, call the route your Next.js app exposes for generation.

   import requests
   
   VERCEL_CHAT_URL = "https://banking-app.example.com/api/chat"
   
   def ask_model(question: str, context_chunks: list[dict]):
       messages = [
           {
               "role": "system",
               "content": (
                   "You are a banking assistant. "
                   "Answer only from provided context. "
                   "If context is insufficient, say you don't know."
               ),
           },
           {
               "role": "user",
               "content": f"Question: {question}\n\nContext: {context_chunks}",
           },
       ]
   
       response = requests.post(
           VERCEL_CHAT_URL,
           json={"messages": messages},
           timeout=60,
       )
       response.raise_for_status()
       return response.text
   

3. •

   Build a Python RAG orchestrator

   This service sits between retrieval and generation. It asks Next.js for approved chunks, then forwards them into the Vercel AI-powered chat route.

   from typing import Any
   
   def rag_answer(customer_id: str, question: str) -> dict[str, Any]:
       docs = fetch_allowed_docs(customer_id=customer_id, query=question)
   
       if not docs.get("chunks"):
           return {
               "answer": "I couldn't find any approved source material for that request.",
               "sources": [],
           }
   
       raw_answer = ask_model(question=question, context_chunks=docs["chunks"])
   
       return {
           "answer": raw_answer,
           "sources": [
               {
                   "docId": chunk["docId"],
                   "title": chunk["title"],
                   "score": chunk["score"],
               }
               for chunk in docs["chunks"]
           ],
       }
   

4. •

   Wire in document ingestion from Python

   If your banking team uploads new policy files through a separate ingestion pipeline, push metadata into Next.js so retrieval stays current. Keep document ownership and access control inside the banking app.

   import requests
   
   def ingest_document(doc_id: str, title: str, text: str):
       url = f"{NEXTJS_BANKING_BASE_URL}/api/rag/ingest"
       payload = {
           "docId": doc_id,
           "title": title,
           "text": text,
           "sourceType": "policy",
       }
   
       response = requests.post(
           url,
           json=payload,
           headers={"Authorization": f"Bearer {TOKEN}"},
           timeout=60,
       )
       response.raise_for_status()
       return response.json()
   

5. •

   Return structured answers to the Next.js UI

   Your frontend should render answer text plus citations. That is where Vercel AI SDK fits well: stream the answer and display sources alongside it.

   def format_response(result: dict[str, Any]) -> dict[str, Any]:
       return {
           "answer": result["answer"],
           "citations": result["sources"],
           "status": "ok",
       }
   
   if __name__ == "__main__":
       result = rag_answer("cust_10291", "What is my overdraft fee policy?")
       print(format_response(result))
   

Testing the Integration

Run a single end-to-end check against both endpoints. This verifies retrieval returns chunks and generation uses them.

def test_rag_flow():
    customer_id = "cust_10291"
    question = "What is the fee for an international wire transfer?"

    result = rag_answer(customer_id, question)

    assert result["answer"]
    assert isinstance(result["sources"], list)

    print("ANSWER:")
    print(result["answer"])
    print("\nSOURCES:")
    for source in result["sources"]:
        print(f'- {source["title"]} ({source["score"]})')

test_rag_flow()

Expected output:

ANSWER:
The international wire transfer fee is $25 according to the current fee schedule.

SOURCES:
- Personal Banking Fee Schedule (0.92)
- Wire Transfer Policy (0.88)

Real-World Use Cases

• •

  Customer support copilot

  • •Answer balance-adjacent policy questions from approved documents.
  • •Keep responses grounded in bank-owned content with citations.
• •

  Branch staff assistant

  • •Help employees find product rules, escalation paths, and compliance steps.
  • •Restrict answers based on role and branch permissions.
• •

  Internal knowledge search

  • •Let ops teams query SOPs, audit procedures, and onboarding guides.
  • •Use RAG to avoid hallucinating on regulated workflows.

Keep learning

• •The complete AI Agents Roadmap — my full 8-step breakdown
• •Free: The AI Agent Starter Kit — PDF checklist + starter code
• •Work with me — I build AI for banks and insurance companies

By Cyprian Aarons, AI Consultant at Topiax.