JS实现文件转base64
核心：
function file2base64(){
fileAddress = document.getElementById("fileImage").files[0];
file = new FileReader();
file.readAsDataURL(fileAddress);
file.onload = function(){console.log(file.result);}
}
完整代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<input type="file" name="" id="fileImage">
<button onclick="file2base64()">文件转base64</button>
<script>
function file2base64(){
fileAddress = document.getElementById("fileImage").files[0]; file = new FileReader();
file.readAsDataURL(fileAddress);
file.onload = function(){console.log(file.result);}
}
</script>
</body>
</html>
JS实现文件转base64的更多相关文章
- JS任意文件转base64
<!doctype html><html><head><meta charset="utf-8"><meta name=&qu ...
- js中将文件的base64转换成file并上传到服务器
** * @param base64Codes * 图片的base64编码 */ function sumitImageFile(base64Codes){ var form=document.for ...
- 前端使用js读取文件
最近同时问我js能不能读取本地文件: 想起以前看到js读取本地文件的文章,然后自己写了个demo. ps:这有点想Java的IO流,但是又有差别. 首先我们定义一个input标签type=" ...
- HTML5 通过文件输入框读取文件为base64文件, 并借助canvas压缩 FileReader, files, drawImage
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- 微信小程序存放视频文件到阿里云用到算法js脚本文件
peterhuang007/weixinFileToaliyun: 微信小程序存放视频文件到阿里云用到算法js脚本文件 https://github.com/peterhuang007/ ...
- Node.js写文件的三种方法
Node.js写文件的三种方式: 1.通过管道流写文件 采用管道传输二进制流,可以实现自动管理流,可写流不必当心可读流流的过快而崩溃,适合大小文件传输(推荐) var readStream = fs. ...
- web主题公园版权信息破解:script.js加密文件
很多人会使用web主题公园网站的免费worldpress主题,但它的主题又都被加了版权信息,故意让人找不到版权信息的修改位置. 你如果去footer.php里面删除版权信息(技术支持:web主题公园) ...
- [django]Django的css、image和js静态文件生产环境配置
前言:在Django中HTML文件如果采用外联的方式引入css,js文件或者image图片,一般采用<link rel="stylesheet" href="../ ...
- node.js grunt文件压缩
对于前段来说,熟悉node的人其实还并不是太多,如果您想入门一门后端语言我建议还是从node入手最好. 我也是最近开始学习node,来谈谈近期对node的学习的心得. 提到node首先就是要安装一大堆 ...
- 详解Js中文件读取机制
前言,文件读取是提高应用体验度的必须接口,应用场景中需求很频繁. Js处理文件读取,由于处于安全方面的考虑,在2000年以前,都是以“<input type="file"&g ...
随机推荐
- 可视化探索开源项目的 contributor 关系
引语:作为国内外最大的代码托管平台,根据最新的 GitHub 数据,它拥有超 372,000,000 个仓库,其中有 28,000,000 是公开仓.分布式图数据库 NebulaGraph 便是其中之 ...
- offline RL | D4RL：最常用的 offline 数据集之一
pdf:https://arxiv.org/pdf/2004.07219.pdf html:https://ar5iv.labs.arxiv.org/html/2004.07219 GitHub:ht ...
- vue初学者入门教程
vue初学者入门教程 欢迎关注博主公众号「java大师」, 专注于分享Java领域干货文章, 关注回复「资源」, 免费领取全网最热的Java架构师学习PDF, 转载请注明出处 https://www. ...
- Android使用poi遇到的问题
原文:Android使用poi遇到的问题 关于Poi使用可以看这一篇[开源库推荐]#4 Poi-办公文档处理库 本篇主要讲些在Android上使用出现的问题 问题 原本是需要一个导出xlsx表格文件的 ...
- day04-Java基础语法
Java基础语法 1.注释 注释不会被执行,是用来给写代码的人看的. 1.1单行注释 单行注释只能注释一行文字 // 注释 1.2多行注释 多行注释可以注释多行文字 /* 注释 注释 注释 */ 1. ...
- WPF线程模型
1. 渲染系统概述 WPF 采用保留模式渲染系统 (Retained Mode Rendering System),该系统可分为 UI 线程和复合线程两个主要部分,两者协作完成 WPF 应用程序的渲染 ...
- 微信小程序开发：异步处理接入的生成式图像卡通化
书接上文,我们完成了对接阿里云人像动漫化接口,现已完成的界面是这样的: 就是效果看着一般,看看效果: 然后我就在阿里云api市场转悠,就想看看还有没有什么其他奇奇怪怪的api,结果就发现了这个: ap ...
- 反转链表——java
给定一个链表,请你将链表反转过来. 举例:原链表:1→2→3→4→5→null 反转链表:5→4→3→2→1→null 代码: package algorithm_niuke; public clas ...
- PAT 甲级【1015 Reversible Primes】
考察素数判断 考察进制转换 import java.io.IOException; import java.io.InputStreamReader; import java.io.StreamTok ...
- Spring Boot学习日记
学习了springboot 的优点 为所有Spring开发者更快的入门 开箱即用,提供各种默认配置来简化项目配置 内嵌式容器简化Web项目 没有冗余代码生成和XML配置的要求 Spring开发-Hel ...