在javascript中使用任意根使相对url绝对

Question

假设我在不同域 (mydomain.com) 上的页面上，并且相对 url 仅存在于代码中（不在 DOM 中）

如何在 javascript 中完全组合两个任意 url？

var a = 'http://example.com/some/path/';
var b = '../other/path/';
var c = magicUrlCombine(a,b);
assert(c == 'http://example.com/some/other/path/');

它也应该适用于

var a = 'http://example.com/some/path/';
var b = 'http://pink-unicorns.com/some/other/path/';
var c = magicUrlCombine(a,b);
assert(c == 'http://pink-unicorns.com/some/other/path/');

编辑：

我正在寻找一个完全通用的函数，用于将绝对 url 与任意 url 结合起来。与浏览器用于解析链接的逻辑相同，但用于不在页面 HTML 中和/或与当前 location.href 无关的 url。

var a = 'http://example.com/a/b/c/';
var b = '../d/e/';
assert(c == 'http://example.com/a/b/d/e/')

或

var b = '/f/g/';
assert(c == 'http://example.com/f/g/')

或

var b = 'http://jquery.com/h/i/';
assert(c == 'http://jquery.com/h/i/')

编辑 2：

node.js 有一个 url module 具有正确的功能，但我还没有找到在客户端重用它的好方法。 (how to use node.js module system on the clientside)

我设法破解了我的方法，让它运行起来，但这并不是我觉得将其放入生产站点的真正解决方案。 Hackety hack

Answer 1

JQuery Mobile 有它

$.mobile.path.makeUrlAbsolute(relPath, absPath)

console.log($.mobile.path.makeUrlAbsolute('../d/e/', 'http://example.com/a/b/c/'));
console.log($.mobile.path.makeUrlAbsolute('/f/g/', 'http://example.com/a/b/c/'));
console.log($.mobile.path.makeUrlAbsolute('http://jquery.com/h/i/', 'http://example.com/a/b/c/'));

都给出了预期的结果

Answer 2

我在服务器端用过，用的是NodeJS，

var url = require('url');
url.resolve(from, to);

在你的情况下：

var a = 'http://example.com/some/path/';
var b = '../other/path/';
var c = url.resolve(a, b);
assert(c == 'http://example.com/some/other/path/');

var a = 'http://example.com/some/path/';
var b = 'http://pink-unicorns.com/some/other/path/';
var c = url.resolve(a, b);
assert(c == 'http://pink-unicorns.com/some/other/path/');

Answer 3

忍不住想解决办法

var magicUrlCombine = function(a,b){
   return (a + b).replace(/[\w\-\.]+\/..\/|\:\/\/[\w\-\.\/]+http/g,'');
}

适用于测试用例和两者的组合

http://jsfiddle.net/8HLeQ/2/

Answer 4

我以为我理解了这个问题，但我的小提琴返回两个错误。例子不明显

http://jsfiddle.net/mplungjan/z5SUn/

function magicUrlCombine(a,b) {
  var linkA = document.createElement('a');
  linkA.href = a;
  var linkB = document.createElement('a');
  linkB.href = b;
  return linkB.href.replace(linkB.host,linkA.host)
}

Answer 5

这是一个可能的但未经测试的解决方案：

function magicCombine(a,b){
    if(b.indexOf('://') != -1) return b;

    var backs = 0;
    var lastIndex = b.indexOf('../');

    while(lastIndex != -1){
        backs++;
        lastIndex = b.indexOf('../', lastIndex+3);
    }

    var URL = a.split('/');
    //Remove last part of URL array, which is always either the file name or [BLANK]
    URL.splice(URL.length-1, 1)

    if(b.substr(0,1) == '/')
        b = b.substr(1);
    var toAdd = b.split('/');

    for(var i = 0, c = toAdd.length-backs; i < c; ++i){
        if(i < backs)
            URL[URL.length - (backs-i)] = toAdd[backs+i];
        else
            URL.push(toAdd[backs+i]);
    }

    return URL.join('/');
}

应该同时处理这两种情况...