Nodejs ejs输出带html标签的文本，怎么使得文本里的标签展现出来

Nodejs ejs输出带html标签的文本，怎么使得文本里的标签展现出来

ejs把带html标签的文本原样输出了，可以怎么设置使得输出标签

8 回复

当然可以。下面是关于如何在使用 Node.js 和 EJS 模板引擎时，使 HTML 标签正确显示的内容。

标题：

Node.js EJS 输出带 HTML 标签的文本，怎么使得文本里的标签展现出来

内容：

在使用 EJS 模板引擎时，如果你尝试输出包含 HTML 标签的字符串，EJS 默认会对其进行转义处理，以防止 XSS（跨站脚本攻击）。因此，HTML 标签会被当作普通文本显示，而不是作为 HTML 元素解析。

为了使 HTML 标签正常显示，你需要告诉 EJS 不要对这些内容进行转义。可以通过以下几种方式实现：

示例代码：

假设你有一个变量 content 包含 HTML 内容，你想在 EJS 模板中正确地显示它。

1. 使用 <%- 语法

EJS 提供了一种语法来禁止转义，那就是使用 <%- 而不是默认的 <%=。

<%- content %>

例如，在你的 EJS 文件中：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Display HTML Content</title>
</head>
<body>
    <%- content %>
</body>
</html>

2. 在 Node.js 中传递数据

确保你在 Node.js 端正确地将包含 HTML 的内容传递给 EJS 模板。

const express = require('express');
const app = express();
app.set('view engine', 'ejs');

app.get('/', (req, res) => {
    const content = '<strong>Hello World!</strong>';
    res.render('index', { content });
});

app.listen(3000, () => {
    console.log('Server is running on port 3000');
});

在这个例子中，content 变量包含了一个 HTML 强化标签 <strong>，当渲染模板时，使用 <%- 语法来确保这个标签被正确解析为 HTML。

通过这种方式，你可以确保 HTML 标签在 EJS 模板中正确显示。但请注意，这样做存在潜在的安全风险，特别是当你从用户输入获取内容时。务必确保内容已经过适当的验证和清理，以防止 XSS 攻击。


<input type=hidden value=<%=your html%>>

<script> 从以藏文本中拿出在写到别的里面 </script>

ps：我就是这么做的，很恼人，不知道还有没有别的方法没

mongo中得编码，要不报错

谢谢啊，靠谱啊

<%-your html%> 不转义 <%=your html%> 转义

mark

也靠谱，谢谢 再问一句，ejs的api的地址哪有有啊，找了好久都找不到，所以一直都是用最基础的

在使用 EJS 渲染模板时，默认情况下会自动转义 HTML 字符以防止 XSS 攻击。因此，直接输出包含 HTML 标签的字符串会被转义成纯文本显示。为了在 EJS 中显示原始的 HTML 内容，需要关闭这个转义功能。

示例代码

假设你有一个变量 content 包含 HTML 内容，例如：

// server.js
const express = require('express');
const app = express();
app.set('view engine', 'ejs');

app.get('/', (req, res) => {
    const content = '<h1>Hello, World!</h1>';
    res.render('index', { content });
});

app.listen(3000, () => {
    console.log('Server is running on port 3000');
});

在你的 EJS 模板文件（例如 views/index.ejs）中，你可以通过 <%- 语法来输出不被转义的 HTML 内容：

<!-- views/index.ejs -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>EJS Example</title>
</head>
<body>
    <%- content %>
</body>
</html>

在这个例子中，<%- 语法确保了 content 变量中的 HTML 标签能够正确地被解析并显示为 HTML 内容，而不是纯文本。

解释

  • <%- 是 EJS 的一个特殊标记，用于输出不转义的 HTML 内容。
  • 如果使用 <%= content %>，则会将 content 中的 HTML 转义后输出，导致 <h1> 等标签被当作普通文本显示。

通过这种方式，你可以灵活地控制哪些部分的 HTML 内容需要被渲染为实际的 HTML 元素。

回到顶部