如何避免Axios将"&"字符错误编码为":"字符？

问题根源 #

你代码里的name: "Of Mice & Men"是HTML环境下的转义写法，但JSON请求体不需要这种转义，直接传入会导致axios处理时出现异常编码，最终请求负载里的内容被错误拆分。

具体解决方案 #

1. 直接使用原始字符（最推荐）

如果你的目标数据是"Of Mice & Men"，直接在data里写原始字符即可，不需要用&转义：

const data = {
    name: "Of Mice & Men"
};

axios会自动将其正确序列化为JSON字符串，请求负载会是{"name":"Of Mice & Men"}。

2. 反转义已HTML转义的字符串

如果你的数据是从HTML场景（比如DOM元素属性、后端返回的HTML转义文本）获取的&格式字符串，需要先反转义再传给axios：
先写一个简单的反转义函数：

function unescapeHtml(str) {
    const tempElement = document.createElement('div');
    tempElement.innerHTML = str;
    return tempElement.textContent || tempElement.innerText;
}

然后修改数据处理逻辑：

const escapedName = "Of Mice & Men"; // 从外部获取的转义字符串
const data = {
    name: unescapeHtml(escapedName)
};

3. 检查axios拦截器配置

如果以上方法没用，检查项目中是否给axios添加了自定义请求拦截器，确认有没有对请求数据做多余的HTML转义或URL编码处理。比如误用encodeURIComponent处理整个JSON体，或者手动调用了HTML转义函数，这类操作会破坏原始数据的编码逻辑。

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