使用 Javascript 编辑 IPv4 和 IPv6 地址
[英]Using Javascript to redact IPv4 and IPv6 Addresses
问题描述
Overview
概述
I'm building a website that has two textareas input and output我正在建立一个有两个文本input和output的网站
The concept is fairly straight-forward I want to:这个概念相当简单，我想：
- Parse the input using regex to match any IPv4/IPv6 addresses使用正则表达式解析输入以匹配任何 IPv4/IPv6 地址
- Redact them to [IPv4], [IPv6] using.replace or any other method使用.replace 或任何其他方法将它们编辑为 [IPv4]、[IPv6]
- Display the output in
output在output中显示output
I have it working perfectly for IPv4, I can paste in a huge block of text in and it redacts all IPv4 addresses as expected.我让它完美地适用于 IPv4，我可以粘贴一大块文本，它会按预期编辑所有 IPv4 地址。
The problem问题
The regex, or possibly the javascript replace function for IPv6 is not working correctly.正则表达式，或者可能是 javascript 替换 IPv6 的 function 无法正常工作。
HTML to recreate problem HTML 重现问题
<html>
<head>
</head>
<body>
<div>
<label for="input" class= "left">Input Text</label>
<label for="output" class = "right">Obfuscated Text - Click Text to Copy</label>
<span></span>
<textarea id="input"></textarea>
<textarea id="output"></textarea>
</div>
<br>
<button onclick="obfuscate()">Obfuscate</button>
<script>
function obfuscate() {
// Get the input and output textareas
var input = document.getElementById("input");
var output = document.getElementById("output");
// Obfuscate the text in the input textarea
var obfuscatedText = input.value.replace(/\b(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\b/g, "[IPv4]")
var lines = obfuscatedText.split('\n')
const modifiedLines = lines.map(line => line.replace(/\b(([0-9a-fA-F]{1,4}:){7,7}[0-9a-fA-F]{1,4}|([0-9a-fA-F]{1,4}:){1,7}:|([0-9a-fA-F]{1,4}:){1,6}:[0-9a-fA-F]{1,4}|([0-9a-fA-F]{1,4}:){1,5}(:[0-9a-fA-F]{1,4}){1,2}|([0-9a-fA-F]{1,4}:){1,4}(:[0-9a-fA-F]{1,4}){1,3}|([0-9a-fA-F]{1,4}:){1,3}(:[0-9a-fA-F]{1,4}){1,4}|([0-9a-fA-F]{1,4}:){1,2}(:[0-9a-fA-F]{1,4}){1,5}|[0-9a-fA-F]{1,4}:((:[0-9a-fA-F]{1,4}){1,6})|:((:[0-9a-fA-F]{1,4}){1,7}|:)|fe80:(:[0-9a-fA-F]{0,4}){0,4}%[0-9a-zA-Z]{1,}|::(ffff(:0{1,4}){0,1}:){0,1}((25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9])\.){3,3}(25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9])|([0-9a-fA-F]{1,4}:){1,4}:((25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9])\.){3,3}(25[0-5]|(2[0-4]|1{0,1}[0-9]){0,1}[0-9]))\b/,"[IPv6]"));
// Set the value of the output textarea to the obfuscated text
output.value = modifiedLines.join('\n');
}
</script>
</body>
</html>
Notes笔记
Originally for [IPv6] nothing was redacted, I read online somewhere that replace can't handle very large strings.最初是为了 [IPv6] 没有任何内容被编辑，我在网上读到 replace 无法处理非常大的字符串。 So I broke it down into individual lines.所以我把它分解成单独的行。 This works better, but still doesn't replace all the matches.这样效果更好，但仍然不能替换所有匹配项。
Current Behavior当前行为
Given even a small input of即使是很小的input
subnet6 3ffe:501:ffff:100::/64 {
# Two addresses available to clients
# (the third client should get NoAddrsAvail)
range6 3ffe:501:ffff:100::10 3ffe:501:ffff:100::11;
# Use the whole /64 prefix for temporary addresses
# (i.e., direct application of RFC 4941)
range6 3ffe:501:ffff:100:: temporary;
# Some /64 prefixes available for Prefix Delegation (RFC 3633)
prefix6 3ffe:501:ffff:100:: 3ffe:501:ffff:111:: /64;
}
# A second subnet behind a relay agent
subnet6 3ffe:501:ffff:101::/64 {
range6 3ffe:501:ffff:101::10 3ffe:501:ffff:101::11;
# Override of the global definitions,
# works only when a resource (address or prefix) is assigned
option dhcp6.name-servers 3ffe:501:ffff:101:200:ff:fe00:3f3e;
}
It fails to redact all v6 addresses它无法编辑所有 v6 地址
Output: Output：
subnet6 3ffe:501:ffff:100::/64 {
# Two addresses available to clients
# (the third client should get NoAddrsAvail)
range6 [IPv6]10 3ffe:501:ffff:100::11;
# Use the whole /64 prefix for temporary addresses
# (i.e., direct application of RFC 4941)
range6 3ffe:501:ffff:100:: temporary;
# Some /64 prefixes available for Prefix Delegation (RFC 3633)
prefix6 3ffe:501:ffff:100:: 3ffe:501:ffff:111:: /64;
}
# A second subnet behind a relay agent
subnet6 3ffe:501:ffff:101::/64 {
range6 [IPv6]10 3ffe:501:ffff:101::11;
# Override of the global definitions,
# works only when a resource (address or prefix) is assigned
option dhcp6.name-servers [IPv6];
}
I suck at regex我很讨厌正则表达式
I borrowed the regex to match IPv6 from ihateregex.io site.我从ihateregex.io站点借用正则表达式来匹配 IPv6。
On their site when I test it with the same input sample from before, it matches all of the addresses perfectly so that's where I'm stuck.在他们的网站上，当我使用之前的相同输入样本对其进行测试时，它与所有地址完美匹配，所以这就是我被卡住的地方。
There are 2 similar questions on SO, one is using php and the other is using python. If possible I would like to do this all in javascript so the text remains client-side. SO 上有 2 个类似的问题，一个是使用 php，另一个是使用 python。如果可能的话，我想在 javascript 中全部完成，这样文本仍然是客户端。
1 个解决方案
解决方案1
2 已采纳 2023-01-31 19:17:12
I borrowed the regex to match IPv6 from ihateregex.io site.
...but you added \b to that regex. ...但是您在该正则表达式中添加了\b 。 For the \b at the start of the regex this is no problem, but for the end of the regex it is.对于正则表达式开头的\b来说，这没有问题，但对于正则表达式的结尾，它是。 The thing is that an IPv6 address may end with a colon.问题是 IPv6 地址可能以冒号结尾。 In that case \b will require that this final colon is followed by an alphanumerical.在这种情况下， \b将要求最后一个冒号后跟一个字母数字。 This is the reason why some IPv6 addresses in the text are not matched.这就是文中部分IPv6地址不匹配的原因。
So... remove that \b at the end of the regex.所以...删除正则表达式末尾的\b 。
Secondly, you need to provide the g modifier if you expect more than one match.其次，如果您希望匹配多个，则需要提供g修饰符。
And now it is not necessary to split the text into lines:现在没有必要将文本分成几行：
var input = document.getElementById("input"); var output = document.getElementById("output"); function obfuscate() { output.value = input.value.replace(/\b(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\b/g, "[IPv4]").replace(/\b(([\da-f]{1,4}:){7}[\da-f]{1,4}|([\da-f]{1,4}:){1,7}:|([\da-f]{1,4}:){1,6}:[\da-f]{1,4}|([\da-f]{1,4}:){1,5}(:[\da-f]{1,4}){1,2}|([\da-f]{1,4}:){1,4}(:[\da-f]{1,4}){1,3}|([\da-f]{1,4}:){1,3}(:[\da-f]{1,4}){1,4}|([\da-f]{1,4}:){1,2}(:[\da-f]{1,4}){1,5}|[\da-f]{1,4}:((:[\da-f]{1,4}){1,6})|:((:[\da-f]{1,4}){1,7}|:)|fe80:(:[\da-f]{0,4}){0,4}%[\da-z]+|(::(ffff(:0{1,4})?:)?|([\da-f]{1,4}:){1,4}:)((25[0-5]|(2[0-4]|1?\d)?\d)\.){3}(25[0-5]|(2[0-4]|1?\d)?\d))/g,"[IPv6]"); } input.value = `su.net6 3ffe:501:ffff:100::/64 { # Two addresses available to clients # (the third client should get NoAddrsAvail) range6 3ffe:501:ffff:100::10 3ffe:501:ffff:100::11; # Use the whole /64 prefix for temporary addresses # (ie, direct application of RFC 4941) range6 3ffe:501:ffff:100:: temporary; # Some /64 prefixes available for Prefix Delegation (RFC 3633) prefix6 3ffe:501:ffff:100:: 3ffe:501:ffff:111:: /64; } # A second su.net behind a relay agent su.net6 3ffe:501:ffff:101::/64 { range6 3ffe:501:ffff:101::10 3ffe:501:ffff:101::11; # Override of the global definitions, # works only when a resource (address or prefix) is assigned option dhcp6.name-servers 3ffe:501:ffff:101:200:ff:fe00:3f3e; }`; obfuscate();
table { border-collapse: collapse; margin: 10px 0 10px 0 } textarea { width: 45vw; height: 75vh }
<table> <tr><th>Input Text<button onclick="obfuscate()">Obfuscate</button></th><th>Obfuscated Text</th></tr> <tr><td><textarea id="input"></textarea></td><td><textarea id="output"></textarea></tr> </table>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.