file-server example: add upload using javascript button

Former-commit-id: caaec95388e691c2db27a55e649c758f93ab537c
This commit is contained in:
Gerasimos (Makis) Maropoulos 2020-07-05 15:12:19 +03:00
parent 57dc64625d
commit bdfe8de66d
2 changed files with 34 additions and 7 deletions

View File

@ -20,6 +20,8 @@ func init() {
func main() {
app := iris.New()
app.RegisterView(iris.HTML("./views", ".html"))
// Serve assets (e.g. javascript, css).
// app.HandleDir("/public", "./public")
app.Get("/", index)
@ -47,10 +49,14 @@ func uploadView(ctx iris.Context) {
ctx.View("upload.html", token)
}
const maxSize = 10 * iris.MB
func upload(ctx iris.Context) {
ctx.SetMaxRequestBodySize(maxSize)
_, err := ctx.UploadFormFiles("./uploads", beforeSave)
if err != nil {
ctx.StopWithError(iris.StatusInternalServerError, err)
ctx.StopWithError(iris.StatusPayloadTooRage, err)
return
}

View File

@ -1,17 +1,38 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Upload Files</title>
</head>
<body>
<form enctype="multipart/form-data"
action="/upload" method="POST">
<input type="file" name="uploadfile" multiple/> <input type="hidden"
name="token" value="{{.}}" />
<input type="submit" value="upload" />
<form enctype="multipart/form-data" action="/upload" method="POST">
<input type="file" id="upload_files" name="upload_files" multiple /> <input type="hidden" name="token"
value="{{.}}" />
<input type="button" value="Upload Using Javascript" onclick="uploadFiles()" />
<input type="submit" value="Upload by submiting the form" />
</form>
<script type="text/javascript">
function uploadFiles() {
let files = document.getElementById("upload_files").files;
let formData = new FormData();
for (var i = 0; i < files.length; i++) {
formData.append("files[]", files[i]);
}
fetch('/upload',
{
method: "POST",
body: formData
}).
then(data => window.location = "/files").
catch(e => window.alert("upload failed: file too large"));
}
</script>
</body>
</html>