Validación de URL de JS Regex

3 minutos de lectura

avatar de usuario de motis10
motis10

Traté de validar la URL con o sin http. No importa lo que hice, la función devolvió falso. Revisé mi cadena de expresiones regulares en este sitio:
http://regexr.com/
Y se ve como espero.

    function isUrlValid(userInput) {
        var regexQuery = "/(http(s)?://.)?(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/";
        var url = new RegExp(regexQuery,"g");
        if (url.test(userInput)) {
            alert('Great, you entered an E-Mail-address');
            return true;
        }
        return false;
    }

Arreglo el problema cambiando el .test a .match y dejo la expresión regular como está.

Cambio la función a Match + hago un cambio aquí con las barras y su trabajo: (http(s)?://.)

La función fija:

function isUrlValid(userInput) {
    var res = userInput.match(/(http(s)?:\/\/.)?(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/g);
    if(res == null)
        return false;
    else
        return true;
}

  • Debiera ser (http(s)?:\/\/.)?(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&=]*) . Comprobando la expresión regular anterior en Regex101.com da error

    – saruftw

    22 de febrero de 2017 a las 8:47

avatar de usuario de m69
m69 ”sarcástico y poco acogedor”

Creo que la otra respuesta rechazará algunas URL válidas (como nombres de dominio en mayúsculas o subdominios largos) y permitirá algunas no válidas (como http://www.-ejemplo-.com o www.%@&.com). Traté de tener en cuenta una serie de reglas de sintaxis de URL adicionales (sin entrar en la internacionalización).

function isUrlValid(userInput) {
    var regexQuery = "^(https?://)?(www\\.)?([-a-z0-9]{1,63}\\.)*?[a-z0-9][-a-z0-9]{0,61}[a-z0-9]\\.[a-z]{2,6}(/[-\\w@\\+\\.~#\\?&/=%]*)?$";
    var url = new RegExp(regexQuery,"i");
    return url.test(userInput);
}
var input = ["https://o.sub-domain.example.com/foo/bar?foo=bar&boo=far#a%20b",
             "HTTP://EX-AMPLE.COM",
             "example.c",
             "example-.com"];
for (var i in input) document.write(isUrlValid(input[i]) + ": " + input[i] + "<br>");

Para permitir también direcciones IP y números de puerto, la expresión regular es:

"^(https?://)?(((www\\.)?([-a-z0-9]{1,63}\\.)*?[a-z0-9][-a-z‌​0-9]{0,61}[a-z0-9]\\‌​.[a-z]{2,6})|((\\d{1‌​,3}\\.){3}\\d{1,3}))‌​(:\\d{2,4})?(/[-\\w@‌​\\+\\.~#\\?&/=%]*)?$‌​"  

Para permitir también cadenas de consulta sin una barra oblicua entre el nombre de dominio y el signo de interrogación (que en teoría no está permitido, pero funciona en la mayoría de las situaciones de la vida real), la expresión regular es:

"^(https?://)?(((www\\.)?([-a-z0-9]{1,63}\\.)*?[a-z0-9][-a-z‌​0-9]{0,61}[a-z0-9]\\‌​.[a‌​-z]{2,6})|((\\d‌​{1,3}\\.){3}\\d{1,3}‌​))(:\\d{2,4})?((/|\\‌​?)[-\\w@\\+\\.~#\\?&‌​/=%]*)?$"

Para asegurarse también de que cada % vaya seguido de un número hexadecimal, la expresión regular es:

"^(https?://)?(((www\\.)?([-a-z0-9]{1,63}\\.)*?[a-z0-9][-a-z‌​0-9]{0,61}[a-z0-9]\\‌​.[a-z]{2,6})|((\\d{1‌​,3}\\.){3}\\d{1,3}))‌​(:\\d{2,4})?((/|\\?)‌​(((%[0-9a-f]{2})|[-\‌​\w@\\+\\.~#\\?&/=])*‌​))?$"

(Nota: como John Wu mencionó en un comentario, hay dominios de una sola letra).

Avatar de usuario de AmerllicA
AmerllicA

En realidad, esta pregunta necesita un poderoso regex y el siguiente código no es muy difícil de entender, consulte a continuación (ES6 – TypeScript):

const isValidUrl = (url: string): boolean => {
  const urlRegex = /^((http(s?)?):\/\/)?([wW]{3}\.)?[a-zA-Z0-9\-.]+\.[a-zA-Z]{2,}(\.[a-zA-Z]{2,})?$/g;
  const result = url.match(urlRegex);

  return result !== null;
};

Prueba este código.

function CheckURL(fieldId, alertMessage) {
    var url = fieldId.value;
    if(url !== "")
    {
        if (url.match(/(http(s)?:\/\/.)?(www\.)?[-a-zA-Z0-9@:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_\+.~#?&//=]*)/g) !== null)
            return true;
        else {
            alert(alertMessage);
            fieldId.focus();
            return false;
        }
    }
}

var website = document.getElementById('Website');
if (!CheckURL(website, "Enter a valid website address")) {
    return false;
}

¿Ha sido útil esta solución?