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"})
}
相关推荐
DICOM医学影像4 小时前
2. go语言从零实现以太坊客户端-查询区块链账户余额
开发语言·golang·区块链·以太坊·web3.0·hardhat
西京刀客6 小时前
golang路由与框架选型(对比原生net/http、httprouter、Gin)
http·golang·gin
Mr -老鬼6 小时前
Rust与Go:从学习到实战的全方位对比
学习·golang·rust
我命由我123457 小时前
Photoshop - Photoshop 工具栏(58)锐化工具
学习·ui·职场和发展·求职招聘·职场发展·学习方法·photoshop
小雨下雨的雨8 小时前
Flutter 框架跨平台鸿蒙开发 —— Flex 控件之响应式弹性布局
flutter·ui·华为·harmonyos·鸿蒙系统
DICOM医学影像8 小时前
1. go语言从零实现以太坊客户端-JSON-RPC
golang·区块链·solidity·以太坊·web3.0·json-rpc·erc20
沐墨染9 小时前
敏感词智能检索前端组件设计:树形组织过滤与多维数据分析
前端·javascript·vue.js·ui·数据挖掘·数据分析
PXM的算法星球9 小时前
用 semaphore 限制 Go 项目单机并发数的一次流量控制优化实践
开发语言·后端·golang
ZNineSun9 小时前
GORM:Go的ORM 框架
golang·orm·gorm·crud
源代码•宸10 小时前
Golang语法进阶(定时器)
开发语言·经验分享·后端·算法·golang·timer·ticker