如何使用正则表达式验证javascript中的URL

Question

我想验证一个文本框,它有一些url值,如博客地址或网站地址如何在js中验证此文本框

Answer 1

我假设,您知道如何<input>使用JavaScript 获得价值.所以你的问题是编写用于验证URL的特定功能.

首先,我们可以考虑检查URL在语法上是否正确.

一些例子,我们的URL验证器应该一定考虑好:

http://www.example.com.
http://www.google.ee/search?q=foo&sourceid=opera&ie=utf-8&oe=utf-8
https://ama-z-on.co.uk/index.html?a=hei%20hoo
ftp://ftp.linux.ee/public/gentoo/i386/portage-snapshot.tar.bz
http://he.wikipedia.org/wiki/????????#.D7.A8.D7.90.D7.95_.D7.92.D7.9D
sftp://123.1.255.128:80/pub

而这只是URL的真实种类中的一小部分.HTTP和FTP并不是URL唯一可能的协议.哦,伙计,URL验证真的很难.

但是我们假设一个有效的URL应该以一些字母开头,然后是"://",之后就是这样.要测试这种模式,您可以使用JavaScript中的正则表达式:

function validateUrl(url) {
  return /^[a-z]+:\/\//i.test(url);
}

正则表达式是一个很大的主题,你应该考虑自己学习,但这里只是一个简短的解释:

• / - 开始正则表达式
• ^ - 匹配字符串的开头
• [a-z] - 匹配a,b,c,...,x,y或z.
• + - 表示先前的模式可以重复一次或多次.
• : - 匹配冒号符号本身.
• \/- 匹配forward-slash /(没有反斜杠JavaScript会认为它是正则表达式的结尾).
• / - 结束正则表达式.
• i - 这是一个修饰符,使这个正则表达式不区分大小写.
• .test(url)- test使用正则表达式对象的方法url作为参数调用.当参数的正则表达式匹配,则返回true不然false.

此外,您可能希望允许输入不带该http://部分的URL - 这意味着您确实需要验证域名或IP地址或其后的任何内容.

我猜你现在很困惑,那是故意的.你真的不应该自己编写JavaScript来进行URL验证,要想做到这一点太难了.相反,你应该使用一个库函数,经许多专家测试和确认是正确的.

也许你正在使用的JavaScript fraimwork已经有了一个很好的工具来完成这项工作.在那种情况下使用它.不幸的是,我不能特别建议任何特定的URL验证库.

另外,您可能需要考虑像Josh Stodola建议的那样ping URL,以检查它是否真的存在.虽然,Josh建议的特殊方式,如果URL引用的资源是10GB文件,可能会有问题:)

Answer 2

进行基本的正则表达式格式化测试。然后使用XMLHttpRequest ping URL以确保它存在。使用 jQuery 的示例...

var url = $("#txtUserWebSite").val();
var reg = /^(([\w]+:)?\/\/)?(([\d\w]|%[a-fA-f\d]{2,2})+(:([\d\w]|%[a-fA-f\d]{2,2})+)?@)?([\d\w][-\d\w]{0,253}[\d\w]\.)+[\w]{2,4}(:[\d]+)?(\/([,-+_~.\d\w]|%[a-fA-f\d]{2,2})*)*(\?(&?([,-+_~.\d\w]|%[a-fA-f\d]{2,2})=?)*)?(#([,-+_~.\d\w]|%[a-fA-f\d]{2,2})*)?$/; 

if(!reg.test(url)) {
  alert("Invalid URL!");
  return false;
}

$.get(url, function(dat, stat) {
  if(stat == "success")
    alert("Valid URL!");
  else
    alert("Invalid URL!");
})