vue 3.0校验IP地址

Vue.js 3.4.21

-

 

正文

输入框输入 IP地址，检查输入是否为 IP地址——IPv4，IPv6。

 

函数

Functions.js 中定义以下函数：

/**
 * 验证IP地址是否合法
 * @param {string} ip 待验证的IP地址
 * @returns 4-IPv4、6-IPv6、0-不是IP地址
 */
export function validateIPAddr(ip) {
    if (isIPv4(ip)) {
        return 4;
      } else if (isIPv6(ip)) {
        return 6;
      } else {
        return 0;
      }
}

/**
 * 是否为 IPv4 地址
 * @param {string} ip 待验证的IP地址
 * @returns true-是
 */
const isIPv4 = (ip) => {
    const ipv4Regex = /^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;
    return ipv4Regex.test(ip);
};

/**
 * 是否为 IPv6 地址
 * @param {string} ip 待验证的IP地址
 * @returns true-是
 */
const isIPv6 = (ip) => {
    const ipv6Regex = /^([\da-fA-F]{1,4}:){7}[\da-fA-F]{1,4}$/;
    return ipv6Regex.test(ip);
};

 

正则表达式

IPv4正则表达式：

^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$

说明：

• 每个部分匹配0-255之间的数字。
• 使用点.分隔每个部分。

示例，255.255.255.255。

 

IPv6正则表达式：

^([\da-fA-F]{1,4}:){7}[\da-fA-F]{1,4}$

说明：

• 每个部分匹配1到4个十六进制数字。
• 使用冒号:分隔每个部分。

格式：X:X:X:X:X:X:X:X。

示例，ABCD:EF01:2345:6789:ABCD:EF01:2345:6789。

这种表示法中，每个X的前导0是可以省略的，例如：

2001:0DB8:0000:0023:0008:0800:200C:417A→ 2001:DB8:0:23:8:800:200C:417A。

注意，参考资料#1 中 有关于 IPv6 的更多信息。

 

使用

使用时，导入 validateIPAddr 函数即可。ben发布于博客园

<script setup>
import { validateIPAddr } from '@/const/Functions.js'
</script>

 

代码：

function textValidateIPAddr() {
    let ipv4 = "255.255.255.255"
    console.log("ip=" + ipv4 + ", result=" + validateIPAddr(ipv4))
    ipv4 = "192.168.0.0"
    console.log("ip=" + ipv4 + ", result=" + validateIPAddr(ipv4))
    let ipv6 = "ABCD:EF01:2345:6789:ABCD:EF01:2345:6789"
    console.log("ip=" + ipv6 + ", result=" + validateIPAddr(ipv6))
    ipv6 = "2001:DB8:0:23:8:800:200C:417A"
    console.log("ip=" + ipv6 + ", result=" + validateIPAddr(ipv6))

    let iperr = ""
    console.log("ip=" + iperr + ", result=" + validateIPAddr(iperr))
    iperr = "23423424"
    console.log("ip=" + iperr + ", result=" + validateIPAddr(iperr))
}

结果：

ip=255.255.255.255, result=4
ip=192.168.0.0, result=4
ip=ABCD:EF01:2345:6789:ABCD:EF01:2345:6789, result=6
ip=2001:DB8:0:23:8:800:200C:417A, result=6
ip=, result=0
ip=23423424, result=0 

校验通过。

 

---END---

 

参考资料

1、IPv6 地址数量有多少，能够分配到地球上的每一粒尘埃吗

https://www.cnblogs.com/ithomer/p/9246121.html

posted @ 2018-06-30 09:21  new_2050

2、

 

ben发布于博客园

ben发布于博客园