自定义网址的Javascript正则表达式？

Question

我有3种URL情况

1. 正常网址：
   • http://example.com，
   • https://example.com，
   • https://example.com/products/1234，
   • https://example.com/products?category=shoes&limit=10
具有上下文变量的
2. url：
   • https://example.com/products/ {$ context.productId}
3. 整个url是上下文变量：
   • {$ varContext.getProductUrl}

我必须验证输入URL以匹配上述3种情况。

我已经编写了正则表达式，但不适用于所有情况。

^((?:http(s){0,1}://[\\w\\-\\.:/\$\{\}=\?&]+)|(?:\{\$[a-zA-Z]+\.[a-zA-Z]+\}))$

有人可以帮忙吗？

Answer 1

您好，您犯了一个非常简单的错误。距离终点线1％的距离。

^((?:http(s){0,1}:\/\/[\w\-\.:/\${}=\?&]+)|(?:{\$[a-zA-Z]+.[a-zA-Z]+}))$

是您刚刚忘记转义/表示（表示）文字/的正确代码。错误出现在^((?:http(s){0,1}:

之后

下次如果您不认识，请使用Regex101, a site to help you test your regex之类的网站。

Answer 2

除了在http：//之后转义正斜杠外，您还正在字符类中转义反斜杠。 \\w将匹配一个反斜杠和一个w。 \\-\\这部分将匹配\到\的范围，该范围将匹配反斜杠。

例如http://w\.:/${}=?&

此外，您可以对正则表达式进行一些调整。

• (s){0,1}可以写为https?
• 字符类[\\w\\-\\.:/\$\{\}=\?&]可以写为[\w.:/${}=?&-]，而无需转义.$?，并且连字符可以移到开头或结尾。 \\将与反斜杠匹配。
• 如果您不需要捕获组()，则可以忽略它，而仅使用备用|
• 您可以使用/i获得不区分大小写的匹配，并且字符类将变为[a-z]
• 转义点\.，使其从字面上匹配

例如：

const regex = /^https?:\/\/[\w.:/${}=?&-]+|{\$[a-z]+\.[a-z]+}$/i;

请参见Regex demo