Das Erstellen einer Datei-Upload-API ist eine häufige Anforderung für viele Webanwendungen, bei denen Benutzer Dokumente, Bilder oder andere Mediendateien übermitteln. In diesem Artikel führen wir Sie durch den Aufbau einer sicheren und effizienten Datei-Upload-API mithilfe von Go mit dem Gin-Framework. Sie erfahren, wie Sie Ihr Projekt einrichten, eingehende Dateien verarbeiten und sicher speichern, um sicherzustellen, dass Ihre Anwendung vom Benutzer hochgeladene Inhalte zuverlässig verwalten kann.
Voraussetzungen
Gehen Sie 1,21
Setup-Projekt
Einrichten der Go-Projektabhängigkeiten.
go mod init app
go get github.com/gin-gonic/gin
Nach dem Login kopieren
Projektstruktur
├─ main.go
├─ models
│ └─ product.go
└─ public
└─ index.html
Nach dem Login kopieren
Projektdateien
Produkt.go
Das Produkt ist eine einfache Struktur, die zum Testen von Datei-Uploads in unserer Datei-Upload-API verwendet wird.
package models
type Product struct {
Name string
}
Nach dem Login kopieren
main.go
Diese Datei richtet eine Datei-Upload-API ein. Es wird die minimale Go-Webanwendung erstellt und eingerichtet.
package main
import (
"app/models"
"io"
"net/http"
"os"
"path/filepath"
"github.com/gin-gonic/gin"
"github.com/gin-gonic/gin/binding"
)
func main() {
router := gin.Default()
uploadPath := "./public/uploads"
os.MkdirAll(uploadPath, os.ModePerm)
router.Static("/uploads", uploadPath)
router.StaticFile("/", "./public/index.html")
router.POST("/submit", func(c *gin.Context) {
var product models.Product
if err := c.ShouldBindWith(&product, binding.FormMultipart); err != nil {
c.AbortWithStatusJSON(http.StatusBadRequest, err.Error())
return
}
image, _ := c.FormFile("Image")
filePath := filepath.Join(uploadPath, image.Filename)
src, _ := image.Open()
dst, _ := os.Create(filePath)
io.Copy(dst, src)
c.JSON(http.StatusOK, gin.H{"Name": product.Name, "Image": image.Filename})
})
router.Run()
}
Nach dem Login kopieren
- Initialisiert einen Gin-Router und richtet die statische Dateibereitstellung für das Upload-Verzeichnis und index.html ein.
- Stellt sicher, dass das Verzeichnis ./public/uploads zum Speichern hochgeladener Dateien vorhanden ist.
- Definiert eine POST-Route unter /submit, um Datei-Uploads zu verarbeiten, die Datei auf dem Server zu speichern und den Namen des Produkts und den Namen der hochgeladenen Datei zurückzugeben.
- Startet den Gin-Server, um auf eingehende Anfragen zu warten.
index.html
Dieses HTML-Formular dient dazu, dass Benutzer einen Produktnamen zusammen mit einer zugehörigen Bilddatei hochladen können.
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.3/css/bootstrap.min.css" rel="stylesheet">
<script>
function submitForm() {
let form = document.getElementById('form')
let data = new FormData(form)
fetch('submit', {
method: 'POST',
body: data
}).then(res => {
res.json().then(result => {
let alert = document.getElementById('alert')
alert.children[0].innerText = `Upload success!\nName: ${result.Name}\nImage: ${result.Image}`
alert.children[1].src = `/uploads/${result.Image}`
alert.classList.remove('d-none')
form.reset()
})
})
return false
}
</script>
</head>
<body>
<div class="container">
<div class="row mt-3">
<form id="form" onsubmit="return submitForm()">
<div class="mb-3 col-12">
<label class="form-label" for="name">Name</label>
<input id="name" name="Name" class="form-control form-control-sm" required />
</div>
<div class="mb-3 col-12">
<label class="form-label" for="image">Image</label>
<input type="file" accept="image/*" id="image" name="Image" class="form-control form-control-sm" required />
</div>
</div>
<div class="col-12">
<button class="btn btn-sm btn-primary">Submit</button>
</div>
</form>
<div id="alert" class="alert alert-success mt-3 d-none">
<p></p>
<img id="img" width="200px" />
</div>
</div>
</div>
</body>
</html>
Nach dem Login kopieren
Das Formular wird über eine JavaScript-Funktion (submitForm()) gesendet, die beim Absenden des Formulars ausgelöst wird. Darüber hinaus gibt es einen versteckten Benachrichtigungsbereich, der das hochgeladene Bild und eine Erfolgsmeldung nach erfolgreicher Übermittlung anzeigen kann.
Projekt ausführen
go run main.go
Nach dem Login kopieren
Öffnen Sie den Webbrowser und gehen Sie zu http://localhost:8080
Sie finden diese Testseite.
Testen
Geben Sie den Namen in das Eingabefeld ein und suchen Sie nach einer Datei zum Hochladen.
Klicken Sie auf die Schaltfläche „Senden“, um das Formular abzusenden. Sie sehen dann eine Erfolgsmeldung zusammen mit den von unserer API zurückgegebenen übermittelten Informationen.
Im Wesentlichen optimiert Go mit dem Gin-Framework die Verwaltung von Datei-Uploads in Webanwendungen. Durch die Verwendung eines unkomplizierten Handlers und der Formulareinrichtung können Sie Datei-Uploads effizient verwalten und die Benutzererfahrung in Ihren Projekten verbessern.
Quellcode: https://github.com/stackpuz/Example-File-Upload-Go
Erstellen Sie in wenigen Minuten eine CRUD-Web-App: https://stackpuz.com
Das obige ist der detaillierte Inhalt vonErstellen einer Datei-Upload-API in Go. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
