09-12

src/tool/domTurnImg.js

@@ -2,12 +2,57 @@ import html2canvas from "html2canvas";
 const getJpeg = dom =>{
 	return new Promise(resolve =>{
 		html2canvas(dom,{useCORS: true,}).then(canvas =>{
-			const jpeg = canvas.toDataURL('image/jpeg',1.0);
-			resolve(base64ToFile(jpeg))
-			console.log(jpeg,'=========');
+			let base64 = canvas.toDataURL('image/jpeg',.9);
+			let quality = 0.9    // 压缩系数0-1之间
+			let newImage = new Image()
+			newImage.src = base64
+			newImage.setAttribute('crossOrigin', 'Anonymous') // url为外域时需要
+			let imgWidth,
+			imgHeight
+			let w = undefined
+			newImage.onload = function () {
+			w = this.width * .8
+			imgWidth = this.width
+			imgHeight = this.height
+			let canvas = document.createElement('canvas')
+			let 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 = 0.6
+			}
+			ctx.clearRect(0, 0, canvas.width, canvas.height)
+			ctx.drawImage(this, 0, 0, canvas.width, canvas.height) //  // 这里面的 this 指向 newImage
+			let smallBase64 = canvas.toDataURL('image/jpeg', quality) // 压缩语句
+			let fileData = dataURLtoFile(smallBase64);
+			let fileOfBlob = new File([fileData], new Date() + ".jpg"); // 命名图片名
+			// console.log(smallBase64);
+			// resolve(base64ToFile(fileOfBlob))
+			resolve(fileOfBlob)
+			}
 		})
 	})
 }
+	//base64转成blob
+function dataURLtoFile(dataURI, type) {
+	let binary = atob(dataURI.split(",")[1]);
+	let array = [];
+	for (let i = 0; i < binary.length; i++) {
+		array.push(binary.charCodeAt(i));
+	}
+	return new Blob([new Uint8Array(array)], { type: "image/jpeg" });
+}
+
+//转换
+
 const base64ToFile = urlData =>{
 	const arr = urlData.split(',');
 	const mime = arr[0].match(/:(.*?);/)[1]
@@ -17,7 +62,6 @@ const base64ToFile = urlData =>{
 	while (n--){
 		ia[n] = bytes.charCodeAt(n);
 	}
-	console.log(new File([ia],'jpeg',{type:mime}));
 	return new File([ia],'jpeg',{type:mime})
 
 }