Como Verificar Si Una URL Es Correcta (Validar URL) con JavaScript

4 minuto(s)

En esta página:

En la mayoría de veces las URLs válidas siguen ciertos patrones que no podemos ver a simple vista y si conoces esos patrones, puedes determinar si una URL es válida o no en tu aplicación y realizar determinadas acciones. Una URL es un localizador que lleva a los usuarios a un sitio web o un archivo en Internet. En este Post, te enseñaré a Como Verificar Si Una URL Es Correcta (Validar URL) con JavaScript, vamos con ello.

Antes de continuar te invito a leer los siguientes artículos:

Asimismo, te invito a escuchar el Podcast: “Razones Por Las Cuales Te Cuesta Aprender A Programar” y “5 Habilidades que Debe Tener un Desarrollador Backend” (Anchor Podcast):

Spotify:	Sound Cloud:	Apple Podcasts	Anchor Podcasts

Bien ahora continuemos con el Post: Como Verificar Si Una URL Es Correcta (Validar URL) con JavaScript.

Constructor URL() de JavaScript

El lenguaje de programación JavaScript cuenta con el constructor URL() que nos devuelve un objeto con datos de una determinada URL. Si ejecutamos el siguiente código en la consola de las herramientas para desarrolladores como Chrome DevTools:


# Ejecutamos el siguiente código en la consola 
const miUrl = new URL("https://www.nubecolectiva.com/");
console.log(miUrl);

# Ejecutamos el siguiente código en la consola

const miUrl = new URL("https://www.nubecolectiva.com/");

console.log(miUrl);

Obtenemos un objeto con ciertos datos:

El objeto con datos anterior significa que la cadena (string) que pasamos al constructor URL() es una URL válida.

Ahora veamos que obtenemos si pasamos una cadena (string) de URL no válida:


# Ejecutamos el siguiente código en la consola 
const miUrl = new URL("nubecolectiva");
console.log(miUrl);

# Ejecutamos el siguiente código en la consola

const miUrl = new URL("nubecolectiva");

console.log(miUrl);

Obtenemos el siguiente mensaje de error:

Entonces cuando pasamos una cadena (string) válida al constructor URL(), obtenemos un nuevo objeto URL y si pasamos una cadena (string) no válida al constructor URL() obtememos un error TypeError.

Sabiendo todo lo anterior, podemos crear una función personalizada para verificar la validez de una URL, veamos esto a continuación.

Como Verificar Si Una URL Es Correcta (Validar URL) con JavaScript

Para verificar si una URL es válida, vamos hacer uso del constructor URL() con la declaración try … catch, estos los colocaremos en una función llamada validarURL(), tu le puedes poner el nombre que desees a tu función:


function validarURL(miurl) {
  try {

    new URL(miurl);
    return true;

  } catch (err) {

    return false;

  }
}

// Hacemos log 
console.log(validarURL('https://www.nubecolectiva.com/')); 

// Obtenemos 
true

function validarURL(miurl) {

try {

new URL(miurl);

return true;

} catch (err) {

return false;

}

// Hacemos log

console.log(validarURL('https://www.nubecolectiva.com/'));

// Obtenemos

true

Entonces, en el código anterior obtenemos el booleano true, esto significa que la URL es válida y sobre ello podemos realizar alguna o varias acciones que deseemos, igualmente para cuando nos arroje false, cuando la URL sea inválida.

Conclusión

En este Post hemos aprendido a como validar si una URL es válidad, recuerda que puedes usar tus propios métodos y personalizarlos, la manera como te enseño a hacerlo es una de ellas y puede ser una base para comenzar.