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"})
}
相关推荐
雨季6668 小时前
Flutter 三端应用实战:OpenHarmony 简易“动态内边距调节器”交互模式深度解析
javascript·flutter·ui·交互·dart
北极糊的狐12 小时前
光标放在引入的xxx组件行(import { xxx } from ‘element-ui‘;)出现标黄,显示报错:无法解析符号 ‘xxx‘ 解决办法
ui
子春一13 小时前
Flutter for OpenHarmony:构建一个 Flutter 习惯打卡应用,深入解析周视图交互、连续打卡逻辑与状态驱动 UI
flutter·ui·交互
我的xiaodoujiao14 小时前
使用 Python 语言 从 0 到 1 搭建完整 Web UI自动化测试学习系列 44--将自动化测试结果自动推送至钉钉工作群聊
前端·python·测试工具·ui·pytest
zhangfeng113314 小时前
Ollama 支持模型微调但是不支持词库,支持RAG,go语言开发的大模型的推理应用,
人工智能·深度学习·golang
UI设计兰亭妙微15 小时前
UI 设计新范式:从国际案例看体验与商业的融合之道
人工智能·ui·b端设计
子春一15 小时前
Flutter for OpenHarmony:构建一个 Flutter 天气卡片组件,深入解析动态 UI、响应式布局与语义化设计
javascript·flutter·ui
雨季66615 小时前
Flutter 三端应用实战:OpenHarmony “极简文本行数统计器”
开发语言·前端·flutter·ui·交互
布兰妮甜15 小时前
Photoshop中通过图层混合模式实现图像元素透明度渐变过渡的完整指南
人工智能·ui·生活·photoshop·文化
AIGCmitutu15 小时前
Photoshop抠图插件2026选择指南,Ps抠图插件哪个好用?
人工智能·ui·ai绘画·photoshop·ps