JavaScript is the language of the web, and extracting YouTube transcripts in JavaScript opens up possibilities for browser extensions, web applications, serverless functions, and Node.js backends. This guide shows you how to use the YouTubeTranscripts.co API with the native Fetch API, which works in both Node.js 18+ and modern browsers.
Getting Your API Key
Sign up at youtubetranscripts.co/login to get your API key. You get 150 free requests without a credit card. The API key is passed via the x-api-key header in every request.
Basic Fetch Request
The simplest way to get a transcript is with a single fetch call. This works identically in Node.js 18+ and modern browsers.
const API_KEY = "YOUR_API_KEY";
const VIDEO_URL = "https://www.youtube.com/watch?v=dQw4w9WgXcQ";
const response = await fetch(
`https://api.youtubetranscripts.co/v1/transcript?url=${encodeURIComponent(VIDEO_URL)}`,
{ headers: { "x-api-key": API_KEY } }
);
const data = await response.json();
console.log(data.title);
console.log(`${data.transcript.length} segments`);Building a Reusable Function
Wrap the API call in a reusable function with error handling for production use.
async function getTranscript(videoUrl, options = {}) {
const params = new URLSearchParams({ url: videoUrl, ...options });
const response = await fetch(
`https://api.youtubetranscripts.co/v1/transcript?${params}`,
{ headers: { "x-api-key": process.env.YT_TRANSCRIPTS_API_KEY } }
);
if (!response.ok) {
const error = await response.json();
throw new Error(`API error ${response.status}: ${error.message}`);
}
return response.json();
}
// Usage
const data = await getTranscript("https://youtube.com/watch?v=dQw4w9WgXcQ");
const textData = await getTranscript("https://youtube.com/watch?v=dQw4w9WgXcQ", { format: "text" });Using in Express.js
Create an Express route that proxies transcript requests, keeping your API key on the server.
import express from "express";
const app = express();
app.get("/api/transcript", async (req, res) => {
const { url } = req.query;
if (!url) return res.status(400).json({ error: "URL required" });
try {
const response = await fetch(
`https://api.youtubetranscripts.co/v1/transcript?url=${encodeURIComponent(url)}`,
{ headers: { "x-api-key": process.env.YT_TRANSCRIPTS_API_KEY } }
);
const data = await response.json();
res.json(data);
} catch (error) {
res.status(500).json({ error: "Failed to fetch transcript" });
}
});
app.listen(3000);Browser Extension Example
Use the API in a Chrome extension to display transcripts alongside YouTube videos.
// content-script.js — runs on youtube.com pages
async function fetchTranscript() {
const videoUrl = window.location.href;
const response = await fetch(
`https://api.youtubetranscripts.co/v1/transcript?url=${encodeURIComponent(videoUrl)}`,
{ headers: { "x-api-key": "YOUR_API_KEY" } }
);
const data = await response.json();
// Render transcript in the sidebar
const container = document.createElement("div");
container.id = "yt-transcript-viewer";
data.transcript.forEach((seg) => {
const p = document.createElement("p");
p.textContent = `[${seg.start.toFixed(0)}s] ${seg.text}`;
p.onclick = () => {
document.querySelector("video").currentTime = seg.start;
};
container.appendChild(p);
});
document.querySelector("#secondary").prepend(container);
}Conclusion
You can now extract YouTube transcripts in any JavaScript environment: Node.js backends, browser apps, Chrome extensions, and serverless functions. The API is the same everywhere. Get your free API key at youtubetranscripts.co and start building.
Ready to start extracting YouTube transcripts?
Get 150 free API requests. No credit card required.
Get Your Free API Key