用于匹配 YouTube 嵌入 ID 的正则表达式答案

【问题标题】：RegEx for matching YouTube embed ID用于匹配 YouTube 嵌入 ID 的正则表达式
【发布时间】：2019-05-10 01:11:57
【问题描述】：

我使用的是非现代 JavaScript，并且我有一个字符串定义如下：

"//www.youtube.com/embed/DmYK479EpQc?vq=hd720&rel=0"

我只想取出DmYK479EpQc，但我不知道长度。我知道我想要/ 之后和? 之前的内容

是否有一些简单的 JavaScript 行可以解决这个问题？

【问题讨论】：

你试过了吗？
URL 中永远只有一个?，而您要查找的部分总是紧随其后，对吧？
AFAIK，youtube 视频 ID 的长度始终为 11 且唯一。

标签： javascript regex regex-group regex-greedy

【解决方案1】：

使用URL 对象？

console.log(
   (new URL("//www.youtube.com/embed/DmYK479EpQc?vq=hd720&rel=0", location.href)).pathname
   .split('/')
   .pop());

为什么？因为我可能会编造一个不符合正则表达式的 URL（尽管对于 youtube 来说这可能不太可能）

【讨论】：

【解决方案2】：

This expression 可能会帮助您这样做，而且可能会更快：

(d\/)([A-z0-9]+)(\?)

图表

此图显示了表达式的工作原理，您可以在此 link 中可视化其他表达式：

const regex = /(.*)(d\/)([A-z0-9]+)(\?)(.*)/gm;
const str = `//www.youtube.com/embed/DmYK479EpQc?vq=hd720&rel=0`;
const subst = `$3`;

// The substituted value will be contained in the result variable
const result = str.replace(regex, subst);

console.log('Substitution result: ', result);

性能测试

此 JavaScript sn-p 使用简单的 100 万次 for 循环显示了该表达式的性能。

const repeat = 1000000;
const start = Date.now();

for (var i = repeat; i >= 0; i--) {
	const string = '//www.youtube.com/embed/DmYK479EpQc?vq=hd720&rel=0';
	const regex = /(.*)(d\/)([A-z0-9]+)(\?)(.*)/gm;
	var match = string.replace(regex, "$3");
}

const end = Date.now() - start;
console.log("YAAAY! \"" + match + "\" is a match ??? ");
console.log(end / 1000 + " is the runtime of " + repeat + " times benchmark test. ? ");

【讨论】：

【解决方案3】：

非正则表达式怎么样

console.log("//www.youtube.com/embed/DmYK479EpQc?vq=hd720&amp;rel=0".split('/').pop().split('?')[0]);

【讨论】：

【解决方案4】：

我不打算给出一段代码，因为这是一个相对简单的算法，并且易于实现。

请注意，这些链接具有这种格式（如果我错了，请纠正我）：

https:// 或 http://
www.youtube.com/
embed/
视频 ID（本例中为DmYK479EpQc）
?parameters（请注意，它们始终以字符 ? 开头）

您需要视频的 ID，因此您可以将字符串拆分为这些部分，如果将这些部分存储在一个数组中，则可以确保 ID 位于第三位。

该数组的外观示例如下：

['https://', 'www.youtube.com', 'embed', 'DmYK479EpQc', '?vq=hd720&rel=0']

【讨论】：

【解决方案5】：

一个选项使用正则表达式替换：

var url = "//www.youtube.com/embed/DmYK479EpQc?vq=hd720&rel=0";
var path = url.replace(/.*\/([^?]+).*/, "$1");
console.log(path);

上面的正则表达式模式说：

.*       match and consume everything up to and
/        including the last path separator
([^?]+)  then match and capture any number of non ? characters
.*       then consume the rest of the input

然后，我们只需替换为第一个捕获组，它对应于最终路径分隔符之后的文本，但在查询字符串的开头之前，URL 是否应该有一个。

【讨论】：

【解决方案6】：

你可以使用这个正则表达式

.* 匹配并消耗所有内容 [A-z0-9]+ 然后匹配并捕获 A-z 之间的任何数字和字符 .* 然后消费剩下的输入

const ytUrl = '//www.youtube.com/embed/DmYK479EpQc?vq=hd720&rel=0';
const regex = /(.*)(d\/)([A-z0-9]+)(\?)(.*)/gm;
const position = '$3';

let result = ytUrl.replace(regex, position);

console.log('YouTube ID: ', result);

这个正则表达式只是将字符串分成不同的部分，YouTube id 位于第三位。

另一个解决方案是使用split。此方法将字符串拆分为子字符串数组。

const ytUrl = '//www.youtube.com/embed/DmYK479EpQc?vq=hd720&rel=0';

let result = ytUrl.split('/').pop().split('?').shift()

console.log('YouTube ID: ', result);

在此示例中，我们使用/ 作为分隔符来拆分 URL。然后我们使用pop 方法取出数组的最后一个元素。最后我们使用?作为分隔符再次拆分，我们使用shift方法获取数组的第一个元素。

【讨论】：