初学者关于gin多文件上传“后台拿不到上传数据”的问题记录

我是看官网上的例子进行操作的，官网例子如下

func main() {
  router := gin.Default()
  // Set a lower memory limit for multipart forms (default is 32 MiB)
  router.MaxMultipartMemory = 8 << 20  // 8 MiB
  router.POST("/upload", func(c *gin.Context) {
    // Multipart form
    form, _ := c.MultipartForm()
    files := form.File["upload[]"]

    for _, file := range files {
      log.Println(file.Filename)

      // Upload the file to specific dst.
      c.SaveUploadedFile(file, dst)
    }
    c.String(http.StatusOK, fmt.Sprintf("%d files uploaded!", len(files)))
  })
  router.Run(":8080")
}

其中下面这一行需要注意

 files := form.File["upload[]"]

form其实是下面这样一个map类型

type Form struct {
	Value map[string][]string
	File  map[string][]*FileHeader
}

我们所要做的其实是在File当中把key是"upload[]"的值取出来，最重要的就是这个"upload[]"不是固定的写法，而是前端formdata所传入的那个key，前端的写法如下：

let handleUpLoad1: React.FormEventHandler = async (e: React.FormEvent<HTMLFormElement>) => {
        e.preventDefault()
        let files: File[] = filesRef.current.files
        // 利用axios进行上传
        let fd = new FormData()
        for (let i = 0; i < files.length; i++) {
            fd.append("files", files[i])
//这里的传入formdata采用的都是files作为key，其实对应的就是后端那个"upload[]"
        }
        let res = await axios.post("http://localhost:996/multiUpload", fd, {
            headers: {
                'Content-Type': 'multipart/form-data'
            }
        })
        console.log(res.data.msg);
    }

并且多文件上传的key一定要是一样的，否则的话“ files := form.File["key1"]”，这样的操作只能拿到map类型中对应key1的值。

网上很多多文件上传的例子都和官网上一样，我觉得问题可能是他们都是通过curl进行上传测试的，如下

curl -X POST http://localhost:8080/upload \
  -F "upload[]=@/Users/appleboy/test1.zip" \
  -F "upload[]=@/Users/appleboy/test2.zip" \
  -H "Content-Type: multipart/form-data"

这边上传的key都是“upload[ ]”，所以产生了误解