Unable to get request.FILES django

Question

I am trying to upload a text file to my django backend, but my request.FILES is always empty.

I am using axios to send the file and have followed the django requirement to have 'multipart/form-data' as content type of the request.

What am I missing?

On my app.js I send a post request via:

new Vue({
    el: '#app',
    data: {
        reqtype: '',
        uploadedFile: '',
    },
    methods: {
        onSubmit(event) {
            this.submitLoading = true;
            if (! this.validateForm(this)) {
                event.preventDefault();
                this.submitLoading = false;
                return;
            }
            var formData = new FormData();
            formData.append("reqtype", this.reqtype)
            formData.append('fileToUpload', this.uploadedFile)
            axios.post('/sreqtool/tc/', formData, {
                headers: {
                    'Content-Type': 'multipart/form-data'
                }
            })
        },
        onFileChange(e) {
            var files = e.target.files || e.dataTransfer.files;
            if (!files.length)
                return;

            var reader = new FileReader();
            var vm = this;

            reader.onload = (e) => {
                vm.uploadedFile = e.target.result;
            };

            reader.readAsDataURL(files[0]);
        }
    },
}

On the network request payload:

------WebKitFormBoundarymAnl54hGVTifZzwM Content-Disposition: form-data; name="reqtype"

filebased

------WebKitFormBoundarymAnl54hGVTifZzwM Content-Disposition: form-data; name="fileToUpload"

data:text/plain;base64,OTA1NTIzMzg2NQ0KOTE3NTAwMTU0Mg0KOTc3NDczNjcyNg0KMTIzNTQ2ODQ1Ng== ------WebKitFormBoundarymAnl54hGVTifZzwM--

In my views.py I have:

@csrf_exempt
def index(request):
    if request.method == 'POST':
        DLOG.info(request.POST)
        DLOG.info(request.FILES)
        form = ExtractForm(request.POST, request.FILES)

        if form.is_valid():
            res = QueryManager.processRequest(request.user, form.cleaned_data)

DLOG is my logger and the output of the dlog is:

[2017-12-18 16:51:06,510] INFO views index: <QueryDict: {u'fileToUpload': [u'data:text/plain;base64,OTA1NTIzMzg2NQ0KOTE3NTAwMTU0Mg0KOTc3NDczNjcyNg0KMT
IzNTQ2ODQ1Ng=='], u'reqtype': [u'filebased']}>
[2017-12-18 16:51:06,512] INFO views index: <MultiValueDict: {}>

What is that JS function a part of? ie what is `this`? You probably need to get the actual file from the input element, something like `this.uploadedFile.files[0]`. — Daniel Roseman, Dec 18 '17 at 09:21
Its part of a vue object. I updated the code snippet to include the vue instantiation. — Juan Cornejo, Dec 18 '17 at 09:43
you are trying to save base64 image. read this:https://stackoverflow.com/questions/39576174/save-base64-image-in-django-file-field — Farrukh, Dec 18 '17 at 09:46

score 0 · Answer 1 · answered Dec 18 '17 at 10:10

0

it says your image encoded to base64

{u'fileToUpload': [u'data:text/plain;base64,OTA1NTIzMzg2NQ0KOTE3NTAwMT...

answered Dec 18 '17 at 10:10

Farrukh

88
6

score 0 · Answer 2 · answered Dec 18 '17 at 10:58

I am able to read the file content now.

I used the link from Farrukh's comment a stackoverflow answer

Code is updated to:

@csrf_exempt
def index(request):
    if request.method == 'POST':
        form = ExtractForm(request.POST, request.FILES)
    if form.is_valid():
        res = QueryManager.processRequest(request.user, form.cleaned_data)
        format, imgstr = data.split(';base64,') 
        ext = format.split('/')[-1] 
        data = ContentFile(base64.b64decode(imgstr), name='temp.' + ext)
        filetext = data.read()

filetext contains the string I need from the file.

Unable to get request.FILES django

2 Answers2