那些遇到过的问题

尝试使用JavaScript验证URL

vin*_*nay 83 javascript validation url jquery

我想验证一个URL并显示消息.以下是我的代码:

$("#pageUrl").keydown(function(){
        $(".status").show();
        var url = $("#pageUrl").val();

        if(isValidURL(url)){

        $.ajax({
            type: "POST",
            url: "demo.php",
            data: "pageUrl="+ url,
            success: function(msg){
                if(msg == 1 ){
                    $(".status").html('<img src="images/success.gif"/><span><strong>SiteID:</strong>12345678901234456</span>');
                }else{
                    $(".status").html('<img src="images/failure.gif"/>');
                }
            }
            });

            }else{

                    $(".status").html('<img src="images/failure.gif"/>');
            }

    });


function isValidURL(url){
    var RegExp = /(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/;

    if(RegExp.test(url)){
        return true;
    }else{
        return false;
    }
}
Run Code Online (Sandbox Code Playgroud)

我的问题是,即使输入正确的URL直到它与正则表达式匹配,它也会显示错误消息,即使URL类似,它也会返回true "http://wwww".

我感谢你的建议.

art*_*ker 68

有人提到了Jquery Validation插件,如果你只是想验证url似乎有点过分,这里是插件的正则表达式:

return this.optional(element) || /^(https?|ftp):\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?)(:\d*)?)(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(\#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i.test(value);
Run Code Online (Sandbox Code Playgroud)

以下是他们从中获取的地方:http://projects.scottsplayground.com/iri/

由@nhahtdh指出这已更新为:

        // Copyright (c) 2010-2013 Diego Perini, MIT licensed
        // https://gist.github.com/dperini/729294
        // see also https://mathiasbynens.be/demo/url-regex
        // modified to allow protocol-relative URLs
        return this.optional( element ) || /^(?:(?:(?:https?|ftp):)?\/\/)(?:\S+(?::\S*)?@)?(?:(?!(?:10|127)(?:\.\d{1,3}){3})(?!(?:169\.254|192\.168)(?:\.\d{1,3}){2})(?!172\.(?:1[6-9]|2\d|3[0-1])(?:\.\d{1,3}){2})(?:[1-9]\d?|1\d\d|2[01]\d|22[0-3])(?:\.(?:1?\d{1,2}|2[0-4]\d|25[0-5])){2}(?:\.(?:[1-9]\d?|1\d\d|2[0-4]\d|25[0-4]))|(?:(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)(?:\.(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)*(?:\.(?:[a-z\u00a1-\uffff]{2,})).?)(?::\d{2,5})?(?:[/?#]\S*)?$/i.test( value );
Run Code Online (Sandbox Code Playgroud)

来源:https://github.com/jzaefferer/jquery-validation/blob/c1db10a34c0847c28a5bd30e3ee1117e137ca834/src/core.js#L1349

  • 可能是@infensus？http://www.dns-sd.org/TrailingDotsInDomainNames.html (7认同)
  • 上面的正则表达式已经被Diego Perini在jQuery验证源代码中的正则表达式所取代:https://github.com/jzaefferer/jquery-validation/blob/master/src/core.js#L1191 (2认同)
  • @Kousha:`www.google.com`**_不是_**一个有效的URL,所以它应该通过测试. (2认同)

bob*_*nce 47

使用正则表达式解析URL是不切实际的.RFC1738规则的完整实现将导致极长的正则表达式(假设它甚至可能).当然,您当前的表达式会失败许多有效的URL,并传递无效的URL.

代替:

一个.使用实际遵循真实规则的正确URL解析器.(我不知道有一个用于JavaScript;它可能是矫枉过正的.你可以在服务器端做到这一点).要么,

湾 只需删除任何前导或尾随空格,然后检查它在前面有一个首选方案(通常是"http://"或"https://"),并保留它.要么,

C.尝试使用URL并查看最后的内容,例如通过从服务器端发送HTTP HEAD请求.如果您收到404或连接错误,则可能是错误的.

即使网址类似于" http:// wwww ",它也会返回true .

嗯,这确实是一个完全有效的URL.

如果要检查"wwww"等主机名是否确实存在,则别无选择,只能在DNS中查找.同样,这将是服务器端代码.

  • 这是务实吗？是.它是回答问题还是提供足够的信息来实现实施？没有. (43认同)

小智 33 

function validateURL(textval) {
    var urlregex = /^(https?|ftp):\/\/([a-zA-Z0-9.-]+(:[a-zA-Z0-9.&%$-]+)*@)*((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]?)(\.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}|([a-zA-Z0-9-]+\.)*[a-zA-Z0-9-]+\.(com|edu|gov|int|mil|net|org|biz|arpa|info|name|pro|aero|coop|museum|[a-zA-Z]{2}))(:[0-9]+)*(\/($|[a-zA-Z0-9.,?'\\+&%$#=~_-]+))*$/;
    return urlregex.test(textval);
}
Run Code Online (Sandbox Code Playgroud)

对于以下URL,这可以返回true:

http://stackoverflow.com/questions/1303872/url-validation-using-javascript
Run Code Online (Sandbox Code Playgroud)

要么:

http://regexlib.com/DisplayPatterns.aspx?cattabindex=1&categoryId=2
Run Code Online (Sandbox Code Playgroud)

  • [...&amp; ...]不会做你期望的.字符类不允许使用字符串. (7认同)
  • 为什么`RegExp`构造函数？文字在这里很好.为什么要将对象分配给变量？`function validateURL(textval){return /^(http...$/.test(textval)}`略短且更清晰. (2认同)

TLi*_*dig 15

我还写了一个基于rfc1738和rfc3986的URL验证功能来检查http和https网址.我尝试保持这种模块化,因此可以更好地维护并适应自己的要求.

一行中的RegExp显示在本文末尾.

RegExp接受带有一些国际域或IPv4号码的HTTP和HTTPS URL.目前还不支持IPv6.

window.isValidURL = (function() {// wrapped in self calling function to prevent global pollution

     //URL pattern based on rfc1738 and rfc3986
    var rg_pctEncoded = "%[0-9a-fA-F]{2}";
    var rg_protocol = "(http|https):\\/\\/";

    var rg_userinfo = "([a-zA-Z0-9$\\-_.+!*'(),;:&=]|" + rg_pctEncoded + ")+" + "@";

    var rg_decOctet = "(25[0-5]|2[0-4][0-9]|[0-1][0-9][0-9]|[1-9][0-9]|[0-9])"; // 0-255
    var rg_ipv4address = "(" + rg_decOctet + "(\\." + rg_decOctet + "){3}" + ")";
    var rg_hostname = "([a-zA-Z0-9\\-\\u00C0-\\u017F]+\\.)+([a-zA-Z]{2,})";
    var rg_port = "[0-9]+";

    var rg_hostport = "(" + rg_ipv4address + "|localhost|" + rg_hostname + ")(:" + rg_port + ")?";

    // chars sets
    // safe           = "$" | "-" | "_" | "." | "+"
    // extra          = "!" | "*" | "'" | "(" | ")" | ","
    // hsegment       = *[ alpha | digit | safe | extra | ";" | ":" | "@" | "&" | "=" | escape ]
    var rg_pchar = "a-zA-Z0-9$\\-_.+!*'(),;:@&=";
    var rg_segment = "([" + rg_pchar + "]|" + rg_pctEncoded + ")*";

    var rg_path = rg_segment + "(\\/" + rg_segment + ")*";
    var rg_query = "\\?" + "([" + rg_pchar + "/?]|" + rg_pctEncoded + ")*";
    var rg_fragment = "\\#" + "([" + rg_pchar + "/?]|" + rg_pctEncoded + ")*";

    var rgHttpUrl = new RegExp( 
        "^"
        + rg_protocol
        + "(" + rg_userinfo + ")?"
        + rg_hostport
        + "(\\/"
        + "(" + rg_path + ")?"
        + "(" + rg_query + ")?"
        + "(" + rg_fragment + ")?"
        + ")?"
        + "$"
    );

    // export public function
    return function (url) {
        if (rgHttpUrl.test(url)) {
            return true;
        } else {
            return false;
        }
    };
})();
Run Code Online (Sandbox Code Playgroud)

RegExp在一行:

var rg = /^(http|https):\/\/(([a-zA-Z0-9$\-_.+!*'(),;:&=]|%[0-9a-fA-F]{2})+@)?(((25[0-5]|2[0-4][0-9]|[0-1][0-9][0-9]|[1-9][0-9]|[0-9])(\.(25[0-5]|2[0-4][0-9]|[0-1][0-9][0-9]|[1-9][0-9]|[0-9])){3})|localhost|([a-zA-Z0-9\-\u00C0-\u017F]+\.)+([a-zA-Z]{2,}))(:[0-9]+)?(\/(([a-zA-Z0-9$\-_.+!*'(),;:@&=]|%[0-9a-fA-F]{2})*(\/([a-zA-Z0-9$\-_.+!*'(),;:@&=]|%[0-9a-fA-F]{2})*)*)?(\?([a-zA-Z0-9$\-_.+!*'(),;:@&=\/?]|%[0-9a-fA-F]{2})*)?(\#([a-zA-Z0-9$\-_.+!*'(),;:@&=\/?]|%[0-9a-fA-F]{2})*)?)?$/;
Run Code Online (Sandbox Code Playgroud)

  • 这很棒!非常有帮助,你把它分解成不同的部分 - 我不想盲目相信一个庞大的正则表达式. (2认同)

Ale*_*kka 12

在类似的情况下,我逃避了这个:

someUtils.validateURL = function(url) {
    var parser = document.createElement('a');
    try {
        parser.href = url;
        return !!parser.hostname;
    } catch (e) {
        return false;
    }
};
Run Code Online (Sandbox Code Playgroud)

也就是说,如果浏览器可以为你做这个发明轮子？但是,当然,这只能在浏览器中使用.

解析URL的各个部分正是浏览器如何解释它:

parser.protocol; // => "http:"
parser.hostname; // => "example.com"
parser.port;     // => "8080"
parser.pathname; // => "/path/"
parser.search;   // => "?search=test"
parser.hash;     // => "#hash"
parser.host;     // => "example.com:3000"
Run Code Online (Sandbox Code Playgroud)

使用这些可以根据要求改进验证功能.唯一的缺点是它将接受相对URL并使用当前页面服务器的主机和端口.但是您可以通过重新组装部件中的URL并将其全部传递给您的AJAX服务来使用它.

什么validateURL也不会接受无效的网址,例如http:\:8883将返回false,但是:1234是有效的,被解释为http://pagehost.example.com/:1234即作为相对路径.

UPDATE

此方法不再适用于Chrome和其他WebKit浏览器.即使URL无效,主机名也会填充一些值,例如取自base.它仍然有助于解析部分URL,但不允许验证URL.

可能更好的无自己解析器方法是使用var parsedURL = new URL(url)和捕获异常.请参阅例如URL API.所有主流浏览器和NodeJS都支持,虽然仍然标有实验性.

  • 这将为`<script> alert(); </ script>`返回TRUE (3认同)
  • @Subin 在现代浏览器中，此答案中的方法不再有效。感谢您关注它。实际上，无论您传递什么字符串，都会填充主机名。 (2认同)

ngu*_*yên 8

我从http://angularjs.org/找到的最好的正则表达式

var urlregex = /^(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?$/;

Rom*_*ain 6

我知道这是一个很老的问题,但由于它没有任何接受的答案,我建议你使用URI.js框架:https://github.com/medialize/URI.js

您可以使用它来检查使用try/catch块的格式错误的URI:

function isValidURL(url)
{
    try {
        (new URI(url));
        return true;
    }
    catch (e) {
        // Malformed URI
        return false;
    }
}
Run Code Online (Sandbox Code Playgroud)

当然,它会将"%@"视为格式良好的相对URI ...所以我建议您阅读URI.js API以执行更多检查,例如,如果您想确保用户输入格式良好您可以这样做的绝对URL:

function isValidURL(url)
{
    try {
        var uri = new URI(url);
        // URI has a scheme and a host
        return (!!uri.scheme() && !!uri.host());
    }
    catch (e) {
        // Malformed URI
        return false;
    }
}
Run Code Online (Sandbox Code Playgroud)

Cri*_*man 5

这对我有用：

function validateURL(value) {
    return /^(https?|ftp):\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?)(:\d*)?)(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(\#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i.test(value);
    }
Run Code Online (Sandbox Code Playgroud)

从那里只是调用函数来获得真或假的问题：

validateURL(urltovalidate);
Run Code Online (Sandbox Code Playgroud)

nic*_*ckf 1

如果您正在寻找更可靠的正则表达式，请查看 RegexLib。这是您可能感兴趣的页面：

http://regexlib.com/Search.aspx?k=url

至于当人仍在打字时显示的错误消息，将事件从 更改为keydown，blur然后只有当人移动到下一个元素时才会检查。

归档时间：

查看次数：

166249 次

最近记录：

8 年，11 月 前
检查JavaScript字符串是否为URL 222
符合W3C标准的URL的正则表达式？ 8
更多相关链接
相关归档
CoffeeScript中的函数 49
Javascript - 我从字符串创建了一个blob,如何将字符串取回？ 43
在jQuery中提取Ajax返回数据 42
在momentjs中两次(HH:MM:SS a)之间的小时差异 22
如何检查HTML元素是否被隐藏？ 21
如何在Symfony 2.5中拆分验证yaml文件？ 7
子域名是https网址安全的一部分吗？ 5
如何验证 cerberus 中的嵌套对象？ 4
如何验证Node.js和Express中应该相等的两个字段？ 3
Rails中的简单自定义模型验证 2
难疑归档
如何使用JavaScript复制到剪贴板？ 3131
PHP'foreach'如何实际工作？ 1926
在UITableView中使用自动布局来获取动态单元格布局和可变行高 1477
何时使用虚拟析构函数？ 1420
如何在Python中打印到stderr？ 1246
为什么我们需要C++中的虚函数？ 1223
如何在同一元素上组合背景图像和CSS3渐变？ 1203
更改列:null为非null 1177
UTF-8一路走来 1146
如何在JavaScript中创建二维数组？ 1081