Koa2中ejs渲染显示[object Promise]，如何展示真实数据？

嘿，这个问题我碰到过不少，其实核心原因很简单：你传给模板的seconddata是一个未完成的Promise对象，而不是实际的JSON数据，所以EJS直接输出了对象的字符串表示[object Promise]。

问题根源 #

ctx.get("list.json")这个方法返回的是一个Promise（因为文件读取、资源获取这类操作通常是异步的），但你没有等待它执行完成就把这个Promise直接传给了模板，自然拿不到实际的JSON内容。

修复步骤 #

1. 先等待Promise获取实际数据
   给ctx.get("list.json")加上await，确保拿到的是解析后的JSON结构，而不是Promise对象：

   // 加上await，等待异步操作完成
   let list = await ctx.get("list.json");
   ctx.set("Content-Type", "application/json");
   await ctx.render('index', { somecontent: onecontent, seconddata: list });
   

2. 在EJS模板中正确渲染数据

   • 如果想直接输出完整的JSON结构（方便调试或展示原始数据），可以用JSON.stringify，注意用<%- %>避免HTML转义：

     <pre><%- JSON.stringify(seconddata, null, 2) %></pre>
     

     这里的null, 2是为了格式化JSON，让层级结构更清晰易读。
   • 如果是数组或对象，需要遍历渲染具体内容的话，用EJS的循环语法：

     <% if (seconddata && seconddata.length) { %>
       <ul>
         <% seconddata.forEach(item => { %>
           <li>ID: <%= item.id %>，名称: <%= item.name %></li>
         <% }) %>
       </ul>
     <% } %>
     

额外注意 #

如果ctx.get("list.json")返回的是原始JSON字符串（而非已经解析的对象/数组），你还需要手动解析：

let listStr = await ctx.get("list.json");
let list = JSON.parse(listStr);

这样修改后，模板里就能正确显示seconddata的全部数据啦！

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