Uint8Array文件下载

news2025/1/14 0:51:02

vue项目,自己调用了阿里云OSS的SDK,进行文件的上传以及下载,有个功能是列表中的附件需要支持点击下载,这里就用到阿里云oss的文件下载,使用了Nodejs的SDK

const OSS = require('ali-oss');
const client = new OSS({...options});
async function get () {
  try {
    //调用get获取文件,因为是网页下载,请求未指定本地路径
    const result = await client.get('exampleobject.txt');

    //result 返回的是 Uint8Array 类型的二进制数据
    console.log(result);
  } catch (e) {
    console.log(e);
  }
}

其中的result,返回的是 Uint8Array 类型的二进制数据,如下图所示

在 JavaScript 中,可以使用浏览器提供的 BlobURL.createObjectURL() API 来实现二进制数据的下载。 


// 1. 创建一个 Blob 对象
const blob = new Blob([result], { type: 'application/octet-stream' });

// 2. 创建一个 URL 对象
const downloadUrl = URL.createObjectURL(blob);

// 3. 创建一个 <a> 元素并设置下载链接和文件名
const downloadLink = document.createElement('a');
downloadLink.href = downloadUrl;
downloadLink.download = 'fileName.jpg';

// 4. 模拟用户点击下载链接
downloadLink.click();

// 5. 清除 URL 对象
URL.revokeObjectURL(downloadUrl);

上述代码中,首先用了oss下载文件返回的 result 这个 Uint8Array 类型的二进制数据。接着,使用 Blob 对象将该二进制数据转换成二进制数据对象,并指定 type 属性为 'application/octet-stream',表示下载的文件类型为二进制数据。

然后,通过 URL.createObjectURL() 创建一个 URL 对象,并将该对象赋值给 <a> 元素的 href 属性。接着,设置 <a> 元素的 download 属性为文件名,这样点击下载链接时,文件会自动以该文件名保存到本地。

最后,通过模拟用户点击 <a> 元素来触发文件下载,同时使用 URL.revokeObjectURL() 清除 URL 对象。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/501643.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

nodejs+vue网上学生社团管理系统

并运用Photoshop CS6技术美化网页&#xff0c;辅之以CSS技术。系统是基于面向对象编程的web应用程序。本系统主要实现的功能有系统用户管理、社团信息管理、社团类别管理、社团活动管理、社团论坛管理、系统管理、个人资料管理、学生入团管理、社团公告管理、社团活动管理、社团…

Ubuntu22.04安装opencv依赖包libjasper-dev出现unable to locate libjasper-dev的终极解决办法

执行 sudo apt install libjasper-dev 提示 执行 sudo apt install libjasper1 libjasper-dev 仍然提示 更换软件源&#xff1a; sudo add-apt-repository "deb http://security.ubuntu.com/ubuntu xenial-security main" sudo apt-get update提示 该仓库没有数…

tiechui_lesson05_内核小文件拷贝

主要学习在内核中的文件操作&#xff0c;包括文件的打开&#xff0c;创建&#xff0c;读取&#xff0c;写入&#xff0c;查询文件属性等。 涉及的API和宏函数 ZwOpenFileZwCreateFileZwQueryInformationFileZwReadFileZwWriteFileZwCloseInitializeObjectAttributes 1.文件的…

学习日记,java学习

题目 生病了,可能是羊了,喉咙好干,好难受 每日一题 1010. 总持续时间可被 60 整除的歌曲 难度中等268收藏分享切换为英文接收动态反馈 在歌曲列表中&#xff0c;第 i 首歌曲的持续时间为 time[i] 秒。 返回其总持续时间&#xff08;以秒为单位&#xff09;可被 60 整除的…

vue+elementui在线教学互动学习考试系统nodejs师生互动交流网站kpm58

语言 node.js 框架&#xff1a;Express 前端:Vue.js 数据库&#xff1a;mysql 数据库工具&#xff1a;Navicat 开发软件&#xff1a;VScode 前端vueelementui, (1) vue引入elementui 1.使用npm安装element-ui npm i element-ui -S 2.在main.js中导入使用vue import element-u…

Android WorldWind的使用与加载数方瓦片

明确下定义&#xff0c;数方瓦片也叫五层十五级瓦片。现记录下如何在World Wind Android中加载数方瓦片的方法。 原理 加载数方瓦片最核心的方法是WorldWindAndroid加载图片的方法&#xff0c;更加详细的使用说明请访问worldwind官网。核心代码如下&#xff1a; Sector sect…

Daimayuan Online Judge #613. 好序列(思维题 暴力/启发式分裂)

题目 思路来源 知乎严格鸽 (暴力/启发式分裂)代码源每日一题 Div1 好序列 - 知乎 题解 启发式分裂&#xff0c;可以认为是启发式合并的逆过程 比较直白的想法是找到第一个只出现一次的数的位置x&#xff0c;然后分治[1,x-1]和[x1,n] 但是这样最坏复杂度是O(n^2)的&#xf…

数字化转型对企业的好处有哪些(上)

过时的技术、流程和客户关系管理困难是当前阻碍企业增长的主要障碍&#xff0c;CRM系统是企业数字化转型的主要工具&#xff0c;帮助企业简化操作、提高效率&#xff0c;为客户提供更加卓越的客户体验。下面说说&#xff0c;企业数字化转型的十大好处。 放眼全球来看&#xff…

第四十三章 Unity 开关 (Toggle) UI

本章节我们介绍开关 (Toggle)和开关组 (Toggle Group)。首先&#xff0c;我们点击菜单栏“GameObject”->“UI”->“Toggle”&#xff0c;然后调整它的位置&#xff0c;效果如下所示 相信大家在很多网页中也看到过类似的UI元素&#xff0c;它通常用于让用户勾选某些选项。…

计算机二级精选习题精讲精练

请点击↑关注、收藏&#xff0c;本博客免费为你获取精彩知识分享&#xff01;有惊喜哟&#xff01;&#xff01; 1、在线性表的链式存储结构中&#xff0c;其存储空间一般是不连续的&#xff0c;并且( ) A&#xff09;前件结点的存储序号大于后件结点的存储序号 B&#x…

java排序算法精讲

排序算法 概要一、冒泡排序概念实现步骤 代码 二、选择排序概念实现步骤 代码 三、插入排序概念实现步骤 代码 四、快速排序概念实现步骤 代码 五、归并排序概念实现步骤 代码 六、堆排序概念实现步骤 代码 总结以二维表表现出各个排序的关系 概要 Java是一种面向对象的编程语言…

一篇文章带您区分GNSS欺骗模拟测试的两种方式

写在前面 注意&#xff1a;提供的设备与案例、使用指南等指导性文件是为了在测试环境中对接收机的抗干扰能力进行验证&#xff0c;而非出于欺骗或干扰真实环境中的GNSS信号的目的&#xff01;请确保通过线缆连接应用或暗室应用&#xff0c;若因为违规使用产生的任何法律后果和…

携带数据的Ajax POST请求

前端页面代码&#xff1a; <!DOCTYPE html> <html lang"en"> <head> <meta charset"UTF-8"> <title>发送ajax POST请求 看如何携带数据</title> <script type"text/javascript"> …

MES管理系统有什么功能?前期实施MES需要做些什么

MES系统是在制造业数字化的环境下&#xff0c;围绕生产制造执行而开发的一套生产管理系统。它以车间为管理核心&#xff0c;通过集成各信息系统&#xff0c;整合企业资源&#xff0c;实现从订单下达到产品完成的整个生产制造过程的数字化管理。 MES系统在实施前需要进行各种准备…

“UTONMOS吧”的出现,能否唤起百度贴吧曾经的辉煌?

百度贴吧&#xff0c;诞生于一个中文互联网尚且信息不足的时代&#xff0c;并建立起了一个庞大的社区。然而进入自媒体时代&#xff0c;贴吧这个大广场日渐冷清&#xff0c;2015年月活用户超过3亿&#xff0c;到2021年已不足4000万。 梗的流行&#xff0c;带动一大批人开始网上…

OpenShift 4 - KubeVirt 虚机使用的磁盘和卷

《OpenShift / RHEL / DevSecOps 汇总目录》 说明&#xff1a;本文已经在 OpenShift 4.12 环境中验证 文章目录 KubeVirt 虚机的磁盘和卷Disk 磁盘Volume 卷 磁盘和卷示例containerDisk 卷示例cloudInitNoCloud 卷示例dataVolume 卷示例基于容器镜像基于 qcow2 文件基于 DataSo…

放大招:三步搞定ChatGPT提示词,轻松写出高质量提问,最新经验分享

在撰写ChatGPT提示语的时候&#xff0c;有一个基本的三层结构&#xff0c;经过在工作和生活上的实践&#xff0c;有助于解决大多数不同类型的任务。 尤其在你的问题有点复杂&#xff0c;想不清楚要怎么问比较好的时候&#xff0c;通过三层结构&#xff0c;让我们有结构的提出问…

力扣简单题

目录 9、回文数 13、罗马数字转整数 14、最长公共前缀 20、有效的括号 58、最后一个单词的长度 66、加一 69、x的平方根 94、二叉树的中序遍历 100、相同的树 202、快乐数 205、同构字符串 242、有效的字母异位词 258、各位相加 268、丢失的数字 290、单词…

Github 使用教学

&#x1f4ad; 写在前面&#xff1a;本章我们将介绍 Git 的基本使用方法&#xff0c;包括注册 GitHub 账号、设置 Git、创建本地存储库、复制本地存储库、导入远程存储库、追加、提交、合并等常用操作。我们还会教你如何在 GitHub 上创建项目&#xff0c;使用 git clone 命令克…

盘“底座”,盘出新生意经

本文转自首席信息官 作者 徐蕊 导读 卖“底座”&#xff0c;这是一门新的生意&#xff0c;也是用友与友商差异化的商业竞争优势所在。 大型企业都在建“数智化底座” 有这样两类企业&#xff0c;他们截然不同&#xff0c;但在数智化的建设上殊途同归。 随着中国经济的发展&a…