不成功,但是有一定的借鉴性

 /**
* @param base64Codes
* 图片的base64编码
*/
function sumitImageFile(base64Codes){
console.log(convertBase64UrlToBlob(base64Codes));
var formData = new FormData(); //这里连带form里的其他参数也一起提交了,如果不需要提交其他参数可以直接FormData无参数的构造函数 //convertBase64UrlToBlob函数是将base64编码转换;为Blob
formData.append("imageName",convertBase64UrlToBlob(base64Codes)); //append函数的第一个参数是后台获取数据的参数名,和html标签的input的name属性功能相同
try{ // upload("admin","img","haode",formData);
}catch(e){
console.log(e);
alert("TMD又错了!");
}
//ajax 提交form
$.ajax({
url : url,
type : "POST",
data : formData,
dataType:"json",
processData : false, // 告诉jQuery不要去处理发送的数据
contentType : false, // 告诉jQuery不要去设置Content-Type请求头
success:function(data){
console.log(data);
alert("hahaha");
},
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/jpeg'});
}

base64转图片上传的更多相关文章

  1. PHP base64多图片上传

    // 多图片上传,base64 public function upload_multi() { $pic = $_POST['pic']; if (!$pic) { $this->json-& ...

  2. 微信支付特约商户进件中base64格式图片上传

    微信图片上传接口地址:https://api.mch.weixin.qq.com/v3/merchant/media/upload 1.上传方法 1 using HttpHandlerDemo; 2 ...

  3. php base64编码图片上传七牛

    上网上找了好几个例子 都是自己写curl上传 感觉七牛这么多年了不应该sdk不提供一个方法 然后试 试 试 显示put 方式 上传上去 就是个字符串 后来换成文件上传方法 putFile 成了 不废话 ...

  4. JavaUtil 处理Base64的图片上传

    UploadImageBase64.java package com.lee.util; import java.io.File; import java.io.FileOutputStream; i ...

  5. ios base64图片上传失败问题

    今天做图片上传,后台用的是base64解密图片二进制文件,以前都是用表单上传来解决图片上传的,现在后台没有人改,所以研究下base64上传. 需要将图片base64加密,但是调用 [data base ...

  6. 利用cropper插件裁剪本地图片,然后将裁剪过后的base64图片上传至七牛云空间

    现在做的项目需要做一些图片处理,由于时间赶急,之前我便没有处理图片,直接将图片放在input[type=file]里面,以文件的形式提交给后台,这样做简直就是最低级的做法,之后各种问题便出来了,人物头 ...

  7. file标签 - 图片上传前预览 - FileReader & 网络图片转base64和文件流

    记得以前做网站时,曾经需要实现一个图片上传到服务器前,先预览的功能.当时用html的<input type="file"/>标签一直实现不了,最后舍弃了这个标签,使用了 ...

  8. tp5 base64 图片上传

    /** * 保存图片 */ public function uploads($value='') { // $file = base64_decode(request()->file('imag ...

  9. js实现图片上传预览功能,使用base64编码来实现

    实现图片上传的方法有很多,这里我们介绍比较简单的一种,使用base64对图片信息进行编码,然后直接将图片的base64信息存到数据库. 但是对于系统中需要上传的图片较多时并不建议采用这种方式,我们一般 ...

随机推荐

  1. tomcat的webapps下放置多个项目时会出现很多exception

    今天干了一件比较逗比的事,在tomcat的项目目录wepapps下又新建了一个文件夹backup,然后在backup下放置了之前项目的war包...然后启动tomcat的时候各种exception 大 ...

  2. 【Linux】Xshell-Linux常用命令

    (1)命令ls——列出文件 ls -la 给出当前目录下所有文件的一个长列表,包括以句点开头的“隐藏”文件 ls a* 列出当前目录下以字母a开头的所有文件 ls -l *.doc 给出当前目录下以. ...

  3. nginx图片缓存服务器配置实战

     1.图片目录设置: 假定服务器主目录为nginx的默认目录:/usr/local/nginx-0.8.32/html/ 图片存放目录为:/usr/local/nginx-0.8.32/html/SD ...

  4. DEDE修改注册邮箱时一起修改UCenter中用户邮箱的问题

    最近在做一个项目,就是在账号安全栏目中加一个修改邮箱并验证的功能,这个功能并不复杂,可以参照用户注册时的邮箱验证来实现. 就是当用户更改邮箱并提交之后,发一封包含一个链接的邮件到用户的新邮箱中,当用户 ...

  5. 来自于51CTO的经典学习资料汇总

    移动开发类: 1.2012Android开发热门资料(110个)       http://bbs.51cto.com/thread-934023-1.html 2.[绝对给力]Android开发免豆 ...

  6. android 开发-ListView与ScrollView事件冲突处理(事件分发机制处理)

    ListView和ScrollView都存在滚动的效果,所以一般不建议listView和scrollView进行嵌套使用,但有些需求则需要用到两者嵌套.在android的学习中学了一种事件分发处理机制 ...

  7. Linux下安装软件遇见的问题汇总

    1.安装monodevelop 安装环境Linux Mint17.1 在软件在中心直接安装monodevelop,安装完成后直接启动界面“一闪而过”,解决办法: 软件中心安装 mono-complet ...

  8. idea 清屏(控制台)快捷键

    eclipse清屏快捷键为鼠标右键+R 而在idea中默认并没有清屏console的快捷键 所以需要我们自行设置: 1,ctrl+alt+s打开settings 2,找到keymap 3,搜索 cle ...

  9. 会话跟踪之Cookie

    一:简介 Cookie主要用来存储用户信息,追踪用户会话.web客户端访问服务端直接采用的协议是Http,Http协议是一种无状态协议,无状态表现在不能够保留用户访问状态,无法记录用户信息.每一次的请 ...

  10. IOS微信6.7.4输入框失去焦点,软键盘关闭后,被撑起的页面无法回退到原来正常的位置

    近期在开发微信H5页面时碰到这个问题,如图,软键盘弹起后,若原输入框被遮挡,页面整体将会上移,然而当输入框失焦,软键盘收起后,页面未恢复,这也是ios的微信版本更新6.7.4之后才遇到的bug. 目前 ...