正则表达式匹配不被引号包围的 URL答案

【问题标题】：Regex to match URL not surrounded by quotes正则表达式匹配不被引号包围的 URL
【发布时间】：2018-08-31 08:59:55
【问题描述】：

我有这个正则表达式：

/(?!")(https?:\/\/\S*\.(?:gif|jpg|jpeg|tiff|png|svg|webp)(\?([\w=&_%\-]*))?)(?!")/gi

匹配http://example.com/image.png之类的图片url，但如果url被引号"包围，则不匹配，例如<a href="http://example.com/image.png"></a>不应该匹配。

现在我有一个特殊情况：

<a href="https://i.gifer.com/Vs5X.gif"></a>

通常不应该匹配（因为用引号括起来），但是因为域名包含.gif，它仍然匹配https://i.gif。

是否可以使此正则表达式匹配 https://i.gifer.com/Vs5X.gif 但不匹配 <a href="https://i.gifer.com/Vs5X.gif"></a>（因为用引号括起来）？

例如：

<a href="https://i.gifer.com/Vs5X.gif"></a>
-> should NOT match

foo https://i.gifer.com/Vs5X.gif bar
-> should match: https://i.gifer.com/Vs5X.gif

<a href="https://google.com/image.gif"></a>
-> should NOT match

foo https://google.com/image.gif bar
-> should match: https://google.com/image.gif

【问题讨论】：

您是否尝试解析 HTML 图像元素并获取它们的src？
发生这种情况是因为(?!") 是一个否定的前瞻（它不会在你的正则表达式中做任何有意义的事情，你可以删除它，因为它是多余的），而你需要一个后向，(?<!")。在旧的 ECMAScript 版本中，使用 (^|[^"])
@chŝdk 我只是想知道一个字符串是否包含：一个 URL 或一个用引号括起来的 URL。

标签： javascript regex

【解决方案1】：

您的第一个前瞻构造不应该存在。由于大多数浏览器还不支持lookbehinds，你最好这样做：

"[^"]*"|(https?:\/\/[^\/\s]+\/\S+\.(?:gif|jpe?g|tiff|png|svg|webp))\b

这样您就可以在第一个捕获组中获得所需的匹配项。

见live demo here

【讨论】：

您的正则表达式可能会过度匹配，请参阅this demo。
@WiktorStribiżew 请随意在第一组括号内添加\s。
是的，但是，这与位于<a> 标记之外的"https://i.gifer.com/Vs5X.gif" 不匹配。 OP 只想避免匹配 <a> 标签内的 URL（但如果 url 包含在 <a> 标签中，则不匹配）。
@WiktorStribiżew 请注意问题的标题。
对，现在听起来像问题。

【解决方案2】：

您可以在文件扩展名之后使用单词边界匹配 \b：

/(?!")(https?:\/\/\S*\.(?:gif|jpg|jpeg|tiff|png|svg|webp)\b(\?([\w=&_%\-]*))?)(?!")/gi

见Using Special Characters

【讨论】：

不，this won't work in other cases，例如<a href="https://i.gif-er.com/Vs5X.gif"></a>。

【解决方案3】：

您可能需要添加^（匹配输入开头）和$（匹配输入结尾）。我相信下面这样的东西会为你工作：

/^(?!")(https?:\/\/\S*\.(?:gif|jpg|jpeg|tiff|png|svg|webp)(\?([\w=&_%\-]*))?)(?!")$/gi

【讨论】：

为什么是-1？原始问题提供了 2 个示例：'<a href="https://i.gifer.com/Vs5X.gif"></a>' 和 'https://google.com/image.gif'，我的建议与要求的第二个匹配。
@WiktorStribiżew 让我们尝试使用自己的 node.js 或类似repl.it/repls/StupidYellowishSupercollider这样更好的工具来运行代码
@WiktorStribiżew 原始问题不包括“foo i.gifer.com/Vs5X.gif bar”，只是“i.gifer.com/Vs5X.gif”