Express中能否先渲染模板返回，满足条件后再更换返回内容？

报错原因 #

HTTP 协议采用单请求单响应模型，一个客户端请求只能对应一次服务端响应返回。你代码中第一次调用res.send('function running')时，已经将完整的响应头、响应体返回给客户端，本次请求的连接已经关闭，后续再调用res.send就会触发Cannot set headers after they are sent to the client错误。
同时你代码的逻辑顺序也存在问题：异步修改变量的逻辑还未执行，同步执行的if(x)判断时x始终为false，就算没有重复返回响应的错误，任务完成后的提示逻辑也不会触发。

实现方案 #

方案1：客户端轮询（兼容性最强，实现最简单） #

服务端存储任务状态，客户端收到任务提交成功的响应后，定时主动请求服务端查询任务进度，直到返回完成状态。
示例代码：

// 存储任务状态，生产环境建议用Redis等持久化存储替代内存变量
const taskStatus = new Map()

// 提交任务接口
app.post('/task', (req, res) => {
  // 生成唯一任务ID
  const taskId = Date.now().toString()
  taskStatus.set(taskId, 'running')

  // 异步执行耗时任务
  ;(async () => {
    // 此处替换为实际的异步业务逻辑
    await new Promise(resolve => setTimeout(resolve, 3000))
    taskStatus.set(taskId, 'completed')
  })()

  res.send({
    taskId,
    status: 'running',
    message: 'function running'
  })
})

// 查询任务状态接口
app.get('/task/:taskId', (req, res) => {
  const status = taskStatus.get(req.params.taskId) || 'not_found'
  res.send({
    status,
    message: status === 'completed' ? 'Function complete' : 'function running'
  })
})

客户端实现逻辑：拿到返回的taskId后，每隔1-2秒调用一次任务查询接口，直到返回的status为completed即可。

方案2：SSE 服务端推送（无需轮询，服务端主动通知） #

如果不想用轮询，可以采用SSE（Server-Sent Events）保持长连接，服务端先后推送两次状态即可。
示例代码：

app.post('/', (req, res) => {
  // 设置SSE所需的响应头
  res.writeHead(200, {
    'Content-Type': 'text/event-stream',
    'Cache-Control': 'no-cache',
    'Connection': 'keep-alive'
  })

  // 先推送任务运行中通知
  res.write('data: function running\n\n')

  // 异步执行耗时任务
  ;(async () => {
    // 此处替换为实际的异步业务逻辑
    await new Promise(resolve => setTimeout(resolve, 3000))
    // 推送任务完成通知
    res.write('data: Function complete\n\n')
    // 关闭长连接
    res.end()
  })()
})

客户端可以直接用原生EventSource对象接收服务端推送的消息即可，适合仅需要服务端单向通知的场景。

如果有双向通信需求也可以选择WebSocket实现，不过对于这个需求来说上述两种方案足够覆盖大部分场景。

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