JS字符串拼接乱码求助：含%与特定前缀字符串拼接异常

问题分析 #

你遇到的乱码问题（输出中�rt替代了预期的fan），大概率是字符编码冲突或者输入值存在隐藏的不可见字符/编码异常导致的。另外，直接拼接用户输入构建SQL语句的做法存在严重的安全隐患（SQL注入），这部分也需要重点修正。

排查与解决步骤 #

1. 确认输入值的真实内容
   不要默认abc就是"fan"，先通过控制台打印验证输入的实际内容：

var abc = document.getElementById("myInput").value.trim();
console.log("实际输入值：", abc);
console.log("编码后的值：", encodeURIComponent(abc));

如果编码后的值不是fan，说明输入框里的内容可能有隐藏控制字符，或者页面编码未设置为UTF-8——需要确保页面头部添加<meta charset="UTF-8">来统一编码。

2. 修正字符串拼接方式
   用ES6模板字符串替代传统的+拼接，可读性更强，也能减少拼接错误：

var abc = document.getElementById("myInput").value.trim();
var $value = `WHERE Product_ID LIKE '%${abc} %' 
              OR Product_Name LIKE '%${abc}%' 
              OR Description LIKE '%${abc}%' 
              OR MRP LIKE '%${abc}%' 
              OR Net_Amount LIKE '%${abc}%' 
              OR Category LIKE '%${abc}%' 
              OR Tags LIKE '%${abc}%'`;
console.log("拼接结果：", $value);

注意：SQL中LIKE的%是通配符，不需要转义成\%，转义反而会导致SQL解析错误。

3. 紧急修复SQL注入风险
   直接把用户输入拼接到SQL语句中是高危操作，攻击者可以通过输入恶意字符串篡改SQL逻辑。必须改用参数化查询：

• 以Node.js（mysql2库）为例的后端代码示例：

const sql = `WHERE Product_ID LIKE ? 
             OR Product_Name LIKE ? 
             OR Description LIKE ? 
             OR MRP LIKE ? 
             OR Net_Amount LIKE ? 
             OR Category LIKE ? 
             OR Tags LIKE ?`;
const params = [`%${abc} %`, `%${abc}%`, `%${abc}%`, `%${abc}%`, `%${abc}%`, `%${abc}%`, `%${abc}%`];
connection.query(sql, params, (err, results) => { /* 处理查询结果 */ });

其他后端语言（Java、PHP等）也都有对应的参数化查询API，务必用这种方式替代字符串拼接。

总结 #

先通过控制台确认输入值的真实内容，确保页面编码为UTF-8；然后改用模板字符串提升拼接可靠性；最后一定要替换成参数化查询避免SQL注入。

内容的提问来源于stack exchange，提问作者Darsh Thakkar