Vant UI +Golang(gin) 上传文件

前端基本用法:点击查看

实现代码:

javascript 复制代码
const afterRead = (file) => {
  console.log(file);
  //set content-type to multipart/form-data
  const formData = new FormData();
  formData.append("file", file.file);
  request.POST("/api/v1/users/upload", formData, {
    headers: {
      "Content-Type": "multipart/form-data",
    },
  }).then((res) => {
    console.log(res);
  });
};

后端代码:

Go 复制代码
func (h *usersHandler) Upload(c *gin.Context) {
	// 上传单张图片
	file, err := c.FormFile("file")
	if err != nil {
		logger.Error("FormFile error", logger.Err(err), middleware.GCtxRequestIDField(c))
		response.Error(c, ecode.InternalServerError)
		return
	}
	filename := file.Filename
	// 保存文件到static/pictures
	err = c.SaveUploadedFile(file, "./static/pictures/"+filename)
	if err != nil {
		logger.Error("SaveUploadedFile error", logger.Err(err), middleware.GCtxRequestIDField(c))
		response.Error(c, ecode.InternalServerError)
		return
	}
	response.Success(c, gin.H{"message": "upload success"})
}
相关推荐
踏着七彩祥云的小丑31 分钟前
Go学习第5天:变量作用域 + 数组 + 指针
开发语言·学习·golang·go
川石课堂软件测试2 小时前
UI自动化测试|元素操作&浏览器操作实践
功能测试·测试工具·mysql·ui·docker·容器·单元测试
Lewiis2 小时前
白话桶排序
数据结构·算法·golang·排序算法
咖啡星人k2 小时前
MonkeyCode 后端架构全解析:Go微服务如何支撑万级并发AI任务
微服务·架构·golang·monkeycode
张忠琳2 小时前
【Go 1.26.4】Golang Interface 接口深度解析
开发语言·golang
伊灵eLing2 小时前
GoLang 语言高级(1)
开发语言·后端·golang
张忠琳3 小时前
【Go 1.26.4】(Part 8) Go 1.26.4 超深度分析 — context + reflect + errors
开发语言·golang
张忠琳3 小时前
【Go 1.26.4】(Part 3) Go 1.26.4 超深度分析 — Runtime GC 垃圾收集 (mgc*.go + mbitmap.go)
开发语言·golang
lichenyang4533 小时前
# 打车票根卡片 UI 重构:从 Circle 挖洞到 clipShape PathShape,再到 100% 自适应
ui·华为·重构·harmonyos
namexingyun3 小时前
GPT-5.6 前端生成能力深度解析:kindle/kepler/Levi三版本UI实测与技术推演
java·前端·人工智能·gpt·机器学习·ui