在編輯器中上傳圖片-最佳方法？

Question

我在我的項目中使用tinymce編輯器。 對於圖像上傳，我將圖像轉換為base64並在編輯器中顯示該圖像。 也就是說，我沒有將任何數據上傳到服務器。 代碼如下。

<Editor
                              initialValue={selectedDocument.html_content}
                              init={{
                                plugins: 'link image code, lists',
                                toolbar: 'undo redo | bold italic | alignleft aligncenter alignright | code | numlist bullist',
                                height: 600,
                                forced_root_block : "",
                                force_br_newlines : true,
                                force_p_newlines : false,
                                images_upload_handler: function (blobInfo, success, failure) {
                                  // no upload, just return the blobInfo.blob() as base64 data
                                  success("data:" + blobInfo.blob().type + ";base64," + blobInfo.base64());
                                },
                                setup: function(editor) {
                                  me.tinyMce = editor;
                                }
                              }}
                              onChange={this.handleEditorChange}
                            />

我只是想知道這是否是正確的方法。 這種方法有什么缺點嗎？

還是應該將圖像上傳到服務器並使用圖像URL？

思考？

Answer 1

您應將圖像分別上傳到服務器，並用服務器返回的URL替換base64圖像字符串。

為什么？

1. base64圖像很大。 如果您有其中的幾個，則會降低編輯器和應用程序的性能。 將圖像添加到編輯器時，您會遇到延遲。

2. 因為base64圖像只是純字符串。 當您上傳它們時，您的帖子正文將變得巨大。 如果您沒有正確配置服務器，則可能會導致API失敗。

3. 僅保存RichText HTML對您的數據庫而言意義重大。 如果向其中添加base64圖像字符串。 您的數據庫也將遭受處理此類數據的困擾。