from flask import Flask

UPLOAD_FOLDER = 'C:/uploads'

app = Flask(__name__)

app.secret_key = "secret key"

app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER

app.config['MAX_CONTENT_LENGTH'] = 16 * 1024 * 1024

import os

import urllib.request

from app import app

from flask import Flask, flash, request, redirect, render_template, jsonify

from werkzeug.utils import secure_filename

ALLOWED_EXTENSIONS = set(['txt', 'pdf', 'png', 'jpg', 'jpeg', 'gif'])

def allowed_file(filename):

return '.' in filename and filename.rsplit('.', 1)[1].lower() in ALLOWED_EXTENSIONS

def upload_form():

return render_template('file-upload.html')

def upload_file():

# check if the post request has the file part

if 'files[]' not in request.files:

resp = jsonify({'message' : 'No file part in the request'})

resp.status_code = 400

return resp

files = request.files.getlist('files[]')

errors = {}

success = False

for file in files:

if file and allowed_file(file.filename):

filename = secure_filename(file.filename)

file.save(os.path.join(app.config['UPLOAD_FOLDER'], filename))

success = True

else:

errors[file.filename] = 'File type is not allowed'

if success and errors:

errors['message'] = 'File(s) successfully uploaded'

resp = jsonify(errors)

resp.status_code = 206

return resp

if success:

resp = jsonify({'message' : 'Files successfully uploaded'})

resp.status_code = 201

return resp

else:

resp = jsonify(errors)

resp.status_code = 400

return resp

if __name__ == "__main__":

app.run()

You can go through the tutorial https://www.roytuts.com/ajax-files-upload-using-python-flask-jquery/

<title>Python Flask File(s) Upload Example</title>

<script type="text/javascript" src="https://code.jquery.com/jquery-3.4.1.min.js"></script>

<script type="text/javascript">

$(document).ready(function (e) {

$('#upload').on('click', function () {

var form_data = new FormData();

var ins = document.getElementById('multiFiles').files.length;

if(ins == 0) {

$('#msg').html('<span style="color:red">Select at least one file</span>');

return;

}

for (var x = 0; x < ins; x++) {

form_data.append("files[]", document.getElementById('multiFiles').files[x]);

}

$.ajax({

url: 'python-flask-files-upload', // point to server-side URL

dataType: 'json', // what to expect back from server

cache: false,

contentType: false,

processData: false,

data: form_data,

type: 'post',

success: function (response) { // display success response

$('#msg').html('');

$.each(response, function (key, data) {

if(key !== 'message') {

$('#msg').append(key + ' -> ' + data + '<br/>');

} else {

$('#msg').append(data + '<br/>');

}

})

},

error: function (response) {

$('#msg').html(response.message); // display error response

}

});

});

});

</script>

<h2>Python Flask File(s) Upload - Select file(s) to upload</h2>

<dl>

<p>

<p id="msg"></p>

<input type="file" id="multiFiles" name="files[]" multiple="multiple"/>

<button id="upload">Upload</button>

</p>

</dl>