如何通知视觉辅助用户其浏览器下载状态?

时间:2018-10-16 16:26:24

标签: events browser download anchor

使用标准的锚元素来下载内容,我可以拦截click事件,以通知辅助用户下载开始。但是,下载完成或失败时似乎没有事件发送。照原样,可见的用户可以看到浏览器“下载完整的弹出窗口”,但这对盲用户完全不可见。

上下文是Chromebook / Chrome / ChromeVox

HTML片段:

<a id=asdf download href="http://50.18.90.151/scv/audio/3510b90ced0e914f83c81d8f03e47c01">
   download sound file</a>
<script>
    var elt = document.getElementById('asdf');
    console.log('Adding listeners', elt);
    elt.addEventListener('click', (evt) => {
        console.log('Starting download');
    });
    elt.addEventListener('load', (evt) => {
        console.log('This never gets called');
    });
</script>

我尝试了以下所有事件,但均未触发: elt.addEventListener('close', (evt) => { elt.addEventListener('complete', (evt) => { elt.addEventListener('data', (evt) => { elt.addEventListener('downloading', (evt) => { elt.addEventListener('ended', (evt) => { elt.addEventListener('end', (evt) => { elt.addEventListener('loadend', (evt) => { elt.addEventListener('load', (evt) => { elt.addEventListener('message', (evt) => { elt.addEventListener('progress', (evt) => { elt.addEventListener('statechange', (evt) => { elt.addEventListener('storage', (evt) => { │ => elt.addEventListener('success', (evt) => { elt.addEventListener('writeend', (evt) => { elt.addEventListener('end', (evt) => {

1 个答案:

答案 0 :(得分:0)

感谢@jdv指出相关的帖子,该帖子确认没有浏览器事件可完成下载。

解决方案是让服务器下载处理程序返回会话cookie,例如“ download-date”。处理完响应后,Cookie值将更改,并且可以根据需要使用Javascript更新Web应用程序。

  1. 这是一个临时Cookie,因此请避免 maxAge 过期
  2. 还避免 httpOnly ,以便客户端Javascript可以访问Cookie

就是这样!