模板文字中的 JavaScript 换行编码答案

【问题标题】：JavaScript line break encoding in template literals模板文字中的 JavaScript 换行编码
【发布时间】：2021-05-27 00:58:44
【问题描述】：

在模板文字中，换行符可以用\n 或字符串中的文字换行符来表示。根据文档和从打印到控制台，这两种方法没有区别。

但是，在使用 Axios 时，我在 POST 的数据字段中发送了一个带有 \n 的字符串。服务器错误地解释了这个请求并合并了字符串中的行。当我用字符串中的文字换行符更改所有\n 字符时，服务器按预期解释了请求。这里发生了什么？两种方式的编码方式有区别吗？

// this works
    await axios.post(`${myURL}/`, {
            password: `${username}@${server}
            ${password}`
        });

// this doesn't work
    await axios.post(`${myURL}/`, {
            password: `${username}@${server}\n${password}`
        });

【问题讨论】：

使用浏览器的开发工具 Network 面板检查每个请求的负载和响应。有什么区别？

标签： javascript encoding axios line-breaks template-literals

【解决方案1】：

这两种方式的编码方式有区别吗？

是的，您的第一个代码还包括服务器和密码之间的许多非换行符：

            ${password}`
^^^^^^^^^^^^

要使它们相同，请在\n 之后添加空格，例如：

await axios.post(`${myURL}/`, {
        password: `${username}@${server}\n             ${password}`
    });

（您可能只需要在 \n 之后再添加一个空格即可正确解析它 - 尝试一下）

【讨论】：

我认为情况并非如此。当我只是使用字符串文字输入字符串并且没有额外的空格时，我能够得到正确的结果。例如，密码：“myUsername@theServer\nThePassword”。仅当在模板文字中包含 \n 时才特别看到差异。即，我可以使用与“myUsername@theServer\nThePassword”完全相同的字符串，只需将引号替换为反引号即可获得模板文字并查看不同的结果。
@dz210 然后比较你的字符串。 console.log("myUsername@theServer\nThePassword" === `${username}@${server}\n${password}`) 产生了什么？
@dz210 除了这些空格，您的字符串是相同的。其他可能导致问题的原因，可能是服务器错误？检查请求和响应的负载
@Phil 返回真。这就是为什么这让我如此困惑。
所以我在代码编辑器而不是浏览器中尝试了这个，这个答案是正确的。将代码粘贴到浏览器控制台不会添加任何空格，但在我的编辑器 (VSCode) 中会这样做。