vue3和tauri直接下载Binary 数组的二进制文件内容到本地

news2024/11/25 23:01:52

通过发送url请求,直接获取到一个文件的Binary 数组内容,然后通过tauri的api:writeBinaryFile保存文件到本地电脑。

发送请求的时候,要加上响应类型:responseType: ResponseType.Binary

然后等返回的响应内容:发现是一个Binary 数组

这个时候去查看writeBinaryFile这个api,发现刚好支持:fs | Tauri Apps

 

所以我们可以直接将这个返回的内容丢到writeBinaryFile里面就可以了。

但是我们还需要获取文件下载时候,要保存到的路径,这个就用tauri的save dialog api就可以了:dialog | Tauri Apps 

然后获取到文件的保存路径,就可以发送请求下载内容了:

const downFile = async (file?: any) => {
  var fileURL = file.openLink ? file.openLink : rightClickItem.openLink
  const basePath = await path.downloadDir() + `/${file.name ? file.name : rightClickItem.name}`;
  let selPath = await dialog.save({
    title: `保存文件: ${file.name ? file.name : rightClickItem.name}`,
    defaultPath: basePath,
    filters: [{
      name: '*',
      extensions: ['*']
    }]
  });
  console.log("selPath----", selPath);
  // 开始发送下载请求
  selPath && fileApi.downFile(fileURL).then(async res => {
    console.log("downRes----", res);
    writeBinaryFile({ contents: res.data as any, path: `${selPath}` })
      .then(res => {
        ElMessage({
          message: `${file.name ? file.name : rightClickItem.name}保存成功`,
          type: 'success',
        })
      }).catch(err => {
        ElMessage.error('文件保存失败:' + err)
      })
  })
}

实现的效果:

点击保存后:

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

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

相关文章

权限系统就该这么设计,稳的一批!

对于后台管理系统来说,权限功能已经是必不可少的一部分了。如果你用过一些快速开发脚手架,你会发现很多都直接集成了权限功能。把权限功能做成一个通用功能,非常有利于代码的复用。今天就以我的mall电商实战项目为例,来聊聊权限系…

防止重复请求,防止重复点击,解决:使用分布式锁,redisson,setnx简单实例

防止重复请求,解决:使用分布式锁,redisson,简单实例 通常情况下:synchronize在单机下是可以的,在分布式下不适用,nginx做分发到了不同的服务器后,不同的jvm是锁不住的,这…

【C语言进阶篇】常见动态内存分配的这六个错误你必须避免!

🎬 鸽芷咕:个人主页 🔥 个人专栏:《C语言初阶篇》 《C语言进阶篇》 ⛺️生活的理想,就是为了理想的生活! 文章目录 前言💬 常见的动态内存错误1️⃣ 对NULL指针的解引用操作⌨️ 错误原因💻 解决方法&…

MonoDTR Monocular 3D Object Detection with Depth-Aware Transformer 论文学习

论文链接:MonoDTR: Monocular 3D Object Detection with Depth-Aware Transformer 1. 解决了什么问题? 单目 3D 目标检测对于自动驾驶很重要,也很有挑战性。 现有的一些方法通过深度预测网络得到深度信息,然后辅助 3D 检测&…

总结930

之前本打算每天学12h,践行了一周,一天最多也就学11.5h,在时间利用上感觉已经趋于饱和的了。 这个时候,时间统计法应该能发挥它应有的作用了,但就算详细记录每日时间支出,也不能从根本上解决问题。 一味的进行时间上的…

学习记录——语义分割、实时分割和全景分割的区别、几个Norm的区别

语义分割、实时分割和全景分割区别? semantic segmentation(语义分割) 通常意义上的目标分割指的就是语义分割,图像语义分割,简而言之就是对一张图片上的所有像素点进行分类。   语义分割(下图左&#…

护网实训场景二-

首先攻击者入侵到了web服务器,构建一个socks5代理,去入侵办公区,通过办公区在构建二层代理去拿下核心区就这么一个流程。 攻击:先开始扫描 防御:导入流量包,在分析平台去看告警 这就是一个很明显的目录扫描…

Linux 部署Vue+Spring Boot项目

部署Vue Spring Boot项目 安装redis wget http://download.redis.io/releases/redis-4.0.8.tar.gz tar -zxvf redis-4.0.8.tar.gz yum install gcc-c make make install如果出现下面的问题: yum install tcl make testredis-server myconifg/redis.conf输入客户端…

Vue 安装 Vue-router 路由安装以及使用

vue-router 是 Vue 的一个插件库,适用于构建单页面应用。 单页面应用:整个应用中只有一个完整的页面,切换页面就是替换页面中的内容。 工作原理:当浏览器的路径发生改变时,路由器会自动显示路径所对应的组件。 嵌套…

【主轴线】不规则多边形主轴线计算与显示

every blog every motto: You can do more than you think. https://blog.csdn.net/weixin_39190382?typeblog 0. 前言 不规则多边形的主轴线 计算方法与显示方法 1. 正文 主轴线的计算与显示 首先,我们计算多边形的中心点,然后将顶点坐标相对于中…

经典文献阅读之--DAMS-LIO(基于iEKF的轻量级LiDAR惯性里程计)

0. 简介 融合方案是多传感器融合方法的关键,多传感器融合方法是地下矿山和行星表面等复杂极端环境下状态估计的最有前途的解决方案。本文提出了一种基于iEKF的轻量级LiDAR惯性里程计系统,该系统采用可感知退化的模块化传感器融合管道,仅在检…

C语言小项目——通讯录高阶(文件管理版)

通讯录初阶: 点这里 通讯录中阶: 点这里 文件管理版本改进之处通讯录初始化退出通讯录并保存 完整代码contact.hcontact.ctest.c 文件管理版本改进之处 通讯录初始化 contact.c 退出通讯录并保存 test.c contact.c contact.h 完整代码 contact.h #pragma once#include&l…

缕析条分Scroll属性 | 京东云技术团队

最近有项目需要使用js原生开发滑动组件,频繁要用到dom元素的各种属性,其中以各种类型的height和top属性居多,名字相近,含义也很容易搞混。因此特地总结归纳了一下常用的知识点,在文末我们来挑战实现一个简易的移动端Sc…

Window下编译ffmpeg

Window下编译ffmpeg 下载MSYS2编译ffmpeg运行 下载MSYS2 MSYS2是一个是工具和库的集合,它能够方便的在windows上编译、安装和运行程序。ffmpeg可以通过这个软件来编译。 从MSYS2官网下载MSYS2并安装。 运行MSYS2终端,在终端中输入命令,安装…

JVM运行时数据区——Java虚拟机栈

每个线程在运行时都会创建一个Java虚拟机栈,也是线程私有的,其内部包含一个个的栈帧,先进后出,对应着一个个方法的调用,运行完则弹出,所以不存在垃圾回收的问题,如果线程所需要的栈深度大于此线…

什么是芯片组,南桥与北桥芯片的作用与区别

主板是连接计算机所有部件的PCB。在老式计算机中,所有芯片都分布在主板上。在现代计算机中,芯片数量减少并集中在特定位置。因此,将多个芯片组合起来形成一个芯片。这种可以替代大量芯片的芯片称为芯片组。主板上有一个芯片组。芯片组处理CPU…

docker在linux下简单部署项目

springboot项目docke部署 1.手动部署 1. 编写dockerfile文件 2. 将jar包和docker文件放到服务器上 执行mvn clean package docker:build 3.执行docker images查询是否存在镜像 4.启动方式放在下面写 2.通过gitlab ci/cd方式实现自动化部署 3.创建一个.gitlab-ci.yml 文件 3…

匿名内部类/Lambda Java和Kotlin谁会导致内存泄漏?

前言 内存泄漏是程序界永恒的话题,对于Android开发来说尤为重要,想让你的App表现得更优雅,了解并治理内存泄漏问题势在必行。 通过本篇文章,你将了解到: 何为内存泄漏?Android 常见内存泄漏场景Java匿名内部类会导致…

Vue3警告提示(Alert)

可自定义设置以下属性: 警告提示内容(message),类型:string | slot,默认:‘’警告提示的辅助性文字介绍(description),类型:string | slot&#…

14 - 堆栈 - 小顶堆

前面我们学习了线性结构的栈, 今天我们来学习一种非线性结构-堆 堆的定义 堆是一种非线性结构,可以把堆看作一棵二叉树, 堆的存储可以使用数组来存放! 堆的分类 堆可以分为大顶堆和小顶堆。 大顶堆: 每个结点的值都大于或等于其左右孩子结点的值。 小顶堆: 每个结点的值…