Update: this only works in your browser in developers console if you're on the youtube page (otherwise you'll get a cors error). This is super useful for chrome extensions in which you execute content-script.js on the youtube page!
You can get the view count of a YouTube video without an api key. Here is the secret formula and quick solution:
async function getViews(videoId) {
const response = await fetch(`https://www.youtube.com/watch?v=${videoId}`);
const html = await response.text();
const viewCount = html?.split('viewCount":"')?.[1]?.split('"')?.[0];
return viewCount ? parseInt(viewCount) : null;
}
]
Get more data from the video
Every Youtube page has a very useful ytInitialPlayerResponse variable. In this you can find subtitles, view counts, etc.
- Go to any YouTube video
- Open developer console
- Refresh the page (important)
- past
ytInitialPlayerResponsein the developer console - you'll have lots of info at your disposal now!
The view count is under videoDetails. In my solution i'm just searching (with split) on viewCount: " and I'm taking the first result.
It would be better to be able to work with this ytInitialPlayerResponse variable. I found out that it's this part up to var meta = document.createElement('meta')
JSON.parse(html.split('ytInitialPlayerResponse = ')[1].split(`;var meta = document.createElement('meta')`)[0])
You could get the complete video data with this:
async function getYouTubeVideoData(videoId) {
const response = await fetch(`https://www.youtube.com/watch?v=${videoId}`);
const html = await response.text();
const ytInitialPlayerResponse = JSON.parse(html.split('ytInitialPlayerResponse = ')[1].split(`;var meta = document.createElement('meta')`)[0]);
return ytInitialPlayerResponse;
}
Get video Title
async function getYouTubeVideoTitle(videoId) {
const response = await fetch(`https://www.youtube.com/watch?v=${videoId}`);
const html = await response.text();
const ytInitialPlayerResponse = JSON.parse(html.split('ytInitialPlayerResponse = ')[1].split(`;var meta = document.createElement('meta')`)[0]);
return ytInitialPlayerResponse.videoDetails.title;
}
await getYouTubeVideoTitle('dQw4w9WgXcQ');
// will return 'Rick Astley - Never Gonna Give You Up (Official Music Video)'
You can return any parameter from the ytInitialPlayerResponse object:
You could even retrieve the subtitles in two steps
// if no languageCode is given, then return first subtitle from the list
async function getYouTubeSubtitle(videoId, languageCode) {
const response = await fetch(`https://www.youtube.com/watch?v=${videoId}`);
const html = await response.text();
const ytInitialPlayerResponse = JSON.parse(html.split('ytInitialPlayerResponse = ')[1].split(`;var meta = document.createElement('meta')`)[0]);
const captionTracks = ytInitialPlayerResponse.captions. playerCaptionsTracklistRenderer.captionTracks;
const captionTrack = languageCode ? captionTracks.find(c => c.languageCode === languageCode) : captionTracks[0];
return await fetch(captionTrack.baseUrl);
}
await getYouTubeSubtitle('dQw4w9WgXcQ');
// will return 'Rick Astley - Never Gonna Give You Up (Official Music Video)'
Top comments (0)