EJS能否与现有HTML页面配合使用并传递变量？

方案1：将HTML文件改为EJS后缀（最推荐） #

EJS完全兼容纯HTML代码，你不需要修改原HTML的任何内容，只需要把mypage.html改名为mypage.ejs，然后直接用EJS的render方法传递变量：

response.render("mypage", { name: "bob" });

原HTML页面如果需要使用变量，直接像EJS页面那样加<%= locals?.name %>即可，无需额外配置。

方案2：让Express用EJS引擎解析HTML文件 #

如果不想修改文件名，可以在Express的配置中添加如下代码，让.html后缀的文件也用EJS引擎来渲染：

const express = require('express');
const app = express();

// 配置HTML文件使用EJS引擎解析
app.engine('html', require('ejs').renderFile);
app.set('view engine', 'html');

// 之后就可以直接render HTML文件并传参
app.get('/mypage', (req, res) => {
  res.render('mypage.html', { name: "bob" });
});

这种方式保留了原HTML文件名，同时能享受到EJS传参的便利，原HTML页面同样可以直接嵌入EJS变量语法。

方案3：通过URL参数/ Cookie传递（适合不修改HTML的场景） #

如果完全不想改动HTML文件本身，可以在跳转时通过URL参数传递变量，前端用JavaScript读取并渲染：

后端代码 #

response.redirect(`mypage.html?name=bob`);

前端HTML中添加JS代码 #

<script>
// 读取URL参数
const urlParams = new URLSearchParams(window.location.search);
const name = urlParams.get('name');
// 将变量插入页面
document.querySelector('#name-container').textContent = name;
</script>

注意：这种方式仅适合简单、非敏感的数据，且需要前端额外编写JS逻辑，维护性不如前两种方案。

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