关于Vue本地图片转file传到后端服务器(不通过组件上传)

一、代码

javascript 复制代码
// 核心代码
const getMyFileFromLocalPath = (localPath, filename) => {
  return fetch(localPath)
    .then((response) => response.blob())
    .then((blob) => new File([blob], filename, { type: "image/png" })); // 假设是PNG格式

//  获取真正的流文件
const getMyImgFile = (url, name) => {
  getMyFileFromLocalPath(url, name)
    .then((file) => {
    // fileRes: 存储file流文件
      fileRes.value = file;
    })
    .catch((error) => console.error(error));
};

// 动态引入图片,替代require方法
requireImg(url) {
  return new URL(`./src/assets/${url}`, import.meta.url).href
}

// 调用 
 getMyImgFile (
    requireImg('imgae/home/warn.png'),
    '随便起个名字'
  );

};```
相关推荐
加班是不可能的,除非双倍日工资1 小时前
css预编译器实现星空背景图
前端·css·vue3
wyiyiyi2 小时前
【Web后端】Django、flask及其场景——以构建系统原型为例
前端·数据库·后端·python·django·flask
gnip2 小时前
vite和webpack打包结构控制
前端·javascript
玩转以太网3 小时前
基于W55MH32Q-EVB 实现 HTTP 服务器配置 OLED 滚动显示信息
服务器·网络协议·http
excel3 小时前
在二维 Canvas 中模拟三角形绕 X、Y 轴旋转
前端
阿华的代码王国3 小时前
【Android】RecyclerView复用CheckBox的异常状态
android·xml·java·前端·后端
一条上岸小咸鱼3 小时前
Kotlin 基本数据类型(三):Booleans、Characters
android·前端·kotlin
Jimmy3 小时前
AI 代理是什么,其有助于我们实现更智能编程
前端·后端·ai编程
草梅友仁3 小时前
草梅 Auth 1.4.0 发布与 ESLint v9 更新 | 2025 年第 33 周草梅周报
vue.js·github·nuxt.js
ZXT3 小时前
promise & async await总结
前端