Build an AI YouTube Video Summarizer with LangChain and Next.js

Dieses Tutorial nutzt die aktuelle Paketaufteilung von LangChain JS - Kern-Primitiven, die OpenAI-Integration und Text-Splitter leben jeweils in ihrem eigenen Paket:

npm install langchain @langchain/core @langchain/openai @langchain/textsplitters

Hol dir einen Schlüssel im Dashboard (100 kostenlose Credits, keine Kreditkarte nötig), und rufe dann den Transkript-Endpoint aus einem Next.js-Route-Handler auf:

// app/api/summarize/route.ts
import { NextResponse } from 'next/server';

async function fetchTranscript(videoId: string) {
  const res = await fetch(
    `https://getyoutubetranscript.com/api/v1/transcript?v=${videoId}`,
    { headers: { Authorization: `Bearer ${process.env.GETYOUTUBETRANSCRIPT_API_KEY}` } }
  );
  const json = await res.json();
  if (!json.success) throw new Error(json.message);
  // json.data.transcript is the full plain-text transcript,
  // json.data.word_count is its length in words.
  return json.data as { transcript: string; word_count: number; title: string };
}

transcript ist das vollständige Klartext-Transkript und word_count seine Länge - nützlich, um zu entscheiden, ob der Chunking-Schritt bei einem kurzen Video ganz übersprungen werden kann.

Ein langes Transkript kann leicht überschreiten, was bequem in einem einzigen Prompt an ein LLM passt, also zuerst aufteilen. RecursiveCharacterTextSplitter versucht zuerst an Absätzen, dann an Sätzen, dann an Wörtern zu trennen, damit die Abschnitte lesbar bleiben, statt mitten im Satz abzuschneiden:

import { RecursiveCharacterTextSplitter } from '@langchain/textsplitters';

const splitter = new RecursiveCharacterTextSplitter({
  chunkSize: 4000,
  chunkOverlap: 200,
});

const chunks = await splitter.splitText(transcript);
// A 20-minute video is usually 1-2 chunks; a 2-hour one might be 8-10.

chunkOverlap behält etwas Kontext vom Ende eines Abschnitts am Anfang des nächsten - so geht ein an der Grenze geteilter Satz für keinen der beiden verloren.

ChatPromptTemplate + ein Modell + StringOutputParser miteinander verkettet (LangChains Expression Language, LCEL) ist die aktuelle, stabile Art, eine Chain zu bauen - jeder Abschnitt bekommt parallel seine eigene kurze Zusammenfassung:

import { ChatOpenAI } from '@langchain/openai';
import { ChatPromptTemplate } from '@langchain/core/prompts';
import { StringOutputParser } from '@langchain/core/output_parsers';

const model = new ChatOpenAI({ model: 'gpt-4.1-mini', temperature: 0 });

const chunkPrompt = ChatPromptTemplate.fromTemplate(
  'Summarize this part of a video transcript in 3-4 sentences, keeping any concrete facts, numbers, or names:\n\n{chunk}'
);
const chunkChain = chunkPrompt.pipe(model).pipe(new StringOutputParser());

const chunkSummaries = await Promise.all(
  chunks.map((chunk) => chunkChain.invoke({ chunk }))
);

Diese parallel mit Promise.all auszuführen zählt für die Latenz: ein in 10 Abschnitten zusammengefasstes Transkript, einzeln nacheinander verarbeitet, dauert 10-mal so lange wie alle 10 gleichzeitig.

Die Abschnittszusammenfassungen sind jetzt kurz genug, um zusammen in einen einzigen Prompt zu passen, also kombiniert eine zweite Chain sie zum Endergebnis:

const finalPrompt = ChatPromptTemplate.fromTemplate(
  'These are summaries of consecutive parts of the same video transcript, titled "{title}".\n' +
  'Combine them into one coherent summary (a short paragraph, then 3-5 key takeaways as bullet points):\n\n{summaries}'
);
const finalChain = finalPrompt.pipe(model).pipe(new StringOutputParser());

const summary = await finalChain.invoke({
  title,
  summaries: chunkSummaries.join('\n\n'),
});

return NextResponse.json({ summary });

Diese zweistufige Struktur (erst Abschnitte zusammenfassen, dann die Zusammenfassungen zusammenfassen) ist genau das, was LangChains eigenes Map-Reduce-Muster im Hintergrund macht - hier explizit ausgeschrieben statt eine veraltete Hilfs-Chain zu nutzen, da sich die APIs der Summarization-Chains über LangChain-Versionen hinweg geändert haben und einfache LCEL-Primitiven die stabilere Grundlage zum Aufbauen sind.

Der obige Schritt zum Abrufen des Transkripts ist der einzige Teil dieser Pipeline, der in Produktion wirklich schwieriger wird - selbst gehostete Scraping-Bibliotheken werden nach dem Deployment auf einem Cloud-Server häufig blockiert. Eine gehostete YouTube-Transkript-API ist speziell dafür gebaut, dass dieser Schritt weiter funktioniert, ohne dass sich der Rest dieser Pipeline darum kümmern muss.