之前完成腾讯《前端突击队》第二季的挑战最后一题就涉及了图像的处理,虽然是很简单的图像二值化,但我还是很感兴趣的。顺带学习了如何通过js操纵<canvas>
中的图像,做了一个在浏览器中加密和解密图像的页面,并实现了直接拖拽本地图片的功能,参照了以下的资料。其中涉及到了js读取本地图片,图片转化为base64,操作<canvas>
的各种方法等等~~
简单的做出来了这个页面/project/img.html,将你要隐藏的图片和隐藏到的那张图片拖到相应的位置,encode得到加密的图片,decode解密。
改进下,还可以用canvas
做一个写字板,然后可以将写字板的内容隐藏到图片中。并可以进行解密。