¿Cómo analizo una URL en nombre de host y ruta en javascript?

quisiera tomar una cuerda

var a = "http://example.com/aa/bb/"

y procesarlo en un objeto tal que

a.hostname == "example.com"

y

a.pathname == "/aa/bb"

Apr 10 '09 09:04 freddiefujiwara

La forma moderna:

new URL("http://example.com/aa/bb/")

Devuelve un objeto con propiedades hostnamey pathname, junto con algunos otros .

El primer argumento es una URL relativa o absoluta; si es relativo, entonces necesita especificar el segundo argumento (la URL base). Por ejemplo, para una URL relativa a la página actual:

new URL("/aa/bb/", location)

Además de en los navegadores, esta API también está disponible en Node.js desde la v7, hasta require('url').URL.

Jun 03 '2014 02:06 rvighne

var getLocation = function(href) {
    var l = document.createElement("a");
    l.href = href;
    return l;
};
var l = getLocation("http://example.com/path");
console.debug(l.hostname)
>> "example.com"
console.debug(l.pathname)
>> "/path"

Apr 10 '2009 07:04 freddiefujiwara

encontrado aquí: https://gist.github.com/jlong/2428561

var parser = document.createElement('a');
parser.href = "http://example.com:3000/pathname/?search=test#hash";

parser.protocol; // => "http:"
parser.host;     // => "example.com:3000"
parser.hostname; // => "example.com"
parser.port;     // => "3000"
parser.pathname; // => "/pathname/"
parser.hash;     // => "#hash"
parser.search;   // => "?search=test"
parser.origin;   // => "http://example.com:3000"

Apr 12 '2013 19:04 Joseph Oster

Aquí hay una función simple que usa una expresión regular que imita el acomportamiento de la etiqueta.

Ventajas

Comportamiento predecible (sin problemas entre navegadores)
no necesita el DOM
es muy corto.

Contras

La expresión regular es un poco difícil de leer.

-

function getLocation(href) {
    var match = href.match(/^(https?\:)\/\/(([^:\/?#]*)(?:\:([0-9]+))?)([\/]{0,1}[^?#]*)(\?[^#]*|)(#.*|)$/);
    return match && {
        href: href,
        protocol: match[1],
        host: match[2],
        hostname: match[3],
        port: match[4],
        pathname: match[5],
        search: match[6],
        hash: match[7]
    }
}

-

getLocation("http://example.com/");
/*
{
    "protocol": "http:",
    "host": "example.com",
    "hostname": "example.com",
    "port": undefined,
    "pathname": "/"
    "search": "",
    "hash": "",
}
*/

getLocation("http://example.com:3000/pathname/?search=test#hash");
/*
{
    "protocol": "http:",
    "host": "example.com:3000",
    "hostname": "example.com",
    "port": "3000",
    "pathname": "/pathname/",
    "search": "?search=test",
    "hash": "#hash"
}
*/

EDITAR:

Aquí hay un desglose de la expresión regular.

var reURLInformation = new RegExp([
    '^(https?:)//', // protocol
    '(([^:/?#]*)(?::([0-9]+))?)', // host (hostname and port)
    '(/{0,1}[^?#]*)', // pathname
    '(\\?[^#]*|)', // search
    '(#.*|)$' // hash
].join(''));
var match = href.match(reURLInformation);

Feb 04 '2014 13:02 Rems