图片转换成base64
let bgcImage = 'http://192.168.0.83:9080/files/4a9c3056-9b9b-4b41-b8e2-fd9f27023c41.jpg'
let image = new Image()
image.crossOrigin = '' // 必须有这个
image.src = bgcImage
image.onload = () => { // 图片加载完成后,调用getBase64Image方法
let base64ImageSrc = getBase64Image(image)
console.log(base64ImageSrc )
} // url转base64
export function getBase64Image(image, width, height) { // width、height调用时传入具体像素值,控制大小 ,不传则默认图像大小
let canvas = document.createElement('canvas')
canvas.width = width !== undefined ? width : image.width
canvas.height = height !== undefined ? height : image.height
let ctx = canvas.getContext('2d')
ctx.drawImage(image, , , canvas.width, canvas.height)
let ext = image.src.substring(image.src.lastIndexOf('.') + ).toLowerCase()
let dataURL = canvas.toDataURL('image/' + ext)
return dataURL
}
// base64转file
export function dataURLtoFile (dataurl, filename) {
let arr = dataurl.split(',')
let mime = arr[].match(/:(.*?);/)[]
let bstr = atob(arr[])
let n = bstr.length
let u8arr = new Uint8Array(n)
while (n--) {
u8arr[n] = bstr.charCodeAt(n)
}
return new File([u8arr], filename, { type: mime })
}
图片转换成base64的更多相关文章
- java 图片转换成base64字符串
import java.io.ByteArrayOutputStream; import java.io.FileInputStream;import java.io.FileOutputStream ...
- js绝对地址图片转换成base64的方法
//将图片转换成base64 function getBase64Image(url, callback){ var canvas = document.createElement('canvas') ...
- Java对网络图片/本地图片转换成Base64编码和解码
一.将本地图片转换成Base64编码字符串 /** * 将本地图片转换成Base64编码字符串 * * @param imgFile 图片目录路径 * @return */ public static ...
- delphi将图片转换成Base64编码函数
{************************************************************************** 名称: BaseImage 参数: fn: TF ...
- Base64字符保存图片,图片转换成Base64字符编码
//文件转换成Base64编码 public static String getFileBase64Str(String filePath) throws IOException { String f ...
- 利用PHP将图片转换成base64编码的实现方法
先来说一下为什么我们要对图片base64编码 base64是当前网络上最为常见的传输8Bit字节代码的编码方式其中之一.base64主要不是加密,它主要的用途是把某些二进制数转成普通字符用于网络传输. ...
- 图片转换成Base64编码集成到html文件
首先为什么要这么做? 原因很简单这样可以减少与服务器的请求,当然对于一些浏览器并不支持,如IE8.通常用在手机版网站中,具体转化方法如下: 1.在线打开Base64的编码器将图片编码成Base64 ...
- JS将图片转换成Base64码
直接上代码 html页面代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset= ...
- lua 把图片转换成base64
调用实例 require("ZZBase64") local files local file = io.open("E:\\2342.jpg","r ...
- data:image/png;base64 上传图像将图片转换成base64格式
大家可能注意到了,网页上有些图片的src或css背景图片的url后面跟了一大串字符,比如: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJ ...
随机推荐
- MDS 多活配置
CephFS 介绍及使用经验分享 阅读 1179 收藏 2 2019-01-14 原文链接:www.jianshu.com WebRTC SFU中发送数据包的丢失反馈juejin.im 目录 Ceph ...
- Ceph 概述和理论
1.1 Ceph概述 官网地址:https://docs.ceph.com/docs/master/ 1.Ceph简介 概述:Ceph是可靠的.可扩展的.统一的.分布式的存储系统.同时提供对象存储RA ...
- ARTS-S 获取子线程返回值注意事项
#include <stdio.h> #include <stdlib.h> #include <pthread.h> #include <unistd.h& ...
- LNMP环境搭建(<=PHP7.2)
目录 准备工作 安装wget 安装net-tools 安装vim 配置显示行号 关闭防火墙 安装Nginx 安装依赖 编译安装Nginx 配置环境变量 Systemd管理 安装MySQL 安装依赖 下 ...
- NodeJS4-6静态资源服务器实战_range范围请求
range范围请求:向服务器发起请求可以申明我想请求判断内容的范围,从多少个字节到多少个字节,一次要求把所有的内容拿回来,服务器在得到相应的请求之后,从拿到对应的文件,拿到对应的字节返回给客户端.要实 ...
- 你不知道的JavaScript(上)this和对象原型(一)
第一章 关于this 1.this 既不指向函数自身也不指向函数的词法作用域 2.this 实际上是在函数被调用时发生的绑定,它指向什么完全取决于函数在哪里被调用(调用位置). 第二章 this全面 ...
- 【ES6】数值的扩展
1.Number.isFinite()和Number.isNaN()[只对数值有效] (1)Number.isFinite()用来检查一个数值是否为有限的(finite),即不是Infinity. [ ...
- return之为什么能够终止函数,代码演练
''' return 有终止函数的作用,下面通过执行到return x 以后, 就结束了程序的下一步执行,所以就没有往下面走,所以终端上也就只能 看到打印结果100,看不到打印呢 ''' def se ...
- 面试连环炮系列(二十一):你们的项目怎么使用kafka
你们的项目怎么使用kafka? 我们采用kafka进行日志采集,准确点说是ELK方案,即elasticsearch + logstash + kibana + kafka.通过Spring AOP的方 ...
- 转自自己的关于落谷计数器【p1239】的题解
本蒟蒻写这道题用了两天半里大概五六个小时.(我太弱了) 然后这篇题解将写写我经历的沟沟坎坎,详细的分析一下, 但是由于它很长,因此一定还有多余的地方,比如说我的 预处理,可能比较多余.但是我觉得,信息 ...