jQuery Youtube URL Validation with regex jQuery Youtube URL Validation with regex javascript javascript

jQuery Youtube URL Validation with regex


ULTIMATE YOUTUBE REGEX

Cherry picking

Because the explanation is getting longer and longer, I place the final result at the top. Feel free to copy+paste, and go on your way. For a detailed explanation, read _"the full story"_ below.
/** * JavaScript function to match (and return) the video Id  * of any valid Youtube Url, given as input string. * @author: Stephan Schmitz <eyecatchup@gmail.com> * @url: https://stackoverflow.com/a/10315969/624466 */function ytVidId(url) {  var p = /^(?:https?:\/\/)?(?:www\.)?(?:youtu\.be\/|youtube\.com\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=))((\w|-){11})(?:\S+)?$/;  return (url.match(p)) ? RegExp.$1 : false;}

The full story

Amarghosh's regex looks good, at first sight. But it:

  1. doesn't match video id's that include dashes (-),
  2. doesn't validate the id length (v=aa and v=aaaaaaaaaaaaaaaaaa return to be valid),
  3. and doesn't match secured URLs at all (https://youtube.com/watch?valid_params)

To match https, the dash character, and to validate the id length, this was my initial suggestion of a modified version of Amarghosh's regex:

^https?:\/\/(?:www\.)?youtube\.com\/watch\?(?=.*v=((\w|-){11}))(?:\S+)?$

UPDATE 1: URLs versus Strings

After I posted the above pattern, I was asked: "What if the URL is like this;
youtube.com/watch?gl=US&hl=en-US&v=bQVoAWSP7k4"
?

First of, please note that this not a URL at all. RFC compliant URLs must start with the scheme! ;)

Anyway, to match any kind of string that indicates to refer to a YouTube video, I updated my answer to exclude the URL scheme being required. So my second suggestion was as follows:

^(?:https?:\/\/)?(?:www\.)?youtube\.com\/watch\?(?=.*v=((\w|-){11}))(?:\S+)?$

UPDATE 2: The ultimate regex

Then I was asked to add support for a "special case"; the youtu.be short urls. Initially I did not add these, since it wasn't specifically part of the question. However I updated my answer now with all possible "special cases". This means that not only have I added support for youtu.be links, but also the request paths "/v" and "/embed".

So, may I introduce: My final and ultimate Youtube regex:

^(?:https?:\/\/)?(?:www\.)?(?:youtu\.be\/|youtube\.com\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=))((\w|-){11})(?:\S+)?$

What strings are matched?

Now this pattern will work for any strings, formatted as follows:

Without scheme and subdomain (Domain: youtu.be, Path: /)

youtu.be/<video:id>   

Without scheme, with subdomain (Domain: youtu.be, Path: /)

www.youtu.be/<video:id>     

With HTTP scheme, without subdomain (Domain: youtu.be, Path: /)

http://youtu.be/<video:id>   

With HTTP scheme and subdomain (Domain: youtu.be, Path: /)

http://www.youtu.be/<video:id>   

With HTTPS scheme, without subdomain (Domain: youtu.be, Path: /)

https://youtu.be/<video:id>     

With HTTPS scheme and subdomain (Domain: youtu.be, Path: /)

https://www.youtu.be/<video:id>   

Without scheme and subdomain (Domain: youtube.com, Path: /embed)

youtube.com/embed/<video:id>   youtube.com/embed/<video:id>&other_params 

Without scheme, with subdomain (Domain: youtube.com, Path: /embed)

www.youtube.com/embed/<video:id>   www.youtube.com/embed/<video:id>&other_params   

With HTTP scheme, without subdomain (Domain: youtube.com, Path: /embed)

http://youtube.com/embed/<video:id>   http://youtube.com/embed/<video:id>&other_params  

With HTTP scheme and subdomain (Domain: youtube.com, Path: /embed)

http://www.youtube.com/embed/<video:id>   http://www.youtube.com/embed/<video:id>&other_params  

With HTTPS scheme, without subdomain (Domain: youtube.com, Path: /embed)

https://youtube.com/embed/<video:id>   https://youtube.com/embed/<video:id>&other_params    

With HTTPS scheme and subdomain (Domain: youtube.com, Path: /embed)

https://www.youtube.com/embed/<video:id>   https://www.youtube.com/embed/<video:id>&other_params

Without scheme and subdomain (Domain: youtube.com, Path: /v)

youtube.com/v/<video:id>   youtube.com/v/<video:id>&other_params 

Without scheme, with subdomain (Domain: youtube.com, Path: /v)

www.youtube.com/v/<video:id>   www.youtube.com/v/<video:id>&other_params   

With HTTP scheme, without subdomain (Domain: youtube.com, Path: /v)

http://youtube.com/v/<video:id>   http://youtube.com/v/<video:id>&other_params  

With HTTP scheme and subdomain (Domain: youtube.com, Path: /v)

http://www.youtube.com/v/<video:id>   http://www.youtube.com/v/<video:id>&other_params  

With HTTPS scheme, without subdomain (Domain: youtube.com, Path: /v)

https://youtube.com/v/<video:id>   https://youtube.com/v/<video:id>&other_params    

With HTTPS scheme and subdomain (Domain: youtube.com, Path: /v)

https://www.youtube.com/v/<video:id>   https://www.youtube.com/v/<video:id>&other_params   

Without scheme and subdomain (Domain: youtube.com, Path: /watch)

youtube.com/watch?v=<video:id>   youtube.com/watch?v=<video:id>&other_params   youtube.com/watch?other_params&v=<video:id> youtube.com/watch?other_params&v=<video:id>&more_params  

Without scheme, with subdomain (Domain: youtube.com, Path: /watch)

www.youtube.com/watch?v=<video:id>   www.youtube.com/watch?v=<video:id>&other_params   www.youtube.com/watch?other_params&v=<video:id>  www.youtube.com/watch?other_params&v=<video:id>&more_params   

With HTTP scheme, without subdomain (Domain: youtube.com, Path: /watch)

http://youtube.com/watch?v=<video:id>   http://youtube.com/watch?v=<video:id>&other_params   http://youtube.com/watch?other_params&v=<video:id>   http://youtube.com/watch?other_params&v=<video:id>&more_params  

With HTTP scheme and subdomain (Domain: youtube.com, Path: /watch)

http://www.youtube.com/watch?v=<video:id>   http://www.youtube.com/watch?v=<video:id>&other_params   http://www.youtube.com/watch?other_params&v=<video:id>   http://www.youtube.com/watch?other_params&v=<video:id>&more_params  

With HTTPS scheme, without subdomain (Domain: youtube.com, Path: /watch)

https://youtube.com/watch?v=<video:id>   https://youtube.com/watch?v=<video:id>&other_params   https://youtube.com/watch?other_params&v=<video:id>   https://youtube.com/watch?other_params&v=<video:id>&more_params     

With HTTPS scheme and subdomain (Domain: youtube.com, Path: /watch)

https://www.youtube.com/watch?v=<video:id>   https://www.youtube.com/watch?v=<video:id>&other_params   https://www.youtube.com/watch?other_params&v=<video:id>https://www.youtube.com/watch?other_params&v=<video:id>&more_params  

FUNCTIONAL USAGE

The most easy way to use the pattern, is to wrap it into a function such as this one:

/** * JavaScript function to match (and return) the video Id * of any valid Youtube Url, given as input string. * @author: Stephan Schmitz <eyecatchup@gmail.com> * @url: https://stackoverflow.com/a/10315969/624466 */function ytVidId(url) {  var p = /^(?:https?:\/\/)?(?:www\.)?(?:youtu\.be\/|youtube\.com\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=))((\w|-){11})(?:\S+)?$/;  return (url.match(p)) ? RegExp.$1 : false;}// for example snippet only!document.body.addEventListener('click', function(e) {    if (e.target.className == 'yt-url' && 'undefined' !== e.target.value) {        var ytId = ytVidId(e.target.value);        alert(e.target.value + "\r\nResult: " + (!ytId ? 'false' : ytId));    }}, false);
<!-- Click the buttons to probe URLs --><input type="button" value="https://www.youtube.com/watch?v=p-e2G_VcTms&feature=g-logo&context=G29aead6FOAAAAAAABAA" class="yt-url"><input type="button" value="https://www.youtube.com/latest" class="yt-url">