检查路径是相对路径还是绝对路径的正则表达式

Question

我在跟踪“a”标签上的onclick事件，点击函数将获取“a”标签的href属性。我想检查href是绝对路径还是相对路径。是否有正则表达式可以检查？

除了这个模式之外：

"/myfolder/test.txt"
"http://example.com"
"https://example.com"

我需要检查的其他模式是什么？

- Ashish Patel

---

这可能是 https://dev59.com/4EzSa4cB1Zd3GeqPmnGm 的重复。 - priya_singh

请注意，这里的大多数答案都没有考虑到协议无关的URL。 - mcont

Answer 1

为什么要使用正则表达式呢？可以使用 str.startsWith 方法：

console.log("/myfolder/test.txt".startsWith("/"));
console.log("http://example.com".startsWith("/"));
console.log("https://example.com".startsWith("/"));

如果你需要考虑以/或~开头的路径：

console.log(/^([?/~]|mailto.*@.*\.\w+$)/.test("mailto:[e-mail]"));
console.log(/^([?/~]|mailto.*@.*\.\w+$)/.test("~/myfolder/test.txt"));
console.log(/^([?/~]|mailto.*@.*\.\w+$)/.test("/myfolder/test.txt"));
console.log(/^([?/~]|mailto.*@.*\.\w+$)/.test("http://example.com"));
console.log(/^([?/~]|mailto.*@.*\.\w+$)/.test("https://example.com"));

- Thomas Ayoub

---

如果我理解问题正确，它应该涵盖所有列出的变体，而 startsWith 只能涵盖第一个。 - axel.michel

似乎是我的误读。这个问题的标题表明你是正确的。我原以为他想要一个解决方案来匹配“/”和“http(s)://”，抱歉。 - axel.michel

查询字符串怎么办：**?hello=world**，它不是绝对URI？ - Yosvel Quintero

Answer 2

这里提供了一种使用URI.js#is的解决方案：

function isAbsoluteUri(str) {
  var uri = new URI(str);
  return uri.is('absolute');
}

console.log(isAbsoluteUri('/myfolder/test.txt'));
console.log(isAbsoluteUri('~/myfolder/test.txt'));
console.log(isAbsoluteUri('?hello=world'));
console.log(isAbsoluteUri('http://example.com'));
console.log(isAbsoluteUri('https://example.com'));
console.log(isAbsoluteUri('ftp://example.com'));
console.log(isAbsoluteUri('mailto:[e-mail]'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/URI.js/1.18.2/URI.min.js"></script>

- Yosvel Quintero

---

为了保持一致性，更改函数名称：isAbsoluteUri('http://example.com') === true。谢谢。 - Yosvel Quintero

干得好，@YosvelQuintero。对语言的良好知识和使用。 - Addison

Answer 3

如果你知道你总是得到一个有效的路径，那么你所要做的就是检查它是否以 / 开头。代码如下：

```if (path.startsWith('/')) { // do something }```

^\/.*

例子：https://regex101.com/r/rdox2A/1

- Addison

Answer 4

如果您想测试所有锚点，可以这样做。正则表达式模式检查任何拼写错误，也就是所谓的“肥手指”。

function checkRelpath(){
    var anChrs = $('a');

    $.each(anChrs, function(idx, itm){
        var pattern = new RegExp('/^(http|https|http:|https:|\/\/)/'),
            path = $(itm).prop('href'),
            testPath = pattern.test(path);

        console.log(path);
        console.log(testPath);
    });
}

或者，如果您想测试特定的锚点，可以这样做。

function checkThisRelpath(a){
    var pattern = new RegExp('/^(http|https|http:|https:|\/\/)/'),
        path = $(a).prop('href'),
        testPath = pattern.test(path);

        console.log(path);
        console.log(testPath);
}

- andre mcgruder

Answer 5

/**
 * Return true is the URL is absolute
 * 
 * @export
 * @param {string} url 
 * @returns
 */
export function isURLAbsolute(url) {
    if (typeof url !== 'string') {
        throw new TypeError('Expected a string');
    }
    return /^[a-z][a-z0-9+.-]*:/.test(url);
}

- Sébastien

---

foo:bar 如何成为绝对 URL？ - bfontaine