创建HTML5 WYSIWYG：我应该将图像dataURL保存在数据库中吗？

Question

我目前正在使用Google Closure Library编写一个HTML5 WYSIWYG，我正在为用户提供只需将图像文件拖放到带有文本的contenteditable字段即可添加图像。

所以我有两种方法来存储这些图像：

1. 从已删除的文件中检索数据URL，创建IMG标记，将检索到的数据URL设置为此图像的属性SRC的值，并将此IMG标记插入编辑器的字段中。当用户提交表单时，我会将所有检索到的HTML保存在我的MySQL数据库中，并且稍后可以使用图像呈现他的文本。

2. 将已删除的图片上传到我的服务器并将其另存为普通文件。 然后服务器将回答如下： “图片已保存，其网址为http://example.com/images/uploaded-image.png”。 之后，我将执行与项目1类似的步骤（创建一个属性为src =“http://example.com/images/uploaded-image.png”的IMG标记，并将其插入可编辑字段中。）

第一种方式将加载数据库，因为它需要将数据库中的图像dataUrl与文本一起存储。但它使图像添加更加容易和快速，因此它改善了用户的体验。

第二种方式将加载数据库，因为图像将单独存储（在文件系统中），但这种方式需要更多的服务器请求和一些处理器时间在每个图像上添加到WYSIWYG中的文本。此外，它不会立即显示给用户，因此用户需要等待他的图像上传，这将使用户的体验更糟。

我需要帮助，以了解在我考虑所有利弊的情况下哪种方式更为可取。

Answer 1

另一种方式不仅可以存储图像，还可以将完整的HTML与图像存储在一个文件中。并使用数据库存储HTML文件的链接。然后设置Nginx并获得最佳性能。恕我直言，如果您的应用程序是WYSIWYG，那么内容应该在编辑之前在浏览器中完全加载和布局。