JavaScript 实现字符串与十六进制表示的相互转换

温以宁

发布时间：2026-10-13| 5人浏览过

原创

通过 JavaScript 脚本实现普通文本字符串到十六进制格式字符串（如 SQL 语句中的 0x68656c6c6f）的双向转换。该功能适用于 Web 开发及安全测试场景，重点解决了字符编码映射与非法长度校验问题。

核心应用场景

在进行网络安全测试（如 SQL 注入或 XSS 验证）时，经常会遇到数据库将数据以十六进制存储的情况。例如在 MySQL 中执行以下查询：

SELECT CONCAT(0x68656c6c6f);

其结果会还原为 "hello"。为了自动化处理此类场景或在本地调试相关 Payload，编写一个能在字符串与十六进制表示之间互转的工具是必要的。

实现原理

转换逻辑分为两个方向：

字符串转 Hex：遍历输入字符串的每个字符，获取其 ASCII/Unicode 码位（charCodeAt），将其转换为 16 进制数值并拼接。
Hex 转字符串：接收十六进制字符串，首先清洗掉可能的 0x 前缀，随后按每两个字符一组进行切割（每组代表一个字节/字符）。若总长度为奇数则视为非法格式。最后通过 parseInt(str, 16) 解析每组数值，并使用 String.fromCharCode() 还原为字符。

完整交互代码实现

下面提供一个带有简单 HTML 界面的完整 HTML 文件代码。您可以直接保存为 .html 文件在浏览器中运行。代码使用了 jQuery 简化 DOM 操作，也展示了核心的算法函数。

<!DOCTYPE html>
<html>
 <head>
  <title>Hex-Char Bi-Converter</title>
 </head>
 <body>
  <div class="mainContainer">
   <label for="from" id="fromLabel">String</label>
   <input type="text" name="from" id="from" />
   <input type="button" name="exchange" id="exchange" value="&lt;=&gt;" />
   <label for="to" id="toLabel">Hex</label>
   <input type="text" name="to" id="to" />
   <input type="button" name="convert" id="convert" value="Convert" />
  </div>
  <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
  <script type="text/javascript">
   var curMode = 0; // curMode: 0 represents String to Hex, 1 from Hex to String
   var fromToLabelArray = ["Hex", "String"];
   $(function() {
    $("#convert").click(function() {
     var fromVal = $("#from").val();
     var toVal = 
      curMode === 0 
      ? 
      strToHexCharCode(fromVal) 
      :
      hexCharCodeToStr(fromVal);
     $("#to").val(toVal);
    });
    $("#exchange").click(function() {
     $("#fromLabel").text(fromToLabelArray[curMode]);
     $("#toLabel").text(fromToLabelArray[1-curMode]);
     curMode = 1 - curMode;
    });
   });
   function strToHexCharCode(str) {
    if(str === "")
     return "";
    var hexCharCode = [];
    hexCharCode.push("0x");    
    for(var i = 0; i < str.length; i++) {
     hexCharCode.push((str.charCodeAt(i)).toString(16));
    }
    return hexCharCode.join("");
   }
   function hexCharCodeToStr(hexCharCodeStr) {
    var trimedStr = hexCharCodeStr.trim();
    var rawStr = 
      trimedStr.substr(0,2).toLowerCase() === "0x"
      ? 
      trimedStr.substr(2) 
      : 
      trimedStr;
    var len = rawStr.length;
    if(len % 2 !== 0) {
     alert("Illegal Format ASCII Code!");
        return "";
    }
    var curCharCode;
    var resultStr = [];
    for(var i = 0; i < len;i = i + 2) {
     curCharCode = parseInt(rawStr.substr(i, 2), 16); // ASCII Code Value
     resultStr.push(String.fromCharCode(curCharCode));
    }
    return resultStr.join("");
   }
  </script>
 </body>
</html>