ctx.render()加载页面需要等后续执行全部结束才会显示最终结果吗？

Question

想要实现的的业务是先渲染页面，然后通过ctx.body往页面中加内容
核心代码如下
awaitctx.render('crawler',{
title:'爬取页面',
content:`
开始爬取
创建地址池成功！
`
})
constlinkPool=createLinkPool()
for(leti=0;iconsthtml=awaitrequestPage(linkPool[i])
letbuilds=awaitdataHandler(html)
letarr=[];
constsql='insertintobuildinfo(id,name,area,address,average,price,description,type)values?'
//letrows=awaitquery(sql,[builds])
try{
letrows=awaitquery(sql,[builds])
ctx.body+=`爬取地址${linkPool[i]}的${rows.affectedRows}条数据已经入库`
}catch(error){
ctx.body+=`${linkPool[i]}的爬取写入操作失败了！失败原因：${error}`
}
}
现在的问题是只有当所有写数据库的操作结束，页面才会展示，否则一直在读小圆圈，请问怎么才能达到我所预期的效果
我将渲染页面之后的操作放到一个中间件中了，代码如下
router.get('/crawler/',async(ctx,next)=>{
awaitctx.render('crawler',{
title:'爬取页面',
content:`
开始爬取
创建地址池成功！
`
})
next()
})
页面渲染之后也确实执行了入库操作的逻辑，但是
ctx.body+=`爬取地址${linkPool[i]}的${rows.affectedRows}条数据已经入库`
这个操作并没有往页面上写内容，是不是我的用法不对，请问ctx.body是干什么的？

Answer 1

你都awaitquery了当然是读完再返回。如果你需要先渲染一遍，再填充数据，只能在前端写脚本访问后端接口，因为http不能主动写数据。

Answer 2

你的这个需求，最好的方法就是前后端分离前端有个静态页面，然后请求后台的接口数据填充页面就可以了ctx.body方法是往前端返回数据相当于response.body的内容