代码之家  ›  专栏  ›  技术社区  ›  Mike Chamberlain JaredPar

HTML:“请等待”加载带有重定向、跨浏览器、符合标准的页面

  •  2
  • Mike Chamberlain JaredPar  · 技术社区  · 15 年前

    我有一个常见的问题,就是在处理长时间运行的任务时,用HTML实现一个“请稍候,处理您的请求”页面,以向用户显示。具体来说,我正在创建一个订单并为信用卡付费。

    目前我首先加载pleasewait.html,显示一条消息和一个spinner,它直接重定向到process.html,然后进行处理。一旦process.html完成,它将重定向到complete.html。

    我正在尝试完全跨浏览器并遵循所有建议。这意味着应避免以下技术:

    • javascript重定向,因为用户可能已禁用脚本
    • 元刷新,因为这是不鼓励/不赞成的,我认为有些浏览器也允许用户禁用它。
    • 发送HTTP 301响应,因为这会导致浏览器(至少是IE)根本无法呈现“请等待”页面。
    • 使用隐藏的iframe保存process.html,我再次相信这将需要javascript检测处理完成的时间。

    所以我的问题是…我到底是怎么做到的?

    如果解决方案允许我的动画GIF在整个处理阶段继续动画,则会有额外的积分(至少是荣誉)。我之所以提到这一点,是因为在IE中,当pleasewait.html重定向process.html时,所有动画都会停止,这意味着我的旋转器当前仅旋转半秒左右,然后在process.html加载页面时停止。

    2 回复  |  直到 15 年前
        1
  •  1
  •   leepowers    15 年前

    我会使用meta-refresh-我不确定为什么它被认为是不推荐使用的-它是HTML5工作草案的一部分-它看起来像是要留在这里:

    http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#attr-meta-http-equiv-refresh

    当然,您可以为用户提供一个链接,以便在不触发元刷新的情况下重新加载页面。为了安全起见,发送一封电子邮件,其中包含一个链接,用于在交易失败时重新输入付款信息。

        2
  •  0
  •   Evan    15 年前

    这是一套相当苛刻的约束条件!如果没有JS,我很确定您回到了用户需要执行操作的世界:(在那个世界中…您也可以通过“检查订单是否完成”链接让用户点击。

    我认为大多数人会认为,在大多数情况下,假设“基本”的javascript应该是“允许的”是安全的。基本上我指的是 setTimeout() window.location . 如果您可以使用这些基本命令,您可以让页面每隔5秒左右重新加载一次。让页面点击“isuserdone.php”,如果浏览器返回到“处理”页面或“完成”页面,它将重定向浏览器。可以在PHP中使用header函数 header('Location: complete.html') 要让脚本告诉用户的浏览器转到不同的(或相同的)页面。

    推荐文章