关于图片转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. IE7下面iframe滚动条无法用鼠标轮滚 其他浏览器可以

    1.让 IFRAME 隐藏滚动条,通常的做法就是在嵌入  IFRAME 的页面的 CSS 中指定以下规则:   html, body {overflow: hidden}   2.如果只是想隐藏横向滚 ...

  2. mysql性能分析-------profiling和explain

    1. profiling之性能分析 MySQL5.0.37版本以上支持了Profiling – 官方手册.此工具可用来查询 SQL 会执行多少时间,System lock和Table lock 花多少 ...

  3. POJ 3308

    http://poj.org/problem?id=3308 考虑答案不是乘积而是和的做法, 因为对于每一个伞兵我们要么在这行内安装大炮消灭它 要么在这列中安装大炮消灭它,所以容易看出这是一个最小边覆 ...

  4. django “如何”系列2：如何编写django-admin 命令

    应用可以使用manage.py注册自己的动作,例如,你可能想要为你即将发布的应用添加一个manage.py 操作.这节我们将为polls应用添加一个closepoll的命令 添加一个managemen ...

  5. 部署Nginx

    部署Nginx #下载nginx wget http://nginx.org/download/nginx-1.12.2.tar.gz#安装依赖 yum install pcre-devel open ...

  6. 深度学习方法：受限玻尔兹曼机RBM（一）基本概念

    欢迎转载,转载请注明:本文出自Bin的专栏blog.csdn.net/xbinworld. 技术交流QQ群:433250724,欢迎对算法.技术.应用感兴趣的同学加入. 最近在复习经典机器学习算法的同 ...

  7. python math模块

    import math math. ceil:取大于等于x的最小的整数值,如果x是一个整数,则返回x copysign:把y的正负号加到x前面,可以使用0 cos:求x的余弦,x必须是弧度 degre ...

  8. Android点击图标重新启动问题

    原文:http://blog.csdn.net/jianiuqi/article/details/54091181 项目中的小问题:发现应用打包安装后按home键切换到后台后,点击应用图标又重新打开了 ...

  9. Java学习笔记（九）——javabean

    [前面的话] 实际项目在用spring框架结合dubbo框架做一个系统,虽然也负责了一块内容,但是自己的能力还是不足,所以还需要好好学习一下基础知识,然后做一些笔记.自己的自学能力还是显得不够好,每次 ...

  10. BC-NFS部署报错节点间磁盘wwid冲突

    1.在部署公司的BC-NFS产品时,填好IP选好磁盘后,点击“创建”,就抛出如下提示: 2.关闭虚机,再打开虚机的控制台,点击磁盘,自定义serial number 3.启动虚机,再次登陆,查看磁盘w ...