Node.js读取MySQL数据：<% %>模板语法未被识别求助

你看到的<% %>和<%= %>是模板引擎的语法，不是原生HTML或JavaScript，直接打开HTML文件浏览器会把它当成普通文本显示，必须通过Node.js配合模板引擎来解析渲染。下面是具体的解决步骤：

1. 安装模板引擎 #

你的代码语法和EJS（Embedded JavaScript）完全匹配，先安装它：

npm install ejs

2. 在Node.js项目中配置模板引擎 #

如果你用Express框架（教程里大概率用的这个），在主入口文件（比如app.js）里添加以下配置：

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

// 设置模板引擎为EJS
app.set('view engine', 'ejs');
// 指定模板文件存放目录（默认是项目根目录下的views文件夹，没有就新建一个）
app.set('views', './views');

3. 调整模板文件 #

把你的HTML代码保存为.ejs后缀的文件，放到views目录里（比如命名为user-list.ejs），同时修正原代码里的语法错误：

<table border="1">
  <tr>
    <th>S.N</th>
    <th>Full Name</th>
    <th>Email Address</th>
    <th>City</th>
    <th>Country</th>
    <th>Edit</th>
    <th>Delete</th>
  </tr>

  <% 
     if (userData.length != 0) {
       var i = 1;
       userData.forEach(function(data){
  %>
    <tr>
      <td><%= i %></td>
      <td><%= data.fullName %></td>
      <td><%= data.emailAddress %></td>
      <td><%= data.city %></td>
      <td><%= data.country %></td>
      <td><a href="/users/edit/<%= data.id %>">Edit</a></td>
      <td><a href="/users/delete/<%= data.id %>">Delete</a></td>
    </tr>
  <% i++; }); %>
  <% } else { %>
    <tr>
      <td colspan="7">No Data Found</td>
    </tr>
  <% } %>
</table>

（注：原代码里else { %>未被包裹在<% %>中，会触发语法错误，已修正）

4. 渲染模板并传递数据 #

在路由中先从MySQL查询到userData，再调用res.render渲染模板并传入数据：

// 假设已用mysql模块连接数据库
const mysql = require('mysql');
const connection = mysql.createConnection({
  host: 'localhost',
  user: '你的数据库用户名',
  password: '你的数据库密码',
  database: '你的数据库名'
});

app.get('/users', (req, res) => {
  // 查询用户数据
  connection.query('SELECT * FROM 你的表名', (error, results) => {
    if (error) throw error;
    // 渲染模板并传递查询结果
    res.render('user-list', { userData: results });
  });
});

// 启动服务
app.listen(3000, () => {
  console.log('服务运行在http://localhost:3000');
});

5. 访问页面 #

启动Node.js服务后，在浏览器访问http://localhost:3000/users，就能看到渲染好的用户数据表格，不会再显示<% %>代码。

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