<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. php模拟http请求的方法

    我在这里终结了三种方法 第一种方法:fsockopen $flag = 0; $post = ''; $errno = ''; $errstr = ''; //要post的数据 $argv = arr ...

  2. IE浏览器版本判断 HTML代码

    <!--[if IE 6.0]> <div id="noie6" style="z-index: 20002;border: 1px solid #F7 ...

  3. 用border-image实现波浪边框

    border-image的介绍 http://www.w3school.com.cn/cssref/pr_border-image.asp 先看一个效果: http://www.w3school.co ...

  4. How to create a Python dictionary with double quotes as default quote format?

    couples = [ ['jack', 'ilena'], ['arun', 'maya'], ['hari', 'aradhana'], ['bill', 'samantha']] pairs = ...

  5. visual studio installer 打包123

    下载安装visual studio installer

  6. Django框架-目录文件简介

    Rhel6.5 Django1.10 Python3.5 Django框架-目录文件简介 1.介绍Django Django:一个可以使Web开发工作愉快并且高效的Web开发框架. 使用Django, ...

  7. 【笔记】读取properties文件

    package com.bshinfo.el.userInfo.util; import java.io.BufferedReader; import java.io.File; import jav ...

  8. 创建cocos项目并打包

  9. mysql主从配置

    引言: 双11,阿里云服务器打折,于是我忍不住又买了一台服务器,于是咱也是有两台服务器的爷们了,既然有了两台服务器,那么肯定要好好利用一下吧,那么就来玩玩mysql的主从配置吧. 准备 两台数据库服务 ...

  10. java的remote shell

    http://www.ganymed.ethz.ch/ssh2/ 此程序的目的是执行远程机器上的Shell脚本. [环境参数] 远程机器IP:172.17.24.212 用户名:root 密码:zhe ...