gin學習筆記--文件上傳
相關資料:
單文件上傳
前端:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>文件上傳</title>
</head>
<body>
<form action="/upload" method="post" enctype="multipart/form-data">
<input type="file" name="f1">
<input type="submit" value="上傳">
</form>
</body>
</html>
后端;
package main
import (
"github.com/gin-gonic/gin"
"net/http"
"path"
)
func main() {
r := gin.Default()
//處理multipart forms提交文件時默認的內存限制是32 MiB
r.MaxMultipartMemory = 8 //router.MaxMultipartMemory = 8 << 20 // 8 MiB
r.LoadHTMLFiles("./index.html")//解析模板
r.GET("/index", func(c *gin.Context) {
c.HTML(http.StatusOK,"index.html",nil)//渲染並發送
})
r.POST("/upload", func(c *gin.Context) {
//從請求中讀取文件
f, err := c.FormFile("f1") //根據name返回給第一個文件
if err != nil {
c.JSON(http.StatusBadRequest, gin.H{
"error": err.Error(),
})
}else {
//將讀取到的文件保存到本地(服務端)
//dst := fmt.Sprintf("./%s", f.Filename)
dst := path.Join("./", f.Filename)//拼接字符串作為文件的路徑
_ = c.SaveUploadedFile(f,dst)//核心代碼,將拿到的文件存儲到指定位置
c.JSON(http.StatusOK, gin.H{
"status":"ok",
})
}
})
r.Run(":9090")
}
注:index.html和main.go在同一個文件夾下。
邏輯分析:
- 首先定義好前端的模板
- 在后端進行模板解析
- 進行模板渲染
- 將模板發往瀏覽器
- 瀏覽器上傳文件
- 后端拿到文件並保存
注意事項:
-
form表中的enctype要設置成"multipart/form-data",這是post中用於傳文件的格式。
-
form表單中的action表示將表單數據發往何處,相當於做了跳轉
之前我一直不理解要怎樣才能路由到c.Post()里的handler函數,原來是先訪問路徑.../index(GET方法),然后會上傳后會跳到.../upload,這是便觸發uploadHandle函數。
-
form表單中
<input type="file" name="f1">里的f1與c.FormFile("f1")里的f1是對應的。
多文件上傳
前端:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>文件上傳</title>
</head>
<body>
<form action="/upload" method="post" enctype="multipart/form-data">
<input type="file" name="f1">
<input type="file" name="f1">
<input type="submit" value="上傳">
</form>
</body>
</html>
注意:這里加了一行同樣的 <input type="file" name="f1">實現多個文件上傳。他們都在同一個key下(name=f1)。
后端:
ackage main
import (
"fmt"
"github.com/gin-gonic/gin"
"log"
"net/http"
"path"
)
func main() {
r := gin.Default()
//處理multipart forms提交文件時默認的內存限制是32 MiB
r.MaxMultipartMemory = 8 //router.MaxMultipartMemory = 8 << 20 // 8 MiB
r.LoadHTMLFiles("./index.html")
r.GET("/index", func(c *gin.Context) {
c.HTML(http.StatusOK,"index.html",nil)
})
r.POST("/upload", func(c *gin.Context) {
form, _ := c.MultipartForm()
files := form.File["f1"]//得到一個切片
for _, file := range files {//遍歷切片
log.Print(file.Filename)
dst := path.Join("./", file.Filename)//拼接存儲路徑
//上傳文件到指定的目錄
c.SaveUploadedFile(file, dst)
}
c.JSON(http.StatusOK, gin.H{
"message" : fmt.Sprintf("%d files uploaded!", len(files)),
})
})
r.Run(":9090")
}
注意事項:
- 邏輯和單文件相同
- 得到的同一個key下的文件存在一個切片里,因此存儲時需要先遍歷。
調試:
- 訪問.../index

- 點擊登陸后,后端返回信息

- 此時在后端服務器內文件已保存

當然也可以用postman進行測試,那就不需要前端代碼,后端代碼中也不需要模板渲染和發送代碼。
