Hex0r+ - 前端 Hex Viewer

最近在写一个浅谈 SSH 协议的系列文字,需要在网页上以十六进制方式展示一些传输数据,搜了一下前人工作,找到一个最接近我的需求的项目,在此基础上做了一下修改,命名为 Hex0r+。

项目地址:https://github.com/ihainan/Hex0r-Plus

效果

可以把 ASCII 文字作为输入:

或者是 Base64 编码后的二进制数据:

支持高亮任意范围的数据,可以自定义颜色和提示文本:

支持设置成鼠标指针进到特定范围之后才高亮该区域:

改进

在原来的项目上做了一些改进:

  • 修复自定义颜色完全不生效的问题。
  • 修复右侧 ASCII 文本与左侧十六进制对不上的问题。
  • 支持右侧 ASCII 文本和左侧十六进制同步高亮。
  • 支持设置成鼠标指针进入区域后才高亮。
  • 高亮列表中,提示文本支持使用 ,:,但是需要进行转义 \,\:
  • 添加默认值。

用法

参数解释参见:https://github.com/ihainan/Hex0r-Plus#options

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<html>

<head>
<title>Hex0r Examples</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="hex0r.min.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="hex0r.min.css" />
</head>

<body>
<div class="hex0rwindow" data-row-width="16" data-word-size="1" data-row-break="8" data-trim="true"
data-base64="true" data-caption="SSH Protocol - Client's Algorithm List" data-highlight-on-hover-only="true"
data-highlights="
0:3:#F4FA58: Packet Length (= 196) // 4 bytes,
4:4:#F4FA58: Padding Length (= 6) // 1 byte,
5:5:#F4FA58: SSH_MSG_KEXINIT // 1 byte,
6:21:#F4FA58: Cookie // 16,
22:94:#F4FA58: kex_algorithms // 4 + 69 bytes,
95:110:#F4FA58: server_host_key_algorithms // 4 + 12 bytes,
111:124:#F4FA58: encryption_algorithms_client_to_server // 4 + 10 bytes,
125:138:#F4FA58: encryption_algorithms_server_to_client // 4 + 10 bytes,
139:151:#F4FA58: mac_algorithms_client_to_server // 4 + 9 bytes,
152:164:#F4FA58: mac_algorithms_server_to_client // 4 + 9 bytes,
165:172:#F4FA58: compression_algorithms_client_to_server // 4 + 4 bytes,
173:180:#F4FA58: compression_algorithms_server_to_client // 4 + 4 bytes,
181:184:#F4FA58: languages_client_to_server // 4 + 0 bytes,
185:188:#F4FA58: languages_client_to_server // 4 + 0 bytes,
189:189:#F4FA58: first_kex_packet_follows // 1 byte,
190:193:#F4FA58: 0 (int\,reserved for future extension) // 4 bytes,
194:199:#F4FA58: Padding // 6 bytes" data-show-line-nums="true"
title="SSH Protocol - Client's Algorithm List">
AAAAxAYUbzQ63GkVhEqdhC02TJzuywAAAEVkaWZmaWUtaGVsbG1hbi1ncm91cDE0LXNoYTI1NixleHQtaW5mby1jLGtleC1zdHJpY3QtYy12MDBAb3BlbnNzaC5jb20AAAAMcnNhLXNoYTItNTEyAAAACmFlczI1Ni1jdHIAAAAKYWVzMjU2LWN0cgAAAAlobWFjLXNoYTEAAAAJaG1hYy1zaGExAAAABG5vbmUAAAAEbm9uZQAAAAAAAAAAAAAAAAAAAAAAAAA=
</div>
</body>

</html>