VUE向外暴露文件,并通过本地接口调用获取,前端自己生成接口获取public目录里面的文件

VUE中,如果我们想对外暴露一个文件,可以在打包之后也能事实对其进行替换,我们只需要把相关文件放置在public目录下即可,可以放置JSON,Excel等文件

比如我在这里放置一个other文件

我们可以直接在VUE中使用axios去获取这里面的数据

import axios from "axios";
import * as XLSX from "xlsx";

const getData = () => {
  axios
    .get("/music/dist/data/other.xlsx", { responseType: "arraybuffer" })
    .then((res) => {
      const workbook = XLSX.read(res.data, { type: "buffer" }); // 使用buffer类型
      const sheetName = workbook.SheetNames[0];
      const worksheet = workbook.Sheets[sheetName];
      const json = XLSX.utils.sheet_to_json(worksheet);
      return json //最终输出结果
    });
};

这里的JSON就是我们在Excel中获取到的数据,这里我们我们使用XLSX去解析出最终表格结果

我们调用接口,可以发现接口本身是304,但是不用怕,数据已经返回给我们了,music/dist是我自己配置的文件路径,大家可以根据自己的来试试

最终我们可以在结果中获取,并按照我上面的方式进行数据解析即可

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

ubuntu-24.04.1-desktop 中安装 QT6.7

ubuntu-24.04.1-desktop 中安装 QT6.7 1 环境准备1.1 安装 GCC 和必要的开发包:1.2 Xshell 连接 Ubuntu2 安装 Qt 和 Qt Creator:2.1 下载在线安装器2.2 在虚拟机中为文件添加可执行权限2.3 配置镜像地址运行安装器2.4 错误:libxcb-xinerama.so.0: cannot open shared objec…

应用的负载均衡

概述 负载均衡(Load Balancing) 调度后方的多台机器,以统一的接口对外提供服务,承担此职责的技术组件被称为“负载均衡”。 负载均衡器将传入的请求分发到应用服务器和数据库等计算资源。负载均衡是计算机网络中一种用于优化资源利…

Linux: 已占用接口

Linux: 已占用接口 1. netstat(适用于旧系统)1.1 书中对该命令的介绍 2. ss(适用于新系统,替代 netstat)3. lsof(查看详细进程信息)4. fuser(快速查找占用端口的进程)5. …

组件注册方式、传递数据

组件注册 一个vue组件要先被注册,这样vue才能在渲染模版时找到其对应的实现。有两种注册方式:全局注册和局部注册。(组件的引入方式) 以下这种属于局部引用。 组件传递数据 注意:props传递数据,只能从父…

使用DeepSeek/chatgpt等AI工具辅助网络协议流量数据包分析

随着deepseek,chatgpt等大模型的能力越来越强大,本文将介绍一下deepseek等LLM在分数流量数据包这方面的能力。为需要借助LLM等大模型辅助分析流量数据包的同学提供参考,也了解一下目前是否有必要继续学习wireshark工具以及复杂的协议知识。 pcap格式 目…

蓝桥杯嵌入式客观题以及解释

第十一届省赛(大学组) 1.稳压二极管时利用PN节的反向击穿特性制作而成 2.STM32嵌套向量终端控制器NVIC具有可编程的优先等级 16 个 3.一个功能简单但是需要频繁调用的函数,比较适用内联函数 4.模拟/数字转换器的分辨率可以通过输出二进制…

《Mycat核心技术》第17章:实现MySQL的读写分离

作者:冰河 星球:http://m6z.cn/6aeFbs 博客:https://binghe.gitcode.host 文章汇总:https://binghe.gitcode.host/md/all/all.html 星球项目地址:https://binghe.gitcode.host/md/zsxq/introduce.html 沉淀&#xff0c…

虚拟机 | Ubuntu 安装流程以及界面太小问题解决

文章目录 前言一、Ubuntu初识二、使用步骤1.下载ubuntu镜像2.创建虚拟机1、使用典型(节省空间)2、稍后安装方便配置3、优选Linux版本符合4、浏览位置,选择空间大的磁盘 6、 配置信息,选择镜像7、 启动虚拟机,执行以下步…

2025系统架构师(一考就过):案例之三:架构风格总结

软件架构风格是描述某一特定应用领域中系统组织方式的惯用模式,按照软件架构风格,物联网系统属于( )软件架构风格。 A:层次型 B:事件系统 C:数据线 D:C2 答案:A 解析: 物联网分为多个层次&#xff0…

ubuntu离线安装Ollama并部署Llama3.1 70B INT4

文章目录 1.下载Ollama2. 下载安装Ollama的安装命令文件install.sh3.安装并验证Ollama4.下载所需要的大模型文件4.1 加载.GGUF文件(推荐、更容易)4.2 加载.Safetensors文件(不建议使用) 5.配置大模型文件 参考: 1、 如…

算法-数据结构(图)-DFS深度优先遍历

深度优先遍历(DFS)是一种用于遍历或搜索图的算法。以下是对它的详细介绍: 1. 定义 基本思想:从图中某个起始顶点出发,沿着一条路径尽可能深地访问图中的顶点,直到无法继续前进(即到达一个没…

uni-app集成sqlite

Sqlite SQLite 是一种轻量级的关系型数据库管理系统(RDBMS),广泛应用于各种应用程序中,特别是那些需要嵌入式数据库解决方案的场景。它不需要单独的服务器进程或系统配置,所有数据都存储在一个单一的普通磁盘文件中&am…

python文件的基本操作,文件读写

1.文件 1.1文件就是存储在某种长期存储设备上的一段数据 1.2文件操作 打开文件-->读写文件-->关闭文件 注意:可以只打开和关闭文件不进行任何操作 1.3文件对象的方法 1.open():创建一个file对象,默认以只读模式打开 2.read(n):n表示从文件中…

半导体晶圆精控:ethercat转profient网关数据提升制造精度

数据采集系统通过网关连接离子注入机,精细控制半导体晶圆制造过程中的关键参数。 在半导体制造中,晶圆制造设备的精密控制是决定产品性能的关键因素。某半导体工厂采用耐达讯Profinet转EtherCAT协议网关NY-PN-ECATM,将其数据采集系统与离子注…

双臂机器人的动力学建模

双臂机器人的动力学建模是研究机器人在运动过程中的力学行为和动力学特性,主要目的是确定在给定的控制指令下,机器人各个关节或末端执行器所受的力与加速度之间的关系。建立动力学模型通常涉及以下几个步骤: 1. 定义机器人坐标系和关节空间 双…

驱动开发系列39 - Linux Graphics 3D 绘制流程(二)- 设置渲染管线

一:概述 Intel 的 Iris 驱动是 Mesa 中的 Gallium 驱动,主要用于 Intel Gen8+ GPU(Broadwell 及更新架构)。它负责与 i915 内核 DRM 驱动交互,并通过 Vulkan(ANV)、OpenGL(Iris Gallium)、或 OpenCL(Clover)来提供 3D 加速。在 Iris 驱动中,GPU Pipeline 设置 涉及…

中国的Cursor! 字节跳动推出Trae,开放Windows版(附资源),开发自己的网站,内置 GPT-4o 强大Al模型!

Trae是什么 Trae 是字节跳动推出的免费 AI IDE,通过 AI 技术提升开发效率。支持中文,集成了 Claude 3.5 和 GPT-4 等主流 AI 模型,完全免费使用。Trae 的主要功能包括 Builder 模式和 Chat 模式,其中 Builder 模式可帮助开发者从…

【洛谷排序算法】P1012拼数-详细讲解

洛谷 P1012 拼数这道题本身并非单纯考察某种经典排序算法(如冒泡排序、选择排序、插入排序、快速排序、归并排序等)的实现,而是在排序的基础上,自定义了排序的比较规则,属于自定义排序类型的题目。不过它借助了标准库中…

阿里云可观测全面拥抱 OpenTelemetry 社区

作者:古琦 在云计算、微服务、容器化等技术重塑 IT 架构的今天,系统复杂度呈指数级增长。在此背景下,开源可观测性技术已从辅助工具演变为现代 IT 系统的"数字神经系统",为企业提供故障预警、性能优化和成本治理的全方…

STM32开发学习(三)----使用STM32CUBEMX创建项目

前言 开始正式接触代码,学习代码开发,先熟悉STM32CUBEMX软件,控制开发板的GPIO。(STM32F103C8T6)。 正式开始 1.打开软件 2.点击ACCESS TO MCU SELECTOR,进入软件选择,可能会弹出更新,等待更新完成即可。…