通过Ajax将图像和文本数据上传到Flask服务器

Question

我想将图像和文本数据上传到我的烧瓶服务器。我们如何发送。 我的HTML代码

<form id="upload-file" method="post" enctype="multipart/form-data">
                            <button type="button" class="btn btn-success" >
                                <label for="imageUpload" style="font-size: 1rem; line-height: 1.5; font-weight: normal; margin-top: 9px;" >
                                    Choose Photo...
                                </label>
                            </button>
                            <input type="file" id="imageUpload" name="image" accept=".png, .jpg, .jpeg">
                            <input type="text" id="imageUpload" name="i1" >
                            <input type="text" id="imageUpload" name="i2" >
                        </form>

JavaScript和ajax代码

$('#btn-predict').click(function () {
        var form_data = new FormData(document.getElementById('upload-file'));
        $.ajax({
            type: 'POST',
            url: 'http://127.0.0.1:5000/predict',
            data: form_data,
            contentType: false,
            cache: false,
            processData: false,
            async: true,
            success: function (data) {
                console.log('Success1');
            },
        });
    });

我的Flask服务器代码

@app.route('/predict', methods=['GET', 'POST'])
def upload():
    if request.method == "POST":

        if request.files:
            output={}
            image = request.files["image"]
            print(request.files)
            basepath = os.path.dirname(__file__)
            file_path = os.path.join(
            basepath, 'uploads', secure_filename(image.filename))
            image.save(file_path)
            print(file_path)
            # Make prediction
            model = load_model(model_path)
            model.load_weights(model_weight)
            preds = model_predict(file_path, model)

            return str(preds)

    return render_template('AboutUs.html')

我知道如何发送图像，但在上述情况下，我想发送带有图像的文本数据。