在我的一个项目中,我正在使用风元晨jquery裁剪插件进行图像处理。该插件用于在图像处理后将图像下载到本地系统。实际上,我希望将处理后的图像存储到服务器本身,而不是将其下载到本地系统。为此,我需要在文本区域中获取经过处理的图像的URI数据。我必须在插件代码中做什么修改才能生成URI数据而不是下载?
项目中有三个文件,分别名为index.php、cropper.js和main.js
index.php中的下载按钮代码如下:
<div class="btn-group btn-group-crop docs-buttons" style="margin-top:10px;">
<a class="btn btn-primary" data-method="getCroppedCanvas" id="download">Generate your Facebook Cover Photo</a>
</div>
在main.js中生成下载数据的相应jquery代码片段如下:
case 'getCroppedCanvas':
if (result) {
// Bootstrap's Modal
if (!$download.hasClass('disabled')) {
$download.attr("href", result.toDataURL('image/jpeg'));
}
}
此代码中的哪些修改将生成URI数据?
发布于 2016-09-08 18:00:51
这就是样品
dataURI已转换为blob。将其作为blob文件发送,保存在服务器上,然后下载图像DataURI to BLOB
function dataURItoBlob(dataURI) {
var byteString;
if (dataURI.split(',')[0].indexOf('base64') >= 0)
byteString = atob(dataURI.split(',')[1]);
else
byteString = unescape(dataURI.split(',')[1]);
// separate out the mime component
var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0];
// write the bytes of the string to a typed array
var ia = new Uint8Array(byteString.length);
for (var i = 0; i < byteString.length; i++) {
ia[i] = byteString.charCodeAt(i);
}
return new Blob([ia], {type:mimeString});
}
https://stackoverflow.com/questions/39396766
复制相似问题