使用AJAX的Golang上传文件

Question

This question already has an answer here:

• Sending multipart/formdata with jQuery.ajax 13 answers

I currently have the following JavaScript code

<script>
    $(document).ready(function() {
        $('#preview').click(function() {
            var file = document.getElementById("widget-file").files[0];
            var fr = new FileReader();
            fr.readAsArrayBuffer(file);
            fr.onload = function() {
                $.post("/admin/snact/info", {
                    "file": fr.result,
                    "name": "test"
                }).done(function(data) {
                    console.log(data)
                });
            }
        });
    });
</script>

I want to process the file on the server-side and return some nice information but I have no idea how to access the file as a binary one (the file is binary)

Trying that js code I can access the property name without problems but the property file will give me nothing

...
INFO.Println(c.Request.FormValue("file"), c.Request.FormValue("name"))
...

What I am missing here? There is readAsBinary for the FileReader class but it says its under development

I tried the following js code

<script>
    $(document).ready(function() {
        $('#preview').click(function() {
            var file = document.getElementById("widget-file").files[0];
            var fr = new FileReader();
            fr.readAsArrayBuffer(file);
            fr.onload = function() {
                var fd = new FormData();
                fd.append("file", fr.result);
                fd.append("name", "test");
                $.ajax({
                    url: "/admin/snact/info",
                    data: fd,
                    processData: false,
                    contentType: "multipart/form-data",
                    type: "POST"
                }).done(function(data) {
                    console.log(data)
                });
            }
        });
    });
</script>

And on the Go side I will try to load the file with

INFO.Println(c.Request.FormFile("file"))

But I am getting this error

no multipart boundary param in Content-Type

</div>

Answer 1

Few exercises for you:

1. Parse multipart form: c.Request..ParseMultipartForm(32 << 20)
2. Change AJAX request a bit:

data.append('file', file);
// ...
$.ajax({
//...
    contentType: false,
    processData: false,