js base64 转成图片上传
直接上代码,要点就是把base64转成Blob,添加到FormData传递给后台程序,跟选择图片文件上传时一样的了。
var dataurl = canvas.toDataURL('image/png'); //base64图片数据
var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
while(n--){
u8arr[n] = bstr.charCodeAt(n);
}
var obj = new Blob([u8arr], {type:mime});
var fd = new FormData();
fd.append("upfile", obj,"image.png");
$.ajax({
url: "/file/upfile",
type: "POST",
processData: false,
contentType: false,
data: fd,
success: function (data) {
console.log(data);
}
});
//canvas保存图片到本地
(function(t){
var dlLink = t || document.createElement("a");
if(!t){
dlLink.id='dlLink';
dlLink.download = '文件名';
document.body.appendChild(dlLink);
}
dlLink.href = dataurl;
dlLink.click();
})(document.querySelector("#dlLink"));
js base64 转成图片上传的更多相关文章
- base64格式的图片上传阿里云
base64格式的图片上传阿里云 上传图片的时候,除了普通的图片上传,还有一张图片信息是以base64格式发送到后台的. 后台接受base64格式的图片,上传至阿里云代码:(主要是将base64转化成 ...
- Kindeditor JS 富文本编辑器图片上传指定路径
js //================== KindEditor.ready(function (K) { var hotelid = $("#hotelid").val(); ...
- Js 之移动端图片上传插件mbUploadify
一.下载 https://pan.baidu.com/s/1NEL4tkHoK4ydqdMi_hgWcw 提取码:vx7e 二.Demo示例 <div class="weui_uplo ...
- 如何把base64格式的图片上传到到阿里云oss c#版
今天碰到需要把canvas上的的图片转存到阿里云oss,于是百度了半天,一个能打的答案都没有.怒了,自己搞起. 代码超级简单,需要先引入nuget 中啊里云的oss api 1 byte[] arr ...
- js Base64 转化成图片格式
function dataURLtoFile(dataurl, filename = 'file') { let arr = dataurl.split(',') let mime = arr[0]. ...
- PHP多图片上传实例demo
upload.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/ ...
- 图片上传本地预览。兼容IE7+
基于JQUERY扩展,图片上传预览插件 目前兼容浏览器(IE 谷歌 火狐) 不支持safari 预览地址:http://www.jinbanmen.com/test/1.html js代码:/**名称 ...
- asp.net 百度编辑器 UEditor 上传图片 图片上传配置 编辑器配置 网络连接错误,请检查配置后重试
1.配置ueditor/editor_config.js文件,将 //图片上传配置区 ,imageUrl:URL+"net/imageUp.ashx" //图片上传提交地址 ,im ...
- jQuery图片上传前先在本地预览
js代码: /* *名称:图片上传本地预览插件 v1.1 *作者:周祥 *时间:2013年11月26日 *介绍:基于JQUERY扩展,图片上传预览插件 目前兼容浏览器(IE 谷歌 火狐) 不支持saf ...
随机推荐
- Django小项目简单BBS论坛
开发一个简单的BBS论坛 项目需求: 1 整体参考"抽屉新热榜" + "虎嗅网" 2 实现不同论坛版块 3 帖子列表展示 4 帖子评论数.点赞数展示 5 在线用 ...
- Which adidas NMD Singapore is your favorite
The adidas NMD Singapore just keeps the hits coming this fall with another change that's sure to bec ...
- tp模板基础
目录简介 创建应用 在项目目录创建入口文件shop/index.php 创建虚拟主机,访问应 路由形式 路由: 系统从URL参数中分析出当前请求的分组.控制器.和操作的过程就是“路由”. Tp框架路由 ...
- java之标记型接口Cloneable
1.克隆用途. Cloneable和Serializable一样都是标记型接口,它们内部都没有方法和属性,implements Cloneable表示该对象能被克隆,能使用Object.clone() ...
- WebCollector2.7爬虫框架——在Eclipse项目中配置
WebCollector2.7爬虫框架——在Eclipse项目中配置 在Eclipse项目中使用WebCollector爬虫非常简单,不需要任何其他的配置,只需要导入相关的jar包即可. Netbea ...
- UVaLive4992:Jungle Outpost
传送门 半平面交. 首先,由显然成立法可以证明炸连续的几个总比分散火力效果更佳. 所以二分答案,转化为判定问题,即间隔$ans$个点的连线的半平面交是否为空. 半平面交判定即可. 时间复杂度:$O(N ...
- 20145118 《Java程序设计》第1周学习总结
20145118 <Java程序设计>第1周学习总结 教材学习内容总结 由于寒假在家已经安装了java开发工具,所以安装过程在这里不再赘述.这一周我开始了Java初学阶段,从Java的历史 ...
- POJ 3660 Cow ContestCow(Floyd传递闭包)题解
题意:给出m个关系,问你能确定机头牛的排名 思路:要确定排名那必须要把他和其他n-1头牛比过才行,所以Floyd传递闭包,如果赢的+输的有n-1就能确定排名. 代码: #include<cstd ...
- Thread.Start和Delegate.BeginInvoke 以及Control.BeginInvoke
Thread.Start starts a new OS thread to execute the delegate. When the delegate returns, the thread i ...
- Codeforces Round #390 (Div. 2) A. Lesha and array splitting
http://codeforces.com/contest/754/problem/A 题意: 给出一串序列,现在要把这串序列分成多个序列,使得每一个序列的sum都不为0. 思路: 先统计一下不为0的 ...