我可以考虑通过两种方式做到这一点：
1。
将文件存储在文件系统中的任何目录中（例如
dir1）并重命名，以确保每个文件的名称都是唯一的（可能是时间戳记）（例如
xyz123.jpg），然后将该名称存储在某些数据库中。然后，在生成JSON的同时，您提取此文件名并生成完整的URL（将为
http://example.com/dir1/xyz123.png）并将其插入JSON中。
2。
base
64编码，基本上是一种以ASCII文本编码任意二进制数据的方式。每3个字节的数据需要4个字符，最后可能还要填充一点。基本上，输入的每6位均以64个字符的字母编码。“标准”字母使用AZ，az，0-9和+和/，并带有=作为填充字符。有URL安全变体。因此，这种方法将允许您将图像直接放入MongoDB中，同时将其存储在图像中并在获取图像时进行解码，但是它也有一些缺点：
- base64编码使文件大小比原始二进制表示大33％，这意味着在线传输更多数据（在移动网络上这可能会非常痛苦）
- IE6或IE7不支持数据URI。
- 与二进制数据相比，base64编码的数据可能需要更长的处理时间。
资源
将图像转换为DATA URI
A.）画布
将图像加载到图像对象中，将其绘制到画布上，然后将画布转换回dataURL。
function convertToDataURLviaCanvas(url, callback, outputFormat){ var img = new Image(); img.crossOrigin = 'Anonymous'; img.onload = function(){ var canvas = document.createElement('CANVAS'); var ctx = canvas.getContext('2d'); var dataURL; canvas.height = this.height; canvas.width = this.width; ctx.drawImage(this, 0, 0); dataURL = canvas.toDataURL(outputFormat); callback(dataURL); canvas = null; }; img.src = url;}用法
convertToDataURLviaCanvas('http://bit.ly/18g0VNp', function(base64Img){ // base64DataURL});支持的输入格式
image/png，
image/jpeg，
image/jpg，
image/gif，
image/bmp，
image/tiff，
image/x-icon，
image/svg+xml，
image/webp，
image/xxx
B.）FileReader
通过XMLHttpRequest将图像加载为Blob，然后使用FileReader API将其转换为数据URL。
function convertFileTobase64viaFileReader(url, callback){ var xhr = new XMLHttpRequest(); xhr.responseType = 'blob'; xhr.onload = function() { var reader = new FileReader(); reader.onloadend = function () { callback(reader.result); } reader.readAsDataURL(xhr.response); }; xhr.open('GET', url); xhr.send();}这种方法
- 缺乏浏览器支持
- 有更好的压缩
- 也适用于其他文件类型。
用法
convertFileTobase64viaFileReader('http://bit.ly/18g0VNp', function(base64Img){ // base64DataURL});
