I am trying to send the content of a form data through AJAX to a python-flask application. Here the basic parts of the Javascript code
function sendFormInfo(){
var formInfo = document.getElementById('formInfo');
var elems = formInfo.elements;
return new Promise(function(resolve, reject) {
var getFd = toFormFromElems(elems);
getFd
.then(function(fd){
fd.set('my_key', 'my_value')
inspectFormData(fd);
var timestamp = (new Date()).getTime();
$.ajax({
url: "/updategame" + '?_=' + timestamp,
type : "POST",
processData: false,
contentType: false,
dataType: "text",
data : fd
})
.done(function(respPost) {
resolve(respPost)
})
.fail(function(data) {
console.log("Post request failed.")
console.log(data);
});
})
})
}
function inspectFormData(inputFormData){
for(var pair of inputFormData.entries()) {
console.log(pair[0]+ '-> '+ pair[1]);
}
}
function toFormFromElems(elems){
return new Promise(function(resolve, reject){
var fd = new FormData();
for (var i = 0, elem; elem = elems[i++];){
// console.log(elem.id + " -> " + elem.value);
fd.set(String(elem.id), String(elem.value));
}
// console.log(fd);
resolve(fd);
})
}
and of the python one:
@main.route("/updategame", methods=["POST"])
@login_required
def update_game():
print(request.files)
print(request.files.keys())
return "success"
It seems to me that I can correctly fill the form data:
but I get an empty dict at the python endpoint:
while a very very (yes, double very) similar approach has proven to work already, but when sending a video instead (Send image from canvas, and wait for AJAX POST response)
Does anyone have any suggestion? I already tried putting a cache breaker to the request.