Html 用Summernote烧瓶，并添加一个图像捕捉正确的数据？

所以我试图通过summernote textarea获取被抓取的信息。当我没有添加图像时，一切都很好，我可以从文本编辑器中看到html内容。 但是当我上传一张图片时，它突然陷入了一个循环中？？？还有更多的功能可以将信息添加到数据库中，并保存带有可笑的img src的图像，但是出于某种原因，它会反复迭代img src吗？从那时起，我把所有的评论都写出来了，只打印文本字段内容，而且出于某种原因，当我点击submit按钮时，仍然会被一个无休止的循环所击中？谢谢你的帮助

烧瓶

 @app.route("/update", methods=["POST"])
    def update():
    # Grab Text editor content from form:
    contentInfo = request.form["content"]

    print("TEST HERE", contentInfo)

html:

HTML中的内联javascript：

$(document).ready(function() {
        $('#summernote').summernote({
            height: 300,
            focus: true,
            callbacks: {
                onImageUpload(files) {
                  sendFile(files[0], data => {
                    let imgNode = document.createElement("img");
                    imgNode.setAttribute('src', data.url)
                    $(this).summernote('insertNode', imgNode);
                  })
                }
              }
            });
        });
 var sendFile = function(file, callback) {
                    var data;
                    data = new FormData();
                    data.append("file", file);
                    return $.ajax({
                      url: "/updateTest",
                      data: data,
                      cache: false,
                      contentType: false,
                      processData: false,
                      type: 'POST',
                      success: function(data) {
                        return callback(data);
                      }
                    });
                  };

---

关于如何正确提取此文件/图像数据的任何帮助都是我现在需要的。非常感谢您的帮助，谢谢，所以我终于找到了答案。这是正确的代码。现在，我原本想让它与S3 bucket一起工作，因此，在最后，我会立即转到这条路线，而不是处理summernote尝试进行的糟糕转换，我建议其他人在遇到类似情况时也这样做：

html:

内容{{value}

html中的内联javascript：

<script>
    $(document).ready(function() {
    $('#summernote').summernote({
        height: 300,
        minHeight: null,
        maxHeight: null,
        focus: true,
        onImageUpload: function(files, editor, welEditable) {
            sendFile(files[0],editor,welEditable);
        }
        });
    });
</script>

<style>
$(document).ready(function() {
        $('#summernote').summernote({
            height: 300,
            focus: true,
            callbacks: {
                onImageUpload(files) {
                  sendFile(files[0], data => {
                    let imgNode = document.createElement("img");
                    imgNode.setAttribute('src', data.url)
                    $(this).summernote('insertNode', imgNode);
                  })
                }
              }
            });
        });
                   var sendFile = function(file, callback) {
                    var data;
                    data = new FormData();
                    data.append("file", file);
                    return $.ajax({
                      url: "/addImgSummer",
                      data: data,
                      cache: false,
                      contentType: false,
                      processData: false,
                      type: 'POST',
                      success: function(data) {
                        return callback(data);
                      }
                    });
                  };
</style>

$（文档）.ready（函数（）{
$（'#summernote'）。summernote({
身高：300，
焦点：对，
回调：{
onImageUpload（文件）{
sendFile（文件[0]，数据=>{
让imgNode=document.createElement（“img”）；
setAttribute（'src'，data.url）
$（this.summernote（'insertNode'，imgNode）；
})
}
}
});
});
var sendFile=函数（文件，回调）{
var数据；
数据=新表单数据（）；
数据。追加（“文件”，文件）；
返回$.ajax({
url:“/addImgSummer”，
数据：数据，
cache:false，
contentType:false，
processData:false，
键入：“POST”，
成功：功能（数据）{
返回回调（数据）；
}
});
};

flask.py：

 @app.route("/updateTest", methods=["POST"])
def updateTest():
    content = request.get_data()
    print("test here", type(content))
    print("test here2", len(content))

@app.route("/addImgSummer", methods=["POST"])
def addImgSummer():
    #Grabbing file:
    img = request.files["file"]    #<------ THIS LINE RIGHT HERE! Is #literally all I needed lol.

    # Below is me replacing the img "src" with my S3 bucket link attached, with the said filename that was added. 
    imgURL = "https://"+ S3_BUCKET_NAME +".s3.amazonaws.com/images/"+ img.filename

    return jsonify(url = imgURL)

@app.route（“/addimgsumer”，methods=[“POST”]）
def addImgSummer（）：
#抓取文件：
img=request.files[“file”]#
<form action="/updateTest" method="POST">
 <h1 style="text-align:center">content</h1><textarea name=content id="summernote">{{value}</textarea>
 <input class="input-btn" type="submit" value="Update">

<style>
$(document).ready(function() {
        $('#summernote').summernote({
            height: 300,
            focus: true,
            callbacks: {
                onImageUpload(files) {
                  sendFile(files[0], data => {
                    let imgNode = document.createElement("img");
                    imgNode.setAttribute('src', data.url)
                    $(this).summernote('insertNode', imgNode);
                  })
                }
              }
            });
        });
                   var sendFile = function(file, callback) {
                    var data;
                    data = new FormData();
                    data.append("file", file);
                    return $.ajax({
                      url: "/addImgSummer",
                      data: data,
                      cache: false,
                      contentType: false,
                      processData: false,
                      type: 'POST',
                      success: function(data) {
                        return callback(data);
                      }
                    });
                  };
</style>

@app.route("/addImgSummer", methods=["POST"])
def addImgSummer():
    #Grabbing file:
    img = request.files["file"]    #<------ THIS LINE RIGHT HERE! Is #literally all I needed lol.

    # Below is me replacing the img "src" with my S3 bucket link attached, with the said filename that was added. 
    imgURL = "https://"+ S3_BUCKET_NAME +".s3.amazonaws.com/images/"+ img.filename

    return jsonify(url = imgURL)