[Python] how to read multipart/form-data in flask [duplicate]

I'm having trouble reading data in flask that is posted via XMLHttpRequest. I'm using this jquery plugin to crop the image and upload to server

https://codecanyon.net/item/slim-im...-uploading-and-ratio-cropping-plugin/16364167

data - information about the image is collected and coverted in json before sending it to server using XMLHttpRequest

var formData = new FormData();
var name = "ex"; // Just an example
formData.append(name, JSON.stringify(data));
var xhr = new XMLHttpRequest();
xhr.open('POST', url, true);
xhr.send(formData);


In my flask code, I print the header of request to see the content type

print(request.headers)


And I see this

Accept-Encoding: gzip, deflate
Accept-Language: en-US,en;q=0.8,sv;q=0.6,fr;q=0.4
Host: localhost:5000
Content-Type: multipart/form-data; boundary=----WebKitFormBoundary5e7lMMIQavXzSZg9
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/53.0.2785.143 Safari/537.36
Connection: keep-alive
Content-Length: 62714
Origin: http://localhost:5000
Pragma: no-cache
Cache-Control: no-cache
Cookie: session=eyJfZnJlc2giOmZhbHNlLCJjc3JmX3Rva2VuIjoiYTJhNTNlYzRkYjZlYzgzNzM2NDQ1ZjM5ZDAxNmY0MTlmY2RiZmRiOCIsInVzZXJuYW1lIjoidXNlcjEifQ.Cv2ADg.d8chDgzAA7fS2P9KcwzRINvLGOU
Referer: http://localhost:5000/loadProfile
Accept: */*


I cannot read the content using

request.get_json()
​

If I try this

print(request.get_json())
data = request.get_json()
print(data['name'])


TypeError: 'NoneType' object is not subscriptable

In HTTP post request I can see this

------WebKitFormBoundary0okhJV9YZK0uArTm Content-Disposition: form-data; name="slim[]" {"server":[{"status":"SUCCESS"}],"meta":{},"input":{"name":"sample-img.jpg","type":"image/jpeg","size":41319,"width":400,"height":300},"output":{"width":400,"height":300,"image":"data:image/jpeg;base64,/9j/.......
​

According to the author

Slim sends data in JSON format (containing base64 encoded images) using a POST request.

Format:

{
"server":null,
"meta":{

},
"input":{
"name":"stars.jpg",
"type":"image/jpeg",
"size":null,
"width":800,
"height":1200
},
"output":{
"width":150,
"height":100,
"image":"data:image/jpeg;base64..."
},
"actions":{
"rotation":0,
"crop":{
"x":0,
"y":333.33333333333337,
"width":150,
"height":100.10460251046025,
"type":"manual"
},
"size":null
}
}


If I do

print(request.form)


I can see

ImmutableMultiDict([('slim[]', '{"server":[{"status":"SUCCESS"}],"meta":{},"input":{"name":"sample-img.jpg","type":"image/jpeg","size":41319,"width":400,"height":300},"output":{"width":400,"height":300,"image":"data:image/jpeg;base64,/9j/4AAQ....

But I'm not sure how to read this post data. For e.g get value of name

Continue reading...