Question

所以我想在Javascript中使用相对网址加入字符串。

base url =“http://www.adress.com/more/evenmore”

与

relative url =“../../adress”=＆gt; “http://www.adress.com/adress”
relative url =“../adress”=＆gt; “http://www.adress.com/more/adress”

最好的方法是什么？我正在考虑使用正则表达式并检查
我找到多少“../”，然后从基础中减去该数量并将它们添加到剩下的内容中。

Answer 1

以下函数会分解URL然后解析它。

function concatAndResolveUrl(url, concat) {
  var url1 = url.split('/');
  var url2 = concat.split('/');
  var url3 = [ ];
  for (var i = 0, l = url1.length; i < l; i ++) {
    if (url1[i] == '..') {
      url3.pop();
    } else if (url1[i] == '.') {
      continue;
    } else {
      url3.push(url1[i]);
    }
  }
  for (var i = 0, l = url2.length; i < l; i ++) {
    if (url2[i] == '..') {
      url3.pop();
    } else if (url2[i] == '.') {
      continue;
    } else {
      url3.push(url2[i]);
    }
  }
  return url3.join('/');
}

Answer 2

使用URI.js（http://medialize.github.com/URI.js/docs.html#absoluteto）：

function joinUrl(baseUrl, url) {
    var theUrl = new URI(url);
    if (theUrl.is("relative")) {
        theUrl = theUrl.absoluteTo(baseUrl);
    }
    return theUrl.toString();
}

Answer 3

8年后，许多浏览器（Internet Explorer除外）都支持URL constructer。

> new URL('../address', 'http://www.adress.com/more/evenmore/').href
"http://www.adress.com/more/address"
> new URL('../../address', 'http://www.adress.com/more/evenmore/').href
"http://www.adress.com/address"

Answer 4

@ning提到的ECMAScript URL Web API是一个很好的起点：尤其是在香草JS实现（Node等）中可用时，并不需要您使用的库将执行nowq已经完成的实现。查阅MDN文档，更多specifically the examples，是一个很好的起点。

直接（从某种程度上）从他们的文档中借用：

let m = 'https://developer.mozilla.org';

// ... omitted 

let d = new URL('/en-US/docs', m);

如果要执行上述操作，然后console.log到构造的URL对象的.toString，则输出将是：'https://developer.mozilla.org/en-US/docs'。

重要的是，如果您查阅文档的“语法”部分，则会注意到 second 参数是可选的，而 second 参数是可选的（如上例所示）表示 base URL（尽管仅在提供两个参数的情况下）。

如果两个参数值都是绝对URL，则Web API将优先使用第一个参数，而丢弃第二个。

如果您使用的是Node.js，我建议您再看一下本机path模块，该模块用于在相对路径上进行工作，而不是使用库。这里的主要动机是，改进自己的算法（可能只是在这里和那里对path的调用）比引入将引入其他一些依赖项（可能会给应用程序引入漏洞和不必要的膨胀）的库更好。（或者只是太重而无法满足您的需求）。

但是，如果您在前端工作，将没有path可用，并且-如@cburgmer's answer注释中所述-Web API的URL不支持提到的相对路径情况。在这种情况下，您可能需要寻找一个库来为您完成此任务。但是，再次给出其他答案，我会考虑尝试一种本地化方法。

值得称赞的是，URI.js仅集成了one non-dev. dependency，并且没有很大的占有空间。

加入相对网址？

4 个答案: