图片处理

两者的关系

const bf = new ArrayBuffer(10);
const ar = new Int8Array(bf); 
//处理之后可以
//ar.buffer 获取 arraybuffer

fileReader 读取图片的arraybuffer

var fileReader = new FileReader();
	fileReader.onload = function(e) {
		fileContent = e.target.result;
		callback(fileContent);
	}
	fileReader.readAsArrayBuffer(file);

设置加密规则

function getImageSize(bf) {
	let blob = new Blob( [ bf ], { type: "image/png" } );
 let urlCreator = window.URL || window.webkitURL;
 let imageUrl = urlCreator.createObjectURL( blob );
 let img = new Image();
 return new Promise(function(resolve){
 	img.onload = function(){
 		resolve({w:img.naturalWidth, h:img.naturalHeight});
 	};
 	img.src = imageUrl;
 })
}

//计算打乱顺序
function calculateRandomRule(imgsize){
	let sw=0, sh=0;
	let x,y; //xy轴划分
	let randomlist = []
	for(let i=4; i<Math.max(imgsize.w,imgsize.h); i++) {
		if(imgsize.w%i == 0) {
			sw = imgsize.w/i;
			x = i;
			if(sh){break}
		}
		if(imgsize.h%i == 0) {
			sh = imgsize.h/i;
			y = i;
			if(sw){break}
		}
	};
	for(let i=0; i<x*y; i++) {
		randomlist.push(i);
	}
	randomlist = randomlist.sort(() => 0.4 - Math.random())
	return {
		sw,
		sh,
		x,
		y,
		randomlist
	}
}

function encodeImage(box) {
	// const cs = document.querySelector('canvas');
	const cs = document.createElement('canvas');
	const ctx = cs.getContext('2d');
	const img = document.getElementById('photo');
	cs.width = img.naturalWidth;
	cs.height = img.naturalHeight;
	let sw =box.sw, sh=box.sh, x = box.x, y=box.y;
	ctx.drawImage(img,0,0);
	let imgdataList = [], list=box.randomlist;
	for(let i=0; i<y; i++) {
		for(let j=0; j<x; j++) {
			imgdataList.push(ctx.getImageData(j*sw,i*sh,sw,sh));
		}
	};
	ctx.fillRect(0,0,cs.width,cs.height);
	for(let i=0, j=0; i<list.length; i++) {
		if(i >= x && (i%x) == 0) {
			j++;
		} 
		ctx.putImageData(imgdataList[list[i]], sw*(i%x),sh*j);
	}
	cs.toBlob(function(blob){
 	var urlCreator = window.URL || window.webkitURL;
		var imageUrl = urlCreator.createObjectURL(blob);
 	var img = document.querySelector("#photo2");
 	img.src= imageUrl
	},"image/png")
}

async function callBack(m){
	let imgsize = await getImageSize(m); 
	let randomObj = calculateRandomRule(imgsize);
	let arr = new Int8Array(m);
	let boxabf = new ArrayBuffer(m.byteLength/50);
	let newarr = new Int8Array(arr.length+randomObj.randomlist.length+1);
	let boxarr = new Int8Array(boxabf.byteLength);
	for(let i =0; i<newarr.length; i++){
		if(i>=arr.length){
			if(i=== arr.length+randomObj.randomlist.length){
				newarr[i] = randomObj.randomlist.length;
			} else{
				newarr[i] = randomObj.randomlist[i-arr.length];
			}
		} else {
			newarr[i] = arr[i]
		};
	}
	encodeImage(randomObj);
}