<input type="file" id="picFile" /> 
 function readFile() {
     var obj = document.getElementById("picFile");
     if (obj.files.length < 1) {
         console.log("请选择文件");
         return;
     }
     var file = obj.files[0];
     if (!/image\/\w+/.test(file.type)) {
         console.log("请确保文件为图像类型");
         return;
     }
     var reader = new FileReader();
     reader.readAsDataURL(file);
     reader.onload = function (e) {
         //console.log(e.target.result);
         console.log(this.result);
     }
 }

FileReader获取文件的base64编码的更多相关文章

  1. Java,获取文件的Base64字符串,解码Base64字符串还原文件

    在jdk1.8以前,获取文件Base64字符串需要用到第三方库,从1.8开始,Java中引入了Base64相关的类 以下是代码示例 获取文件的Base64编码字符串 import java.io.Fi ...

  2. JS 获取图片的base64编码

    获取图片的base64编码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

  3. JS上传图片-通过FileReader获取图片的base64

    下面文章,我想要的是: FileReader这个对象,可以借助FileReader来获取上传图片的base64,就可以在客户端显示该图片了.同时,还可以把该图片的base64发送到服务端,保存起来. ...

  4. 如何获取图片的base64编码

    1.准备一张图片,比如1.gif 2.使用chrome浏览器,新建立一个窗口,然后将a.png拖动至浏览器窗口里面,打开控制台(检查),最后点击source 3.使用方法: 注意source获取的一串 ...

  5. HTML5 通过文件输入框读取文件为base64文件, 并借助canvas压缩 FileReader, files, drawImage

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  6. 媒体文件audio 转 base64 编码 (利用 FileReader & Audio 对象)

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  7. 获取图片base64编码的几种方法

    前文中我们聊了 Data URI 和 base64编码,稍微回顾下.base64编码 是将数据用 64 个可打印的字符进行编码的方式,任何数据底层实现都是二进制,所以都可以进行 base64编码,ba ...

  8. 图片转换base64编码,点击div的时候选择文件

    有时候我们希望文件上传的时候预览图片,下面插件可以实现上传前预览图片 (也可以提取文件的base64编码) max-height: 140px;max-width: 120px;可以指定图片的最大宽度 ...

  9. FileReader 获取图片BASE64 代码 并预览

    FileReader 获取图片的base64 代码 并预览 FileReader ,老实说我也不怎么熟悉.在这里只是记录使用方法. 方法名 参数 描述 abort none 中断读取 readAsBi ...

随机推荐

  1. mac gem install nokogiri error

    Gem::Ext::BuildError: ERROR: Failed to build gem native extension. /Users/angela/.rbenv/versions/1.9 ...

  2. PHP中被定义为false的

    if($res == false){ echo "未定义通过<br>"; } $res = 0; if($res == false){ echo "0数字通过 ...

  3. list操作

    1.查看列表属性 >>> a = [1,2] >>> dir(a) ['__add__', '__class__', '__contains__', '__dela ...

  4. CF576E

    *在#里发他一直WA这道CF题,然后我就去看了看,感觉还挺有趣的,那我就在这里整理一下我的思路..毕竟一边听歌.. 题意: 给个图,每条边初始无色,每次给一个询问(e,c)表示把e涂成颜色c,如果此时 ...

  5. iOS6_自动约束 Constraints

    取消Constraints(约束) 问题描述:xib文件设计的时候控件已经摆好位置,但是每次调试的时候控件的位置又乱了 解决方法:选中 xib文件,在右侧第一项(Identity and type)的 ...

  6. Code First 迁移,及迁移错误

    迁移错误: 今天在使用EF6 Code First时,出现如下错误,折腾了老半天.分享一下,帮后面的兄弟少走弯路. PM> Enable-Migrations Checking if the c ...

  7. Cocos2dx

    初玩Cocos2dx,多多包涵. 感觉版本之间的差异比较大,相对前面的版本来说,3.X更容易上手,更方便了. 一.安装python.我的python-2.7.3.配置环境变量 系统变量里:在Path里 ...

  8. oracle11g interval(numtoyminterval())自动创建表分区

    Oracle11g通过间隔分区实现按月创建表分区 在项目数据库设计过程中由于单表的数据量非常庞大,需要对表进行分区处理.由于表中的数据是历史交易,故按月分区,提升查询和管理. 由于之前对于表分区了解不 ...

  9. 编译安装 varnish-4.1.2和yum 安装 varnish-4.0.3

    vanish可以让用户自己选择缓存数据是存于内存还是硬盘,存于内存一般基于二八法则即常访问的数据是磁盘存储的总数据五分之一,因此内存也应该是硬盘文件大概五分之一.如果有多台vanish则,总内存满足即 ...

  10. linux通过挂载系统光盘搭建本地yum仓库的方法

    1.挂载光盘 [root@localhost ~]# mount /dev/cdrom /media/cdrom/ mount: /dev/sr0 写保护,将以只读方式挂载 /media下的cdrom ...