js中将文件的base64转换成file并上传到服务器
**
* @param base64Codes
* 图片的base64编码
*/
function sumitImageFile(base64Codes){
var form=document.forms[0]; var formData = new FormData(form); //这里连带form里的其他参数也一起提交了,如果不需要提交其他参数可以直接FormData无参数的构造函数 //convertBase64UrlToBlob函数是将base64编码转换为Blob
formData.append("imageName",convertBase64UrlToBlob(base64Codes)); //append函数的第一个参数是后台获取数据的参数名,和html标签的input的name属性功能相同 //ajax 提交form
$.ajax({
url : form.action,
type : "POST",
data : formData,
dataType:"text",
processData : false, // 告诉jQuery不要去处理发送的数据
contentType : false, // 告诉jQuery不要去设置Content-Type请求头 success:function(data){
window.location.href="${ctx}"+data;
},
xhr:function(){ //在jquery函数中直接使用ajax的XMLHttpRequest对象
var xhr = new XMLHttpRequest(); xhr.upload.addEventListener("progress", function(evt){
if (evt.lengthComputable) {
var percentComplete = Math.round(evt.loaded * 100 / evt.total);
console.log("正在提交."+percentComplete.toString() + '%'); //在控制台打印上传进度
}
}, false); return xhr;
} });
} /**
* 将以base64的图片url数据转换为Blob
* @param urlData
* 用url方式表示的base64图片数据
*/
function convertBase64UrlToBlob(urlData){ var bytes=window.atob(urlData.split(',')[1]); //去掉url的头,并转换为byte //处理异常,将ascii码小于0的转换为大于0
var ab = new ArrayBuffer(bytes.length);
var ia = new Uint8Array(ab);
for (var i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i);
} return new Blob( [ab] , {type : 'image/png'});
}
js中将文件的base64转换成file并上传到服务器的更多相关文章
- ios开发-将false和true,当做字典的值,并将字典转成字符串,上传到服务器
今天遇到一个需求,将false和true,当做字典的值,并将字典转成字符串,上传到服务器. 可能这个需求大家遇到过,大部分原因是安卓的同事已经按这样的需求开发完了.我们只能跟随安卓的脚步了. (一)处 ...
- PHP后端代码生成微信小程序带参数的二维码保存成jpg图片上传到服务器getwxacodeunlimit
老板最近有点飘了,他要在PC端的网站放一个微信小程序的二维码,并且扫描这个二维码以后要跳到小程序对应的房源详情页. 这是微信官方给出的文档,连接地址:https://developers.weixin ...
- HTML5 文件域+FileReader 分段读取文件并上传到服务器(六)
说明:使用Ajax方式上传,文件不能过大,最好小于三四百兆,因为过多的连续Ajax请求会使后台崩溃,获取InputStream中数据会为空,尤其在Google浏览器测试过程中. 1.简单分段读取文件为 ...
- java文件上传到服务器
最近项目中使用到了文件从本地到服务器的功能.其实是为了解决目前浏览器不支持获取本地文件全路径.不得已而想到上传到服务器的固定目录,从而方便项目获取文件,进而使程序支持EXCEL批量导入数据. 在前台界 ...
- c#将本地文件上传至服务器(内网)
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...
- 使用canvas给图片添加水印, canvas转换base64,,canvas,图片,base64等转换成二进制文档流的方法,并将合成的图片上传到服务器,
一,前端合成带水印的图片 一般来说,生成带水印的图片由后端生成,但不乏有时候需要前端来处理.当然,前端处理图片一般不建议,一方面js的处理图片的方法不全,二是有些老版本的浏览器对canvas的支持度不 ...
- JS中将JSON的字符串解析成JSON数据格式《转》
在JS中将JSON的字符串解析成JSON数据格式,一般有两种方式: 1.一种为使用eval()函数. 2. 使用Function对象来进行返回解析. 使用eval函数来解析,并且使用jquery的ea ...
- js中把JSON字符串转换成JSON对象最好的方法
在JS中将JSON的字符串解析成JSON数据格式,一般有两种方式: 1.一种为使用eval()函数. 2. 使用Function对象来进行返回解析. 第一种解析方式:使用eval函数来解析,并且使用j ...
- Linux下dos2unix命令将windows文件编码格式dos转换成Unix格式
问题描述: 在Windows系统下面使用文本编辑器notepad后传到Linux系统下的话 Linux下处理和执行一般都存在一些问题,我们可以通过命令查看文件是否是dos格式的, 如果有如图所示的M标 ...
随机推荐
- CMake 基本用法--写CMakeList.txt
http://techbase.kde.org/Development/Tutorials/CMake_(zh_CN) http://www.cmake.org/Wiki/CMake 这一章将从软件开 ...
- tomcat在线部署且查看堆栈状态
配合ab压测tomcat站点的并发量,适当调整JVM参数,堆栈,连接数 00.修改conf/tomcat-user.xml 1. 在$Tomcat_Home/conf/tomcat-users.xml ...
- Android Listview 隐藏滚动条
在<ListView>标签中设置属性. android:fastScrollEnabled="false" 以下属性scrollbars可以设置为none也可以不设置为 ...
- 【laravel5.4】使用baum\node 类库实现无限极分类
1.在model中引入baum\node 类库,并继承,具体参考 https://packagist.org/packages/baum/baum 2.核心代码: /* * model::create ...
- wubi.exe的工作原理
wubi.exe的工作原理 Wubi没有修改系统分区,在一个Windows分区中安装了一个完整的Ubuntu系统.初看起来,这简直是不可能完成的任务.但是Wubi的确做到了.而我们要关心的是Wubi是 ...
- linux账户密码安全策略
前言 对于服务器安全来说,服务器的账号密码是很重要的事情 我们可以选择取消账号密码登陆,只使用公钥登录,但有时可能并不方便 这里告诉大家账号密码如何管理更加安全 一.账号密码最大使用天数 在/etc/ ...
- HDUOJ-----2838Cow Sorting(组合树状数组)
Cow Sorting Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total ...
- skimage exposure模块解读
exposure模块包括: 直方图均衡化 gamma调整.sigmoid调整.log调整 判断图像是否对比度太低 exposure模块包括以下函数: histogram 统计颜色的直方图,基于nump ...
- [转]TCP(HTTP)长连接和短连接区别和怎样维护长连接
原文链接 一.HTTP协议和TCP协议 HTTP的长连接和短连接本质上是TCP长连接和短连接.HTTP属于应用层协议,在传输层使用TCP协议,在网络层使用IP协议.IP协议主要解决网络路由和寻址问题, ...
- JAvaScript:JS数组元素去重的方法
在做javascript开发的时候,经常会遇到数组元素重复的问题,而javascript Array又没有直接提供方法解决此问题,还需要自己去实现. 方案一: 思路: 1.构建一个新的数组存放结果: ...