[FIXED] How to GET base64 image data in Flask from AJAX post request

Issue

main.html:

    var dataURL = canvas.toDataURL('image/jpeg');
    // console.log(dataURL);
    var base64 =  dataURL.replace(/^data:image\/(png|jpeg);base64,/, "");
    // var base64 = getBase64Image(document.getElementById("click-photo"));
    console.log(base64)
  
      
    
      $.ajax({
        url: "http://127.0.0.1:5000/",
        type: "POST",
        // contentType: 'application/json;charset=UTF-8',
        data: { 
          'image': base64
        }
      })
   
  }, 30000);


});

app.py:

@app.route("/", methods=["GET", "POST"])
def index():
    if request.method == "POST":
        text = request.files["image"]
        print(text)

I want to send the base64 image as a post from ajax and get that base64 so I can save the image locally. I am new to python so less expertise.

Solution

Replace request.files with request.form, that will do the work in your case.

@app.route("/", methods=["GET", "POST"])
    def index():
        if request.method == "POST":
            text = request.form["image"]
            print(text)

Answered By - Sahil Tariq