不想用canvas转

  <input type="file" id="file" accept="image/*" onchange="changeImg()"/>
<script> function blobToDataURL(blob,cb) {
let reader = new FileReader();
reader.onload = function (evt) {
var base64 = evt.target.result
cb(base64)
};
reader.readAsDataURL(blob);
} var file = document.getElementById("file");
function changeImg() {
var img = file.files[0]
if(img){
var url = URL.createObjectURL(img);
var base64 = blobToDataURL(img,function(base64Url) {
console.log(base64Url)
})
}
}

input file转base64的更多相关文章

  1. JS input file 转base64 JS图片预览

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. input file获取选择图片的本地路径和base64路径

    input file获取选择图片的本地路径和base64路径 本地路径: myHeadFile: function (e) { // 这里是input file 的onchange事件 ] const ...

  3. JQuery input file 上传图片

    表单元素file设置隐藏,通过其他元素打开: .imgfile为input file $(".ul").click(function () {return $(".img ...

  4. HTML中上传与读取图片或文件(input file)----在路上(25)

    input file相关知识简例 在此介绍的input file相关知识为: 上传照片及文件,其中包括单次上传.批量上传.删除照片.增加照片.读取图片.对上传的图片或文件的判断,比如限制图片的张数.限 ...

  5. Apache服务器网站访问伪静态内页出现No input file specified.的完美解决方案

    原文地址:Apache服务器网站访问伪静态内页出现No input file specified.的完美解决方案 启用REWRITE的伪静态功能的时候,首页可以访问,而访问内页的时候,就提示:&quo ...

  6. 编译安装mmseg提示cannot find input file: src/Makefile.in错误

    今天安装中文词检索功能模块 coreseek,其中一个分词模块 mmseg ,编译安装到最后,出现annot find input file: src/Makefile.in aclocal   // ...

  7. HTML5的 input:file上传类型控制

    一.input:file属性 属性值有以下几个比较常用: accept:表示可以选择的文件MIME类型,多个MIME类型用英文逗号分开,常用的MIME类型见下表. multiple:是否可以选择多个文 ...

  8. input file控件限制上传文件类型

    网页上添加一个input file HTML控件: <input id="File1" type="file" /> 默认是这样的,所有文件类型都会 ...

  9. 完美解决 nginx No input file specified.

    一次开发中遇到了这个问题:No input file specified nginx版本1.8 找遍网络都是说 fastcgi_param SCRIPT_FILENAME $document_root ...

随机推荐

  1. <读书笔记>《React:引领未来的用户界面开发框架》

    <React:引领未来的用户界面开发框架>(GitHub 附demo版) 1.Component的创建与复合 1.1 React简介 背景介绍,全书概览 1.本质上是一个状态机,它以精简的 ...

  2. 爬取拉钩网上所有的python职位

    # 2.爬取拉钩网上的所有python职位. from urllib import request,parse import json,random def user_agent(page): #浏览 ...

  3. log4j/slf4j

    log4j的使用 引入log4j.jar包 <dependency> <groupId>log4j</groupId> <artifactId>log4 ...

  4. MySQL分表备份

    #!/bin/bash DUMP=/usr/bin/mysqldump MYSQL=/usr/bin/mysql IPADDR=127.0.0.1 PORT=3306 USER=abc PASSWD= ...

  5. 网关中加入熔断机制(Hystrix)

    网关中加入熔断机制 在网关中加入熔断机制 添加依赖项 spring-cloud-gateway项目POM文件加入spring-cloud-starter-netflix-hystrix <dep ...

  6. centos7.3安装wordpress

    一.安装并配置数据库 1.安装mariadb #yum install -y mariadb-server mariadb 2.启动数据库并设置开机自启#systemctl start mariadb ...

  7. Python实现简单抓取功能

    一直以来都想好好学习Python,但是每次学习了从基础感觉学了一会就感觉没意思.今天学习一下爬虫,也算是自己学python的目的吧,但是在学习过程中遇到很多困难,但幸好遇到了一篇好博文,分享给大家:h ...

  8. java改动后运行无变化

    缓存没有及时清理,重新清理打包后运行正常

  9. mysql协议解析

    目录 目录 1 交互过程 1.1 握手认证阶段 1.2 命令执行阶段 2 基本类型 2.1 整型值 2.2 字符串(以NULL结尾)(Null-Terminated String) 2.3 二进制数据 ...

  10. 关于Python的post请求报504错误

    这是个奇葩的问题,我也是奇葩的研究了好几天,最后发现,哈,原来是这个原因,在此记录下曲折的心路历程 接口Content-Type没有,body用的是postman中的raw数据,格式是text 程序如 ...