Egg.js 中如何正确返回 HTML 页面并渲染模板？

シ艳珂提问于 2026-03-17 03:20:20 阅读 22

前端

我在 Egg.js 里写了个 controller，想返回一个简单的 HTML 页面，但页面总是显示空白或者报错。我试过用 ctx.body 直接返回字符串，也试过用 view 模板，但都不对。

这是我的 HTML 代码：

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8" />
  <title>测试页面</title>
</head>
<body>
  <h1>Hello from Egg.js!</h1>
</body>
</html>

到底该怎么在 Egg.js 里正确渲染这个页面？是不是要配置 view 引擎？

我来解答赞 9 收藏

反馈

1 条解答

端木超霞 Lv1

Egg.js 返回 HTML 页面有两种方式，看你具体需求：

方式一：直接返回 HTML 字符串（最简单）

// app/controller/home.js

const Controller = require('egg').Controller;



class HomeController extends Controller {

  async index() {

    const html = 





  

  测试页面





  Hello from Egg.js!




;

    

    ctx.type = 'html';

    ctx.body = html;

  }

}



module.exports = HomeController;

关键点：设置 ctx.type = 'html'，不然浏览器可能当成纯文本解析。

方式二：使用模板引擎（推荐，适合动态数据）

先安装模板引擎：

npm i egg-view-nunjucks --save

然后在 config/plugin.js 启用：

// config/plugin.js

exports.nunjucks = {

  enable: true,

  package: 'egg-view-nunjucks',

};

在 config/config.default.js 配置模板路径：

// config/config.default.js

exports.view = {

  defaultViewEngine: 'nunjucks',

  mapping: {

    '.nj': 'nunjucks',

  },

};

在 app/view 目录下创建模板文件，比如 home.nj：







  

  测试页面





  Hello from Egg.js!

Controller 里这样用：

// app/controller/home.js

const Controller = require('egg').Controller;



class HomeController extends Controller {

  async index() {

    await ctx.render('home.nj', {

      title: '测试页面'

    });

  }

}



module.exports = HomeController;

总结：静态 HTML 直接返回就完事儿，用方式一；需要动态渲染数据（比如从数据库拿数据）才需要上模板引擎。

2026-03-17 12:01