JavaScript 怎么验证 URL?

首页>>网站学院>>JavaScript

999+

image.png

前言

当开发者需求为不同目的以不同方法处理URL时,比方说浏览器历史导航,锚点目标,查询参数等等,咱们经常会借助于JavaScript。但是,它的频繁运用促进攻击者运用其缝隙。这种被运用的风险是咱们有必要在咱们的JavaScript应用程序中实现URL验证的原因。

 

URL验证查看URL是否遵循正确的URL语法,也就是每个URL有必要具有的结构。URL验证能够使咱们的应用程序免遭基于URL的缝隙,比方歹意脚本注入和服务器端请求假造(SSRF)。当咱们在获取远程资源时没有应用安全编码常规来验证用户提供的URL时,歹意行为者能够选用SSRF攻击。

 

URL验证

URL验证的存在是为了加强安全,避免可能存在的缝隙,并消除运转代码时发生的任何过错的机会。但是咱们应该在什么时候运用URL验证,在这个过程中咱们要验证什么呢?咱们应该在一切有必要辨认和验证诸如网页、图片、gif和视频等资源的软件中施行URL验证。

 

一个典型的URL包括多个片段,比方协议、域名、主机名、资源名、URL源、端口等等。这些用来告诉浏览器怎么追踪指定的资源。咱们能够以不同的方法来验证URL:

 

运用正则字面量和结构函数

URL结构函数

isValidURL方法

Input元素

Anchor标签方法

一个典型的URL验证计划接收来自用户的输入,然后对其进行解析,以辨认其各个组成部分。验证计划能够保证一切的URL组件契合互联网标准。例如,如果需求,它能够查看URL是否运用安全协议。

 

主机名验证首先是将主机名分成独立的标签,以保证它们契合顶级域名标准。一个典型的主机名由至少两个用点分隔的标签组成。例如,www.snyk.com 有 "www"、"snyk"和 "com"的标签。每个标签只能由一个字母数字字符或一个连字符组成,无论大小写。然后,验证计划能够保证主机名与URL的答应列表相匹配,以保证只答应指定的URL,而且答应的URL不会被过错地取消资格。

 

默许情况下,URL中运用的大多数资源的途径都是答应的。但是,端口只能在1到65536的范围内。任何超出这个范围的东西都应该抛出一个过错。咱们还能够查看数字IP地址,以判断它是一个IPV4地址还是IPV6地址。

 

最终,咱们也能够查看URL的用户名和暗码。这个功能有助于遵守公司政策和凭据保护。

 

现在,你已经有了这些基础知识,让咱们来看看运用javascript的URL验证吧。

 

怎么执行URL验证

在JavaScript中,执行URL验证最简略的方法是运用new URL结构函数。除此之外,它还得到了Node.js运转时和大多数浏览器的支撑。

 

根本语法如下:

new URL (url)
new URL (url , base)

如果提供相对URL,JavaScript只需要base元素。如果不提供相对URL,默认为undefined。另外,如果提供一个具有绝对URL的base元素,JavaScript会忽略base元素。

为了验证URL,可以使用以下代码:

function checkUrl (string) {  let givenURL ;  try {
      givenURL = new URL (string);
  } catch (error) {      console.log ("error is", error);     return false; 
  }  return true;
}

该函数用于查看URL的有用性。当URL有用时回来true,不然回来false。

 

假如你传递www.urlcheck.com给该函数会回来false。因为该参数并不是一个有用的URL。正确版本应该是https://urlcheck.com。

另一个比如是mailto:John.Doe@example.com。这是一个有用的URL,但假如移除了冒号,JavaScript就不再认为它是一个URL了。

第三个比如是ftp://。这不是一个有用URL,因为没有包括主机名。假如你添加两个点(..),就会变成有用URL。因为点会被认为是一个主机名,也就是说ftp://..变成了一个有用的URL。

重要的是要记住,非常规的、但彻底有用的URL是存在的!它们可能对从事这些工作的开发人员来说是意外的,但在其他方面是彻底适宜的。例如,以下两个URL都会回来真值:

 

new URL("youtube://a.b.c.d");

new URL("a://1.2.3.4@1.2.3.4");

这些比如提醒咱们,开发者应该依托URL验证准则,而不是专心于惯例。

 

假如你想确保有用的URL包括一些特定的URL方案,你可以使用以下函数:

function checkHttpUrl(string) {  let givenURL;  try {
      givenURL = new URL(string);
  } catch (error) {      console.log("error is",error)    return false;  
  }  return givenURL.protocol === "http:" || givenURL.protocol === "https:";
}

该函数验证URL,然后检查URL是否使用HTTP或者HTTPS。在这里,ftp://..会被认为是无效的,因为它不包含HTTP或者HTTPS,而http://..依旧有效。

使用URL构造函数的一些其他方式包括:

let m = '<https://snyk.io>';let a = new URL("/", m);

上述示例使用了base元素。记录下这个值,我们就可以得到https://snyk.io/。

要返回一个URL对象而不指定base参数的话,语法是:

let b = new URL(m);

为了给主机添加一个路径名,我们的代码结构如下:

let d = new URL('/en-US/docs', b);

存储在变量d上的URL是https://snyk.io/en-US/docs。

URL模块的另一个功能是,它实现了WHATWG URL api,它遵守WHATWG的URL标准,供浏览器使用:

let adr = new URL("<https://snyk.io/en-US/docs>");let host = adr.host;let path = adr.pathname;

在上面的例子中,我们创建了一个名为adr的URL对象。接着,代码获取URL的主机和路径名,分别是snyk.io和/en-US/docs。最后,我们可以将URL和允许列表或者黑名单进行对比,确保只有特定URL是被允许的。

如何使用正则验证

另一种验证URL的方法是使用正则表达式(regex)。我们可以使用Regex来检查URL是否有效。

使用regex进行URL验证的JavaScript语法是:

function isValidURL(string) 
  {      var res = 
      string.match(/(https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9][a-zA-Z0-9-
      ]+[a-zA-Z0-9]\.[^\s]{2,}|www\.[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]
      \.[^\s]{2,}|https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9]+\.[^\s]{2,}|w
      ww\.[a-zA-Z0-9]+\.[^\s]{2,})/gi);          return (res !== null);
  };

来测试一些URL:

var tc1 = "<http://helloworld.com>"console.log(isValidURL(tc1));

regex定义的URL语法检查URL是否以http://或https://或子域开始,以及是否包含域名。控制台上的语句结果是true,因为它遵循了由regex定义的URL语法。相反,下面的语句将返回一个false,因为它没有以任何允许的方案或子域开始,也不包含域名:

var tc4 = "helloWorld";console.log (isValidURL(tc4));

上面的正则表达式相对简略,但仍然难以驾驭。这也是一个简单犯错的办法,因为一个正则表达式不能充分处理验证URL的规矩。它最多只能做到匹配有效的URL。此外,当一个正则表达式要么包括复杂的验证逻辑,要么收到冗长的输入字符串时,履行验证查看就变得很耗时。

 

为了满足界说的正则表达式验证查看,浏览器必须在输入字符串中进行数以百万计的回溯。如此多的回溯查看可能会导致"灾难性的回溯",这种现象是复杂的正则表达式会冻住浏览器或使CPU中心进程爆满。

 

安全运用JavaScript

正如SSRF被添加到新的OWASP Top 10中所证明的那样,URL验证关于JavaScript应用程序的安全性现已变得越来越关键。幸运的是,咱们能够经过在服务器端验证URL来协助缓解此类进犯。此外,根据验证和处理URL的首选方式来运用new URL函数会非常有益。

 

在看到new URL函数的一些运用事例后,咱们学习了如何用正则表达式验证一个URL--并看到了为什么这种办法很费事而且简单犯错。

 

URL的安全风险与其说是关于其有效性,不如说是关于危险的URL计划。因而,咱们需要确保让服务器端的应用程序进行验证。进犯者能够绕过客户端的验证机制,所以仅仅依靠它并不是解决办法。


发布留言:


留言信息(最新3条):

昵称:A****nda 时间:2023-04-13 10:23:34

留言:麻烦帮我改下模板代码咧 什么时候比较方便

昵称:WSS素材网 时间:2023-04-13 10:23:34

回复:请添加微信:Wisdom-boylin 或 添加QQ:584244711

昵称:炸****趴菜。 时间:2023-04-12 15:14:27

留言:兄弟 我需要个蜘蛛池啊 有没介绍看到加我

昵称:WSS素材网 时间:2023-04-12 15:14:27

回复:请添加微信:Wisdom-boylin 或 添加QQ:584244711

昵称:彩****的雨云 时间:2023-04-12 14:47:10

留言:我想咨询下你们做不做小旋风超级模板的 需要10套

昵称:WSS素材网 时间:2023-04-12 14:47:10

回复:请添加微信:Wisdom-boylin 或 添加QQ:584244711


版权声明:本文为「WSS素材网」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。  
原文链接:https://wsstp.com/JavaScript/64.html