|
|
export function showSize (base64url) {
|
|
|
let str = base64url.replace('data:image/png;base64,', '')
|
|
|
// 找到等号，把等号也去掉
|
|
|
const equalIndex = str.indexOf('=')
|
|
|
if (str.indexOf('=') > 0) {
|
|
|
str = str.substring(0, equalIndex)
|
|
|
}
|
|
|
// 原来的字符流大小，单位为字节
|
|
|
const strLength = base64url.length
|
|
|
// 计算后得到的文件流大小，单位为字节
|
|
|
const fileLength = parseInt(strLength - (strLength / 8) * 2)
|
|
|
// 由字节转换为kb
|
|
|
let size = ''
|
|
|
size = (fileLength / 1024).toFixed(2)
|
|
|
const sizeStr = size + '' // 转成字符串
|
|
|
const index = sizeStr.indexOf('.') // 获取小数点处的索引
|
|
|
const dou = sizeStr.substr(index + 1, 2) // 获取小数点后两位的值
|
|
|
if (dou === '00') {
|
|
|
// 判断后两位是否为00，如果是则删除00
|
|
|
return sizeStr.substring(0, index) + sizeStr.substr(index + 3, 2)
|
|
|
}
|
|
|
return Number(size)
|
|
|
}
|
|
|
|
|
|
export function dataURLtoFile (dataurl, filename) {
|
|
|
// 将base64转换为文件，dataurl为base64字符串，filename为文件名（必须带后缀名，如.jpg,.png）
|
|
|
const arr = dataurl.split(',')
|
|
|
const mime = arr[0].match(/:(.*?);/)[1]
|
|
|
const bstr = atob(arr[1])
|
|
|
let n = bstr.length
|
|
|
const u8arr = new Uint8Array(n)
|
|
|
while (n--) {
|
|
|
u8arr[n] = bstr.charCodeAt(n)
|
|
|
}
|
|
|
return new File([u8arr], filename, { type: mime })
|
|
|
}
|
|
|
|
|
|
export function dataURLtoBlob (dataurl) {
|
|
|
const arr = dataurl.split(',')
|
|
|
const _arr = arr[1].substring(0, arr[1].length - 2)
|
|
|
const mime = arr[0].match(/:(.*?);/)[1]
|
|
|
const bstr = atob(_arr)
|
|
|
let n = bstr.length
|
|
|
const u8arr = new Uint8Array(n)
|
|
|
while (n--) {
|
|
|
u8arr[n] = bstr.charCodeAt(n)
|
|
|
}
|
|
|
return new Blob([u8arr], {
|
|
|
type: mime
|
|
|
})
|
|
|
}
|
|
|
|
|
|
export function translateBlobToBase64 (blob, callback) {
|
|
|
const reader = new FileReader()
|
|
|
reader.onload = function (e) {
|
|
|
callback(e.target)
|
|
|
}
|
|
|
reader.readAsDataURL(blob)
|
|
|
// 读取后，result属性中将包含一个data:URL格式的Base64字符串用来表示所读取的文件
|
|
|
}
|
|
|
|
|
|
// 压缩方法
|
|
|
export function compressImage (base64, { width: w = 1280, height: h = 720, size = 200, quality = 1 }) {
|
|
|
return new Promise((resolve, reject) => {
|
|
|
const newImage = new Image()
|
|
|
newImage.src = base64
|
|
|
newImage.setAttribute('crossOrigin', 'Anonymous')
|
|
|
let imgWidth, imgHeight
|
|
|
newImage.onload = function () {
|
|
|
imgWidth = 1280
|
|
|
imgHeight = 720
|
|
|
const canvas = document.createElement('canvas')
|
|
|
const ctx = canvas.getContext('2d')
|
|
|
if (Math.max(imgWidth, imgHeight) > w) {
|
|
|
if (imgWidth > imgHeight) {
|
|
|
canvas.width = w
|
|
|
canvas.height = w * imgHeight / imgWidth
|
|
|
} else {
|
|
|
canvas.height = w
|
|
|
canvas.width = w * imgWidth / imgHeight
|
|
|
}
|
|
|
} else {
|
|
|
canvas.width = imgWidth
|
|
|
canvas.height = imgHeight
|
|
|
quality = 1
|
|
|
}
|
|
|
|
|
|
ctx.clearRect(0, 0, canvas.width, canvas.height)
|
|
|
ctx.drawImage(this, 0, 0, canvas.width, canvas.height)
|
|
|
let compressedBase64 = canvas.toDataURL('image/jpeg', quality) // 压缩语句
|
|
|
if (showSize(compressedBase64) > Number(size)) {
|
|
|
compressedBase64 = canvas.toDataURL('image/jpeg', quality - 0.2 > 0.4 ? quality - 0.2 : 0.4)
|
|
|
}
|
|
|
resolve(compressedBase64)
|
|
|
}
|
|
|
newImage.onerror = function () {
|
|
|
reject(new Error('Failed to load image'))
|
|
|
}
|
|
|
})
|
|
|
}
|