a
标签的
下载属性(downloads)可以用来指定
下载文件的名称，但是它并不能保证所有浏览器都支持该属性。在某些浏览器中，特别是移动设备上的浏览器，点击a
标签下载视频可能会
直接打开视频而不是
下载。为了解决这个问题，可以
使用JavaScript来触发文件
下载。你可以
使用XMLHttpRequest对象来获取视频文件的二进制数据，然后
使用FileSaver.js库中的saveAs函数将数据保存为文件并
下载到本地。以下是一个示例代码：
```javascript
export function downloadVideo(url) {
const xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.responseType = 'blob';
xhr.onload = () => {
if (xhr.status === 200) {
const blob = xhr.response;
const fileName = 'video.mp4'; // 设置
下载的文件名
saveAs(blob, fileName); //
使用FileSaver.js保存文件并
下载
}
};
xhr.send();
}
function saveAs(blob, fileName) {
if (window.navigator.msSaveOrOpenBlob) {
// 兼容IE浏览器
window.navigator.msSaveOrOpenBlob(blob, fileName);
} else {
// 其他浏览器
const link = document.createElement('a');
link.href = window.URL.createObjectURL(blob);
link.download = fileName;
link.style.display = 'none';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
window.URL.revokeObjectURL(link.href);
}
}
```
你可以调用`downloadVideo`函数并传入视频的URL来
实现下载视频而不是
直接打开。请注意，这个方法在某些浏览器上可能仍然无法正常工作，因为浏览器对于跨域
下载的限制可能会导致
下载失败。在这种情况下，你可能需要通过服务器端来提供视频文件的
下载链接。
#### 引用[.reference_title]
- *1* [js
使用a
标签下载文件或打开
后台返回的
下载链接](https://blog.csdn.net/wh20141212/article/details/124607706)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item]
- *2* [＜a＞
标签下载download 浏览器打开文件或者
下载文件的区别](https://blog.csdn.net/qiao_qiao_happy/article/details/117035187)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item]
- *3* [
使用h5 <a>
标签 href='url' download
下载踩过的坑](https://blog.csdn.net/yiyan12/article/details/80902945)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]
972
非常没帮助
没帮助
一般
有帮助
非常有帮助
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
