**
* @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并上传到服务器的更多相关文章

  1. ios开发-将false和true,当做字典的值,并将字典转成字符串,上传到服务器

    今天遇到一个需求,将false和true,当做字典的值,并将字典转成字符串,上传到服务器. 可能这个需求大家遇到过,大部分原因是安卓的同事已经按这样的需求开发完了.我们只能跟随安卓的脚步了. (一)处 ...

  2. PHP后端代码生成微信小程序带参数的二维码保存成jpg图片上传到服务器getwxacodeunlimit

    老板最近有点飘了,他要在PC端的网站放一个微信小程序的二维码,并且扫描这个二维码以后要跳到小程序对应的房源详情页. 这是微信官方给出的文档,连接地址:https://developers.weixin ...

  3. HTML5 文件域+FileReader 分段读取文件并上传到服务器(六)

    说明:使用Ajax方式上传,文件不能过大,最好小于三四百兆,因为过多的连续Ajax请求会使后台崩溃,获取InputStream中数据会为空,尤其在Google浏览器测试过程中. 1.简单分段读取文件为 ...

  4. java文件上传到服务器

    最近项目中使用到了文件从本地到服务器的功能.其实是为了解决目前浏览器不支持获取本地文件全路径.不得已而想到上传到服务器的固定目录,从而方便项目获取文件,进而使程序支持EXCEL批量导入数据. 在前台界 ...

  5. c#将本地文件上传至服务器(内网)

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  6. 使用canvas给图片添加水印, canvas转换base64,,canvas,图片,base64等转换成二进制文档流的方法,并将合成的图片上传到服务器,

    一,前端合成带水印的图片 一般来说,生成带水印的图片由后端生成,但不乏有时候需要前端来处理.当然,前端处理图片一般不建议,一方面js的处理图片的方法不全,二是有些老版本的浏览器对canvas的支持度不 ...

  7. JS中将JSON的字符串解析成JSON数据格式《转》

    在JS中将JSON的字符串解析成JSON数据格式,一般有两种方式: 1.一种为使用eval()函数. 2. 使用Function对象来进行返回解析. 使用eval函数来解析,并且使用jquery的ea ...

  8. js中把JSON字符串转换成JSON对象最好的方法

    在JS中将JSON的字符串解析成JSON数据格式,一般有两种方式: 1.一种为使用eval()函数. 2. 使用Function对象来进行返回解析. 第一种解析方式:使用eval函数来解析,并且使用j ...

  9. Linux下dos2unix命令将windows文件编码格式dos转换成Unix格式

    问题描述: 在Windows系统下面使用文本编辑器notepad后传到Linux系统下的话 Linux下处理和执行一般都存在一些问题,我们可以通过命令查看文件是否是dos格式的, 如果有如图所示的M标 ...

随机推荐

  1. 【独立开发人员er Cocos2d-x实战 001】csb文件导出和载入

    使用cocos studio进行资源文件导出: 然后在cocosproject中进行载入csb文件:  auto myLayout = CSLoader::createNode("/res/ ...

  2. Unix 网络编程 读书笔记1

    第一章: C/C++语言提供两种不同的编程模式:IPL32和PL64.► IPL32 ● 表示integer/pointer/long三种数据类型是32位(4个字节),在这种模式下,提供32位的地址空 ...

  3. github下载源码的三种方式

      从github上下载源码的三种方式 CreationTime--2018年6月7日15点21分 Author:Marydon 1.情景展示 2.实现方式 方式一:直接点击"Downloa ...

  4. 解决:Access denied for user ''@'sinochip-79e833' (using password: NO)

    uthentication to host '' for user '' using method 'mysql_native_password' failed with message: Acces ...

  5. 【mysql】Innodb三大特性之insert buffer

    一.什么是insert buffer insert buffer是一种特殊的数据结构(B+ tree)并不是缓存的一部分,而是物理页,当受影响的索引页不在buffer pool时缓存 secondar ...

  6. PHP-线程安全与非线程安全版本的区别

    Windows版的PHP从版本5.2.1开始有Thread Safe(线程安全)和None Thread Safe(NTS,非线程安全)之分,这两者不同在于何处?到底应该用哪种?这里做一个简单的介绍. ...

  7. CSS:关于CSS Hack

    CSS Hack由于不同厂商的浏览器,如Internet Explorer,Safari,Mozilla Firefox,Chrome 等,或者是同一厂商的浏览器的不同版本,如IE6和IE7,对CSS ...

  8. 重写 View 的 Touch 方法,实现一个酷炫的九宫格图片

    前几天翻看代码库,发现一个之前写过的一个有意思的小玩意,共享给大家

  9. PO_员工主管审批模式详解(设定)

    2014-06-03 Created By BaoXinjian

  10. Linux内核jiffies简介

    在LINUX的时钟中断中涉及至二个全局变量一个是xtime,它是timeval数据结构变量,另一个则是jiffies,首先看timeval结构struct timeval{time_t tv_sec; ...