如何使用 JS 下载 POST 请求获取的视频文件？

编程并不是一个机械性的工作，而是需要有思考，有创新的工作，语法是固定的，但解决问题的思路则是依靠人的思维，这就需要我们坚持学习和更新自己的知识。今天golang学习网就整理分享《如何使用 JS 下载 POST 请求获取的视频文件？》，文章讲解的知识点主要包括，如果你对文章方面的知识点感兴趣，就不要错过golang学习网，在这可以对大家的知识积累有所帮助，助力开发能力的提升。

如何使用 js 下载 post 请求获取的视频文件？

问题：

使用 post 请求获取的视频文件流，如何将其转换为视频文件并下载？

解决方案：

使用 responsedata: 'blob'：

使用 responsedata: 'blob' 可以在 ajax 回调中接收 blob。然后，使用 url.createobjecturl 将其转换为 bloburl，并将其放入具有 download 属性的 a 标签中以触发下载。

const xhr = new xmlhttprequest();
xhr.open('post', '/video');
xhr.responsetype = 'blob';
xhr.onload = function() {
  if (xhr.status === 200) {
    const blob = xhr.response;
    const bloburl = url.createobjecturl(blob);
    const a = document.createelement('a');
    a.href = bloburl;
    a.download = 'video.mp4';
    a.click();
  }
};
xhr.send();

使用 form target：

此方法直接触发浏览器的默认下载，所以支持移动端和后台下载。但是，此方法不支持携带标头。

<form target="_blank" action="/video" method="POST">
  &lt;input type=&quot;hidden&quot; name=&quot;file_id&quot; value=&quot;123&quot;&gt;
  &lt;input type=&quot;submit&quot; value=&quot;下载&quot;&gt;
</form>

使用临时授权 url：

此方法解决了 form target 的缺点，实现了安全的下载功能，并支持移动端和后台下载。首先，生成一个带有效期的临时授权 url，然后在 a 标签或 form 中使用该 url 下载资源。

文中关于的知识介绍，希望对你的学习有所帮助！若是受益匪浅，那就动动鼠标收藏这篇《如何使用 JS 下载 POST 请求获取的视频文件？》文章吧，也可关注golang学习网公众号了解相关技术文章。