本文主要灵感来自:https://imququ.com/post/code2png-encoder.html 我改变了原文的解码方式,结合之前写的像素隐写https://hide.aoaoao.me/ 使得代码能够隐藏在现有图片中。
比如下面代码中的md5加密函数就写在了图片中。
<script type="text/javascript">
var Decode=function(c){var e=c.height,a=c.width,b=document.createElement("canvas");b.height=e;b.width=a;b=b.getContext("2d");b.drawImage(c,0,0);c=b.getImageData(0,0,a,e);b=[];for(d=0;d<a*e*4;d+=4)0!=(d+4)%(4*a)&&[].push.apply(b,[].slice.call(c.data,d,d+3));c=e=0;for(a="";c<b.length&&(16>=c||(0==b[c]%2?(e++,a+="1"):(e=0,a+="0"),17!=e));c++);a=a.slice(0,-16);a=a.replace(/[\s]/g,"").replace(/(\d{16})(?=\d)/g,"$1 ");e="";a=a.split(" ");for(c=0;c<a.length;c++)b=a[c],16==b.length&&(b=parseInt(b,2),e+=String.fromCharCode(b));return e};
var img = new Image();
img.onload = function() {
Function(Decode(img))();
alert(md5('hello'));
};
img.crossOrigin = '*';
img.src = 'https://download.aoaoao.me/25054098_result.png';
</script>
效果预览:https://jsfiddle.net/de885aga/
而实际上加载的这张图片看上去并没有什么特别之处: