Vamos a utilizar expresiones regulares y la desestructuración de arrays para poder extraer partes de una URL en Javascript de una forma sencilla.
Lo primero será tener una cadena que contenga la URL:
var url = 'https://www.manualweb.net/java/tipos-datos-primitivos/';
De esta URL vamos a extraer 3 partes: la primera será el protocolo de la URL, segunda será el nombre del servidor y la tercera el path dentro del servidor.
La expresión regular que nos va a ayudar a analizar la URL será la siguiente:
/^(\w+):\/\/([^\/]+)([^]+)$/
Los grupos que queramos extraer serán aquellos que van entre paréntesis. Para ello indicamos que nos extraiga cualquier palabra antes del :// para obtener el protocolo, esto lo haremos mediante el código (\w+)
, todo lo que vaya hasta la primera barra /
será el nombre del servidor, como el nombre del servidor puede tener números, letras, guiones, puntos,… indicaremos que será cualquier carácter hasta la barra: ([^\/]+)
. La parte final, que podrá tener cualquier carácter será la que nos deje el path: ([^]+)
.
Tras ejecutar esta expresión regular mediante el comando .exec()
:
var url_analizada = /^(\w+):\/\/([^\/]+)([^]+)$/.exec(url);
Veremos que la salida es un array de la siguiente forma:
[ ‘https://www.manualweb.net/java/tipos-datos-primitivos/’,
‘https’,
‘www.manualweb.net’,
‘/java/tipos-datos-primitivos/’,
index: 0,
input: ‘https://www.manualweb.net/java/tipos-datos-primitivos/’ ]
Veremos que obviando la primera posición, en las siguientes tenemos los datos que vamos buscando. Es por ello que mediante la desestructuración del array en Javascript vamos a obtener estas variables:
var [,protocolo,servidor,path] = url_analizada;
Estas variables las podemos analizar y utilizar de forma separada dentro de nuestro código fuente:
console.log('Protocolo: ' + protocolo);
console.log('Servidor: ' + servidor);
console.log('Path: ' + path);
De esta forma tan sencilla hemos conseguido extraer partes de una URL en Javascript.