文件上传

# form 单文件

package main
// 导入gin包
import (
	"fmt"
	"github.com/gin-gonic/gin"
	"log"
	"net/http"
)

func main() {
	router := gin.Default()
	// 设置文件上传大小限制，默认是32m
	router.MaxMultipartMemory = 64 << 20  // 64 MiB

	router.POST("/upload", func(c *gin.Context) {
		// 获取上传文件，返回的是multipart.FileHeader对象，代表一个文件，里面包含了文件名之类的详细信息
		// file是表单字段名字
		file, _ := c.FormFile("file")
		// 打印上传的文件名
		log.Println(file.Filename)

		// 将上传的文件，保存到./data/1111.jpg 文件中
		c.SaveUploadedFile(file, "./data/1111.jpg")

		c.String(http.StatusOK, fmt.Sprintf("'%s' uploaded!", file.Filename))
	})
	router.Run(":8080")
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

html 代码

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Single file upload</title>
  </head>
  <body>
    <h1>上传文件演示</h1>

    <form action="/upload" method="post" enctype="multipart/form-data">
      文件: <input type="file" name="file" /><br /><br />
      <input type="submit" value="上传文件" />
    </form>
  </body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

注意前端需要设置：enctype="multipart/form-data"

# form 多文件

后端

func DoFileUpload1(ctx *gin.Context)  {
	form,_ :=ctx.MultipartForm()
	files := form.File["file_name"]

	for _,file := range files{
		fmt.Println(file.Filename)
	}
	ctx.String(http.StatusOK,"OK")
}

1
2
3
4
5
6
7
8
9

前端：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Title</title>
  </head>
  <body>
    <form action="/upload1" method="post" enctype="multipart/form-data">
      <input type="file" name="file_name" />
      <input type="file" name="file_name" />
      <input type="submit" />
    </form>
  </body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12
13
14

注意：前端上传的 name 相同才是多文件。

# ajax 单文件

后端

func DoFileUpload1(ctx *gin.Context)  {
    file,_:=ctx.FormFile("file")
    fmt.Print(file.Filename)
	ctx.String(http.StatusOK,"OK")
}

1
2
3
4
5

前端

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Title</title>
    <script src="/static/js/jquery.min.js"></script>
  </head>
  <body>
    <form>
      <input type="file" name="file_name" id="file_id" />
      <input type="button" id="button_id" />
    </form>

    <script>
      var botton_id = document.getElementById("button_id");
      button_id.onclick = function () {
        var form_data = new FormData();
        form_data.append("file", $("#file_id")[0].files[0]);
        $.ajax({
          url: "/upload1",
          type: "POST",
          data: form_data,
          contentType: false,
          processData: false,
          success: function (data) {
            alert(data["code"]);
          },
          fail: function (data) {},
        });
      };
    </script>
  </body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

# ajax 多文件

后端

func DoFileUpload1(ctx *gin.Context)  {
	form,_ :=ctx.MultipartForm()
	files := form.File["file"]

	for _,file := range files{
		fmt.Println(file.Filename)
	}
	ctx.String(http.StatusOK,"OK")
}

1
2
3
4
5
6
7
8
9

前端

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Title</title>
    <script src="/static/js/jquery.min.js"></script>
  </head>
  <body>
    <form>
      <input type="file" name="file_name" id="file_id" />
      <input type="file" name="file_name" id="file_id" />
      <input type="button" id="button_id" />
    </form>

    <script>
      var botton_id = document.getElementById("button_id");
      button_id.onclick = function () {
        var form_data = new FormData();
        form_data.append("file", $("#file_id")[0].files[0]);
        form_data.append("file", $("#file_id")[1].files[0]);
        $.ajax({
          url: "/upload1",
          type: "POST",
          data: form_data,
          contentType: false,
          processData: false,
          success: function (data) {
            alert(data["code"]);
          },
          fail: function (data) {},
        });
      };
    </script>
  </body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

作者：乔克

本文链接：https://jokerbai.com

上次更新: 2025/07/19, 09:17:41

← 会话保持 JWT的简单使用→