一张图片能隐含千言万语之隐藏你的程序代码


Posted in HTML / CSS onDecember 13, 2012

我最近开发了我的第一个网页游戏:一个HTML5的视频智力游戏。开发的过程很有趣,我喜欢编程,但当实现了游戏逻辑后,我有了一个有趣的想法:为什么不想个办法把代码隐藏起来?起初我想到的是一些很简单的做法,比如禁止上下文菜单,以防右键点击时可以查看页面源代码。但这毫无意义,右键菜单不能用,人们仍然可以通过键盘快捷键或菜单栏里的“查看源文件”来观看源代码。

一张图片能隐含千言万语

这依赖于图片的体积。但我决定要把源代码加密存放到一张图片里。HTML5的画布(canvas)组件很适合干这种事情,因为它支持针对图像像素的操作。一个像素由四个值(通道)来表示:红,绿,蓝和alpha通道。它们的值的分布范围是从0到255。我的Javascript代码就是一个个的字符,每个字符都有一个ASCII对应值。ASCII值的范围也是0-255,所以,我想做的是,遍历画布上的每个像素,给每个像素设置3个代码字符的ASCII值作为它的RGB值,你可以通过charCodeAt函数轻松的取出这些字符。

复制代码
代码如下:

.charCodeAt(0)

生成的是一张色彩斑斓、很小的图片,它就是我的程序代码看看吧:

解码的时候,我只需要把这个图片画到画布上,遍历像素点,取出r,g,b值所代表的字符:

复制代码
代码如下:

String.fromCharCode(code)

把它们连接成一个大的字符串,这就是你的代码了——可执行的代码。

这样就能保护你的源代码了吗?

其实不能——一个有经验的(甚至没有经验的)程序员仍然能够知道如何去解码图片,取出里面的代码,但我想这是能防止那些怀着不良商业目的人偷盗你的的代码的第一步措施——而那些能够想出如何解码的程序员(大部分)都不是来剽窃的

这种方法的主要缺陷
这种技术只能应用在支持HTML5画布(canvas)技术的现代浏览器里,IE6、IE8 里肯定是不行的。甚至有些现代的浏览器对于图片的alpha通道的编码也有支持问题,所以,每个像素点你只能放3个字符——一个100×100大小的图片可以存放3万个文本字符。

你还有其它简单的能防止别人拷贝你的代码的方法吗?我们当然可以把字符进行加密,但如何保证你的解密步骤能不被人轻易的破解呢?告诉我你的想法吧!

HTML / CSS 相关文章推荐
CSS3 transforms应用于背景图像的解决方法
Apr 16 HTML / CSS
CSS实现雨滴动画效果的实例代码
Oct 08 HTML / CSS
CSS3 不定高宽垂直水平居中的几种方式
Mar 26 HTML / CSS
HTML5 Canvas 破碎重组的视频特效的示例代码
Sep 24 HTML / CSS
html5 浏览器支持 如何让所有的浏览器都支持HTML5标签样式
Dec 07 HTML / CSS
html5 Canvas画图教程(3)—canvas出现1像素线条模糊不清的原因
Jan 09 HTML / CSS
html5跨域通讯之postMessage的用法总结
Nov 07 HTML / CSS
HTML5 解决苹果手机不能自动播放音乐问题
Dec 27 HTML / CSS
HTML5单选框、复选框、下拉菜单、文本域的实现代码
Dec 01 HTML / CSS
Bootstrap File Input文件上传组件
Dec 01 HTML / CSS
使用CSS3实现按钮悬停闪烁动态特效代码
Aug 30 HTML / CSS
小程序实现悬浮按钮的全过程记录
Oct 16 HTML / CSS
HTML5 新旧语法标记对我们有什么好处
Dec 13 #HTML / CSS
HTML5自定义data-* data(obj)属性和jquery的data()方法的使用
Dec 13 #HTML / CSS
HTML5 Web存储方式的localStorage和sessionStorage进行数据本地存储案例应用
Dec 09 #HTML / CSS
HTML5 Web Database 数据库的SQL语句的使用方法
Dec 09 #HTML / CSS
html5 浏览器支持 如何让所有的浏览器都支持HTML5标签样式
Dec 07 #HTML / CSS
html5-websocket基于远程方法调用的数据交互实现
Dec 04 #HTML / CSS
HTML5 Canvas像素处理使用接口介绍
Dec 02 #HTML / CSS
You might like
电脑硬件及电脑配置知识大全
2020/03/17 数码科技
PHP判断指定时间段的2个方法
2014/03/14 PHP
Yii框架使用PHPExcel导出Excel文件的方法分析【改进版】
2019/07/24 PHP
JavaScript 输入框内容格式验证代码
2010/02/11 Javascript
javascript使用正则获取url上的某个参数
2014/09/04 Javascript
javascript实现淘宝幻灯片广告展示效果
2015/04/27 Javascript
jquery判断复选框是否被选中的方法
2015/10/16 Javascript
JavaScript中日期函数的相关操作知识
2016/08/03 Javascript
老生常谈JavaScript 函数表达式
2016/09/01 Javascript
Asp.Net之JS生成分页条的方法
2016/11/23 Javascript
vue.js实现带日期星期的数字时钟功能示例
2018/08/28 Javascript
记一次vue去除#问题处理经过小结
2019/01/24 Javascript
elementui之el-tebs浏览器卡死的问题和使用报错未注册问题
2019/07/06 Javascript
JavaScript canvas实现雪花随机动态飘落
2020/02/08 Javascript
javascript设计模式 ? 工厂模式原理与应用实例分析
2020/04/09 Javascript
Vue $attrs & inheritAttr实现button禁用效果案例
2020/12/07 Vue.js
Vue中的nextTick作用和几个简单的使用场景
2021/01/25 Vue.js
python 平衡二叉树实现代码示例
2018/07/07 Python
Django contenttypes 框架详解(小结)
2018/08/13 Python
对python添加模块路径的三种方法总结
2018/10/16 Python
解决python 自动安装缺少模块的问题
2018/10/22 Python
Python将列表数据写入文件(txt, csv,excel)
2019/04/03 Python
基于python实现自动化办公学习笔记(CSV、word、Excel、PPT)
2019/08/06 Python
Python批量将图片灰度化的实现代码
2020/04/11 Python
钉钉企业内部H5微应用开发详解
2020/05/12 HTML / CSS
北美女性服装零售连锁店:maurices
2019/06/12 全球购物
行政主管职责范本
2014/03/07 职场文书
公务员培的训心得体会
2014/09/01 职场文书
事业单位年度考核评语
2014/12/31 职场文书
工作自我评价范文
2015/03/05 职场文书
2015年出纳年终工作总结
2015/05/14 职场文书
元旦联欢晚会主持词
2015/07/01 职场文书
如果用一句诗总结你的上半年,你会用哪句呢?
2019/07/16 职场文书
2019年中学生的思想品德评语集锦
2019/12/19 职场文书
详解Laravel框架的依赖注入功能
2021/05/27 PHP
Python实现socket库网络通信套接字
2021/06/04 Python