Express+EJS传参时引号被转义为"的优化方案咨询

问题根源 #

你遇到的引号被转义为"的问题，本质是EJS的<%= %>标签会自动转义HTML特殊字符（用于防范XSS攻击），但在<script>标签中传递JSON时，这种转义反而会导致JS解析异常。

最优解决方案 #

方案1：使用EJS非转义输出标签<%- %>

这是最直接高效的方案，<%- %>会直接输出原始内容，跳过HTML转义处理。

修改前端代码：

<script type="text/javascript">
    // 直接输出JSON字符串，无需额外包裹引号
    let data = <%- locals.data %>;
</script>

后端代码优化：
可以直接传递对象，在前端用JSON.stringify转换，减少后端处理步骤：

app.set('view engine', 'ejs');
app.set('views', path.join(__dirname, 'views'));

app.get("/", (req, res) => {
    let data = {test: "test"};
    // 直接传递对象，前端负责转成JSON
    res.render("home.ejs", {data});
})

对应的前端简化写法：

<script type="text/javascript">
    let data = <%- JSON.stringify(data) %>;
</script>

方案2：通过HTML data属性传递数据

如果需要将数据绑定到DOM元素上，可以用data属性传递，再通过JS读取解析：

HTML代码：

<!-- 用单引号包裹data属性值，避免和JSON中的双引号冲突 -->
<div id="app-data" data-info='<%= JSON.stringify(data) %>'></div>

<script type="text/javascript">
    // 读取data属性并解析为JS对象
    let data = JSON.parse(document.getElementById('app-data').dataset.info);
</script>

后端代码：

app.get("/", (req, res) => {
    let data = {test: "test"};
    res.render("home.ejs", {data});
})

不推荐的方案 #

不建议用replaceAll手动替换转义字符，这种方法不仅繁琐，还可能在复杂数据结构（比如嵌套引号、特殊字符）下出现遗漏或错误。

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