reactjs - 使用 TinyMCE 将图像上传到后端

Question

我正在尝试将富文本编辑器 TinyMCE 用于我目前正在开发的博客平台。我也在使用带有 Flask 后端的 React。用户应该能够使用编辑器创建博客条目并使用/上传图像。我已经完成了所有设置，但我不知道如何将图像存储在我的后端，这样你就可以保存一个包含所有内容的博客。我从他们的文档中得到了这个回调函数，但我真的不明白那里发生了什么，以及是否足以将文件对象发送到我的后端并将其存储在数据库中。

       file_picker_callback: function (cb, value, meta) {
                var input = document.createElement("input");
                input.setAttribute("type", "file");
                input.setAttribute("accept", "image/png , image/jpg");

                input.onchange = function () {
                  var file = this.files[0];

                  var reader = new FileReader();
                  reader.onload = function () {
                    var id = "blobid" + new Date().getTime();
                    var blobCache =
                      window.tinymce.activeEditor.editorUpload.blobCache;
                    var base64 = reader.result.split(",")[1];
                    var blobInfo = blobCache.create(id, file, base64);
                    blobCache.add(blobInfo);

                    /* call the callback and populate the Title field with the file name */
                    cb(blobInfo.blobUri(), { title: file.name });
                  };
                  reader.readAsDataURL(file);
                  console.log(file);
                };

这是 console.log(file) 输出

File {name: "wlogLogo.png", lastModified: 1590578382000, webkitRelativePath: "", size: 4591, type: "image/png", …}

标签： reactjsimageflasktinymceblob