关于图片转base64然后提交后台,项目中一直用的是canvas的toDataUrl方法,但是之前看HTML5 API文档的时候,一直记得好像有个叫fileReader的东西也可以做到。于是过年无事的时候,把两种方法都写成了插件形式。
https://github.com/tiamoyajie/Zepto/blob/master/task/js/Zepto.GetImgBase64.2.js
https://github.com/tiamoyajie/Zepto/blob/master/task/js/Zepto.GetImgBase64.js

第一种是canvas的方法实现的,canvas只兼容ie9以上的浏览器,若兼容IE8需要引用额外的JS包;
第二种是H5的新API——fileReader的readAsDataURL()方法实现的,此方法兼容IE10以上的浏览器,和第一种相比,这种方法更为简单方便一些;
若需要做上传预览功能,可用canvas把图片显示出来;

img转base64的两种方式的比较的更多相关文章

  1. js 图片base64转file文件的两种方式

    js 图片base64转file文件的两种方式 https://blog.csdn.net/yin13037173186/article/details/83302628 //将base64转换为bl ...

  2. Java通过图片url地址获取图片base64位字符串的两种方式

    工作中遇到通过图片的url获取图片base64位的需求.一开始是用网上的方法,通过工具类Toolkit,虽然实现的代码比较简短,不过偶尔会遇到图片转成base64位不正确的情况,至今不知道为啥. 之后 ...

  3. 将图片base64格式转换为file对象并读取(两种方式读取)

    两种方式读取,一种URL.createObjectURL,另一种fileReader   var base64 = ` data:image/jpeg;base64,/9j/4AAQSkZJRgABA ...

  4. Express全系列教程之(四):获取Post参数的两种方式

    一.关于POST请求 post方法作为http请求很重要的一部分,几乎所有的网站都有用到它,与get不同,post请求更像是在服务器上做修改操作,它一般用于数据资源的更新.相比于get请求,post所 ...

  5. C和C#两种方式实现邮件的简单发送

    内容为通过两种方式发送邮件--1.C语言发送邮件   2.C#发送邮件 一,C语言进行邮件的发送 C语言发送邮件的步骤的简单解析: 1.创建TCP连接    socket() 2.连接到邮箱服务器  ...

  6. Eclipse项目中引用第三方jar包时将项目打包成jar文件的两种方式

    转载自:http://www.cnblogs.com/lanxuezaipiao/p/3291641.html 方案一:用Eclipse自带的Export功能 步骤1:准备主清单文件 “MANIFES ...

  7. centos安装图形界面通常有两种方式

    centos安装图形界面通常有两种方式   1.通过系统安装,在配置选择软件界面,选择GNOME桌面模式.

  8. Struts2实现ajax的两种方式

    基于Struts2框架下实现Ajax有两种方式,第一种是原声的方式,另外一种是struts2自带的一个插件. js部分调用方式是一样的: JS代码: function testAjax() { var ...

  9. CSharpGL(18)分别处理glDrawArrays()和glDrawElements()两种方式下的拾取(ColorCodedPicking)

    CSharpGL(18)分别处理glDrawArrays()和glDrawElements()两种方式下的拾取(ColorCodedPicking) 我在(Modern OpenGL用Shader拾取 ...

随机推荐

  1. 启动另一个activity

    1. 只负责启动 Intent intent = new Intent(mContext, BookOrderActivity.class); Bundle mEmployeeBundle = new ...

  2. Mysql 数据库学习笔记05 触发器

    一.触发器 * 是由时间来出发某个操作,这些事件可以包括 insert.update.delete.等语句.当执行这些操作时,就会触发对应的操作. * 创建一个执行语句的触发器: create tri ...

  3. Mysql 数据库学习笔记03 存储过程

    一.存储过程:如下           通过 out .inout 将结果输出,可以输出多个值. * 调用存储过程: call 存储名称(参数1,参数2,...); 如指定参数不符合要求,返回 Emp ...

  4. linux命令(30):touch命令

    实例一:创建不存在的文件 touch test.log test1.log 实例二:更新log.log的时间和log2012.log时间戳相同 touch  -r test.log test1.log ...

  5. linux命令(28):scp命令

    命令格式:scp [参数] [原路径] [目标路径] 实例1:从远处复制文件到本地目录 scp root@192.168.120.204:/opt/soft/nginx-0.5.38.tar.gz / ...

  6. AC自动机算法

    AC自动机简介:  首先简要介绍一下AC自动机:Aho-Corasick automation,该算法在1975年产生于贝尔实验室,是著名的多模匹配算法之一.一个常见的例子就是给出n个单词,再给出一段 ...

  7. O(n)回文子串(Manacher)算法

    O(n)回文子串(Manacher)算法 资料来源网络 参见:http://www.felix021.com/blog/read.php?2040 问题描述: 输入一个字符串,求出其中最大的回文子串. ...

  8. 【JBPM4】任务节点-任务分配candidate-groups

    此分组的意思是,该任务节点为多个人员,当其中之一完成后,流程就进入下一个节点. JPDL <?xml version="1.0" encoding="UTF-8&q ...

  9. Appscan的第一个测试请求就是提交MAC地址

    GET /AppScan_fingerprint/MAC_ADDRESS_真实的MAC地址.html HTTP/1.0 还好都是合法测试,否则情何以堪...

  10. 四十九 常用内建模块 urllib

    urllib提供了一系列用于操作URL的功能. Get urllib的request模块可以非常方便地抓取URL内容,也就是发送一个GET请求到指定的页面,然后返回HTTP的响应: 例如,对豆瓣的一个 ...