How can I get a Youtube video ID from the Youtube API given the video url?

Question

I have a page where users can paste a Youtube video url and then I need to extract the video's ID in order to get the video's thumbnail image. The hard part is to get a reliable way of extracting the video ID from the video url. There are a number of regex solutions here but for me none of these are 100% reliable. Here's a few:

It's like a contest of who has a longer regex. I feel like the right way would be to get this information from Youtube's api, but looking at it, seems like this option is not available:

https://developers.google.com/apis-explorer/#p/youtube/v3/

As you can see everything is based on the video id. I find it ridiculous that I need the actual video ID to get any information about the video since no real world user will ever even know what the video id is. Vimeo has this feature built into their API. Here is an example:

https://vimeo.com/api/oembed.json?url=https://vimeo.com/29474908

Does anyone have a solution for this that does not involve some regular expression?

score 4 · Accepted Answer · edited May 23 '17 at 12:10

Doing a search with the API works with different YouTube URL types. The URL is passed as the query term q.

https://www.googleapis.com/youtube/v3/search/?key=<YOUR_KEY>&part=snippet&q=youtu.be/M7lc1UVf-VE

Maybe some case could result in more than one item, but the normal search result is just one match:

{
    kind: "youtube#searchListResponse",
    etag: ""m2yskBQFythfE4irbTIeOgYYfBU/j2Px-5q--mgJEsrfjg4L0Mgn_L8"",
    regionCode: "ES",
    pageInfo: {
        totalResults: 1,
        resultsPerPage: 5
    },
    items: [
        {
            kind: "youtube#searchResult",
            etag: ""m2yskBQFythfE4irbTIeOgYYfBU/_1gFVi_i_djlS4OZWPGtcZ3iSLQ"",
            id: {
                kind: "youtube#video",
                videoId: "M7lc1UVf-VE"
            },
            snippet: {
                publishedAt: "2013-04-10T17:25:04.000Z",
                channelId: "UC_x5XG1OV2P6uZZ5FSM9Ttw",
                title: "YouTube Developers Live: Embedded Web Player Customization",
                description: "On this week's show, Jeff Posnick covers everything you need to know about using player parameters to customize the YouTube iframe-embedded player.",
                thumbnails: {
                    default: {
                        url: "https://i.ytimg.com/vi/M7lc1UVf-VE/default.jpg",
                        width: 120,
                        height: 90
                    },
                    medium: {
                        url: "https://i.ytimg.com/vi/M7lc1UVf-VE/mqdefault.jpg",
                        width: 320,
                        height: 180
                    },
                    high: {
                        url: "https://i.ytimg.com/vi/M7lc1UVf-VE/hqdefault.jpg",
                        width: 480,
                        height: 360
                    }
                },
                channelTitle: "Google Developers",
                liveBroadcastContent: "none"
            }
        }
    ]
}

I tested with some of the URL variations from this answer and most worked:

var urls = [
    '//www.youtube-nocookie.com/embed/M7lc1UVf-VE?rel=0',
    'https://www.youtube.com/watch?v=M7lc1UVf-VE&feature=channel',
    'https://www.youtube.com/watch?v=M7lc1UVf-VE&playnext_from=TL&videos=osPknwzXEas&feature=sub',
    'https://www.youtube.com/ytscreeningroom?v=NRHVzbJVx8I', // <---- invalid
    'https://youtu.be/M7lc1UVf-VE',
    'https://www.youtube.com/watch?v=M7lc1UVf-VE&feature=youtu.be',
    'https://youtu.be/M7lc1UVf-VE',
    'https://www.youtube.com/watch?v=M7lc1UVf-VE&feature=channel',
    'https://www.youtube.com/watch?v=M7lc1UVf-VE&playnext_from=TL&videos=osPknwzXEas&feature=sub',
    'https://www.youtube.com/ytscreeningroom?v=M7lc1UVf-VE', // <---- invalid
    'https://www.youtube.com/embed/M7lc1UVf-VE?rel=0',
    'https://www.youtube.com/watch?v=M7lc1UVf-VE',
    'https://youtube.com/v/M7lc1UVf-VE?feature=youtube_gdata_player',
    'https://youtube.com/vi/M7lc1UVf-VE?feature=youtube_gdata_player', // <---- invalid
    'https://youtube.com/?v=M7lc1UVf-VE&feature=youtube_gdata_player',
    'https://www.youtube.com/watch?v=M7lc1UVf-VE&feature=youtube_gdata_player',
    'https://youtube.com/?vi=M7lc1UVf-VE&feature=youtube_gdata_player', // <---- invalid
    'https://youtube.com/watch?v=M7lc1UVf-VE&feature=youtube_gdata_player',
    'https://youtube.com/watch?vi=M7lc1UVf-VE&feature=youtube_gdata_player',
    'https://youtu.be/M7lc1UVf-VE?feature=youtube_gdata_player'
];

var my_key = '<YOUR_KEY>';

function getUri(uri){
    $.get('https://www.googleapis.com/youtube/v3/search/?key='+my_key+'&part=snippet&q='+uri, function(data) {
        if(data.items.length !== 0)
            console.log(data.items[0].snippet.publishedAt);
        else
            console.warn('no items for',uri)
    });
}

for (i = 0; i < urls.length; ++i) {
    getUri(urls[i]);
}

How can I get a Youtube video ID from the Youtube API given the video url?

1 Answers1

Linked