javascript图片隐写术,感觉可以用它来干点有想法的事情
1、什么是图片隐写术?
权威的wiki说法是“隐写术是一门关于信息隐藏的技巧与科学,所谓信息隐藏指的是不让除预期的接收者之外的任何人知晓信息的传递事件或者信息的内容。”,图片隐写术简而言之就是利用图片来隐藏某些数据,让人一眼看去以为是很普通很正常的图片,但其实里面隐藏着某些“机密”数据。
据传911事件里,KB份子就是通过黄色图片来传递信息而躲过了FBI的监控。还有大众点评也是通过图片隐写术来保护自身合法权益。所以图片隐写术是一个双刃剑,就看你用它做什么了。
比如下面这张图片:

看起来是一张很漂亮的风景照片,但其实它里面却藏着一张美女图(注:美女图片来源于淘宝某店),如下:

是不是很惊艳?看得你热血沸腾鼻血都往外冲呢?这就是图片隐写术的历害之处,“机密”隐藏于无形之中!
2、图片隐写术是怎么做到的?
图片隐写有多种方式,我这里介绍的是采用图片的最低有效位(LSB)进行隐写。其原理就是图片的像素点都是由三原色(RGB)构成(如下图),由这三原色可以组成各种颜色,如CSS里的颜色定义#FFFFFF,即是三原色的16进制值写法,每个颜色各占用8bit。而LSB隐写就是修改像素中每个颜色值的最低位值,而这些修改,人眼一般是分辨不出来的,从而达到数据隐藏的目的。

譬如我们想把’A’隐藏进来的话,如下图,就可以把A转成16进制的0x61再转成二进制的01100001,再修改为红色通道的最低位为这些二进制串。

(注:以上图片和示例来源于Wooyun)
3、Javascript实现的图片隐写术
代码项目见GitHub: https://github.com/kingthy/imagemask
<script type="text/javascript" src="data:imagemask.js"></script>
<script type="text/javascript">
var mask = new ImageMask({
debug: false, //是否开启调试模式
charSize: 16, //字符的字节位数,默认为16,即字符最大值为0xFFFF
mixCount: 2, //隐写数据要混合到图片颜色值里的最低位数,值范围在1-5,默认为2,如果大于3,则图片会失真很严重
lengthSize: 24 //数据长度值的占用字节位数,默认为24,也即数据长度最大值为16777215
});
</script>
- 隐写文本
//脚本里传入页面的canvas对象和要隐写的文本
var output = document.getElementById('output');
var canvas = document.getElementById('canvas');
mask.hideText(canvas, '要隐写的文本');
output.src = canvas.toDataURL();
- 隐写文件
//脚本里传入页面的canvas对象和要隐写的文件
var output = document.getElementById('output');
var canvas = document.getElementById('canvas');
var file = document.getElementById('file');
mask.hideFile(canvas, file.files[0], , function(result){
if(result.success){
output.src = canvas.toDataURL();
}else{
alert(result.message);
}
});
- 读出图片里隐写的文本
var canvas = document.getElementById('canvas');
var message = mask.revealText(canvas);
- 读出图片里隐写的文件
var canvas = document.getElementById('canvas');
var file = mask.revealFile(canvas); //file.name = 文件名称, file.data = 文件数据
4、示例图片
- 原图

- 隐写一章3千多字的小说内容后的图片效果

(隐写什么小说内容,各位有兴趣的将图片保存下来,然后在演示页面里读出来即可知道。)
以上两张(包括上面有美女的那张)图片效果几乎是一样的,人眼是看不出来有任何变化。
5、附加说明
1)、LSB方式的隐写图片只能存储为PNG或者BMP图片格式,并且不允许再采用有损压缩(比如JPEG),否则会丢失隐写的数据!
2)、图片里可以隐写任何数据,并且可以存储的数据多少由图片的大小(长宽)来决定。也许一张图片就能存储下一部圣经的所有文字。
6、脑洞时间
工具是有了,我们可以用来做些什么呢?发挥你的想象吧:)
1)、防采集:将文本内容隐写到图片里,这样就能防直接的采集(比如小说网站、内容原创网站) ,当然了,只能防君子了。
2)、版权水印:将版权水印(文字或者图片)或者其它身份识别标记(如公司里防泄密)隐写到图片里,如果对方直接盗用,则可以起到鉴别作用(如大众点评网案例)。当然了,如要防“攻击”(压缩,变形,涂改等)则需要更高深的隐写方式。有兴趣的可阅读啊里月饼事件引发的知乎讨论贴里的牛人回复。
传递门:https://www.zhihu.com/question/50735753/answer/122717091
3)、防监控:将文本或图片隐写到图片里,可以防机器(某墙?)监控(比如整网站都是好孩子图片或风景图,但其实都是坏孩子图片或者XX小说、XX内容)
4)、文件下载: 直接将文件存于图片里,绕过文件格式限制问题。比如很多图床只能传图片,但经过隐写后就可以图片里藏任意文件了,比如大家都喜欢的种子,当然了,要求图床不会再进行图片再次压缩。
声明:以上只是脑洞想法,本人不负由脑洞或者本隐写工具产生的任何责任!
javascript图片隐写术,感觉可以用它来干点有想法的事情的更多相关文章
- Javascript实现的图片隐写术
javascript图片隐写术,感觉可以用它来干点有想法的事情 1.什么是图片隐写术? 权威的wiki说法是“隐写术是一门关于信息隐藏的技巧与科学,所谓信息隐藏指的是不让除预期的接收者之外的任何人 ...
- javascript图片切换
JavaScript 图片滑动切换效果 作者:cloudgamer 时间: 2009-09-25 文档类型:原创 来自:蓝色理想 第 1 页 JavaScript 图片滑动切换效果 [1] 第 2 页 ...
- Javascript图片预加载详解
预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布 ...
- Echo.js – 简单易用的 JavaScript 图片延迟加载插件
Echo.js 是一个独立的延迟加载图片的 JavaScript 插件.Echo.js 不依赖第三方库,压缩后不到1KB大小. 延迟加载是提高网页首屏显示速度的一种很有效的方法,当图片元素进入窗口可视 ...
- javascript图片懒加载与预加载的分析
javascript图片懒加载与预加载的分析 懒加载与预加载的基本概念. 懒加载也叫延迟加载:前一篇文章有介绍:JS图片延迟加载 延迟加载图片或符合某些条件时才加载某些图片. 预加载:提前加载图片, ...
- javascript - 图片的幻灯片效果
javascript 代码: <script type="text/javascript"> function select_play() { var select_p ...
- Javascript图片预加载详解 分类: JavaScript HTML+CSS 2015-05-29 11:01 768人阅读 评论(0) 收藏
预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布 ...
- 刚看完了一本关于javascript的书感觉受益匪浅,原来不懂的东西这么多,想问问怎么成为大神?求教!!!!!!
刚看完了一本关于javascript的书感觉受益匪浅,原来不懂的东西这么多,想问问怎么成为大神?求教!!!!!!
- javascript图片放大镜效果展示
javascript图片放大镜效果展示 <!DOCTYPE html> <html> <head lang="en"> <meta cha ...
随机推荐
- LINUX 笔记-scp命令
从本地服务器复制到远程服务器: (1) 复制文件: 命令格式: scp local_file remote_username@remote_ip:remote_folder (2) 复制目录: 命令格 ...
- dubbo 笔记-XML配置文件简介
<dubbo:service/> 服务配置,用于暴露一个服务,定义服务的元信息,一个服务可以用多个协议暴露,一个服务也可以注册到多个注册中心. eg.<dubbo:service r ...
- Ubuntu/deppin 系统安装Nginx
Ubuntu/deppin 系统安装Nginx 添加密钥 打开Nginx官网 ,并找到如下位置: 在桌面新建"nginx_signing.key"文件,文件内容为请点击图1中的标注 ...
- Yii2之类自动加载
在yii中,程序中需要使用到的类无需事先加载其类文件,在使用的时候才自动定位类文件位置并加载之,这么高效的运行方式得益于yii的类自动加载机制. Yii的类自动加载实际上使用的是PHP的类自动加载,所 ...
- 使用sklearn进行数据挖掘-房价预测(4)—数据预处理
在使用机器算法之前,我们先把数据做下预处理,先把特征和标签拆分出来 housing = strat_train_set.drop("median_house_value",axis ...
- 基于HTML5及WebGL的工控SCADA模拟飞机飞行
昨天看到一篇文章说是学习如何开飞机的,然后我就想,如果我也可以开飞机那就好玩了,每个人小时候都想做飞行员!中国飞行员太难当了,再说也不轻易让你开飞机!后来我就想如果能用 HT 开飞机那就是真的有趣了, ...
- JAVA提高十一:LinkedList深入分析
上一节,我们学习了ArrayList 类,本节我们来学习一下LinkedList,LinkedList相对ArrayList而言其使用频率并不是很高,因为其访问元素的性能相对于ArrayList而言比 ...
- Pie
Problem Description My birthday is coming up and traditionally I'm serving pie. Not just one pie, no ...
- [Bayesian] “我是bayesian我怕谁”系列 - Boltzmann Distribution
使用Boltzmann distribution还是Gibbs distribution作为题目纠结了一阵子,选择前者可能只是因为听起来“高大上”一些.本章将会聊一些关于信息.能量这方面的东西,体会“ ...
- 初学者最易懂的git教程在这里!
一.git简介: Linux创建了Linux,但是Linux的发展壮大是由世界各地的热心志愿者参与编写的?那么那么多份的代码是怎么合并的呢?之前是在2002年以前,世界各地的志愿者把源代码文件通过di ...