如何为JavaScript请求处理函数添加setTimeout实现5秒延迟跳转

不要在服务端使用setTimeout/await sleep延时返回响应，该操作会导致用户等待5秒才能看到HTML内容，不符合「先加载展示HTML、5秒后跳转」的需求。正确做法是把跳转逻辑写在返回的HTML内容里，由浏览器端执行延时跳转。

修改后的代码 #

async function handleRequest(request) {
  if (request.method !== 'GET') return MethodNotAllowed(request)
  // 原有html变量为你需要返回的页面内容，此处插入跳转逻辑
  const htmlWithRedirect = `
  ${html}
  <script>
    // 5秒后跳转
    setTimeout(() => {
      // 跳转回用户上一个访问的原站点
      history.back()
      // 如果要跳转到固定站点，替换上面的history.back()为：
      // location.href = '你的目标站点完整链接'
    }, 5000)
  </script>
  `
  return new Response(htmlWithRedirect, {
    headers: {
      "content-type": "text/html;charset=UTF-8",
    }
  })
}

补充说明 #

• 延时时间可自定义：代码中的5000是毫秒单位，对应5秒，按需调整数值即可
• 无脚本兼容方案：如果需要兼容禁用JS的浏览器，可以在HTML的<head>标签内插入<meta http-equiv="refresh" content="5; url=目标站点链接">，即使浏览器禁用脚本也能自动跳转

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