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


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制作动态进度条以及附加jQuery百分比数字显示
Dec 13 HTML / CSS
css3打造一款漂亮的卡哇伊按钮
Mar 20 HTML / CSS
使用css3制作动感导航条示例
Jan 26 HTML / CSS
基于CSS3实现的黑色个性导航菜单效果
Sep 14 HTML / CSS
CSS3点击按钮实现背景渐变动画效果
Oct 19 HTML / CSS
总结30个CSS3选择器
Apr 13 HTML / CSS
CSS3 实现发光边框特效
Nov 11 HTML / CSS
canvas像素画板的实现代码
Nov 21 HTML / CSS
HTML5 audio标签使用js进行播放控制实例
Apr 24 HTML / CSS
html5 初试 indexedDB(推荐)
Jul 21 HTML / CSS
微信端html5页面调用分享接口示例
Mar 14 HTML / CSS
css实现左上角飘带效果的完整代码
Mar 18 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
在PHP中使用curl_init函数的说明
2010/11/02 PHP
PHP实现的英文名字全拼随机排号脚本
2014/07/04 PHP
Paypal实现循环扣款(订阅)功能
2017/03/23 PHP
Yii2框架实现登陆添加验证码功能示例
2018/07/12 PHP
YII框架关联查询操作示例
2019/04/29 PHP
javascript 表格排序和表头浮动效果(扩展SortTable)
2009/04/07 Javascript
JavaScript中的集合及效率
2010/01/08 Javascript
从数据结构的角度分析 for each in 比 for in 快的多
2013/07/07 Javascript
通过js获取div的background-image属性
2013/10/15 Javascript
jQuery实现默认是闭合的FAQ展开效果菜单
2015/09/14 Javascript
利用Javascript实现BMI计算器
2016/08/16 Javascript
KnockoutJS 3.X API 第四章之事件event绑定
2016/10/10 Javascript
AngularJS入门教程之与服务器(Ajax)交互操作示例【附完整demo源码下载】
2016/11/02 Javascript
jquery实现多次上传同一张图片
2017/01/09 Javascript
Node.js实现发送邮件功能
2017/11/06 Javascript
Django模板继承 extend标签实例代码详解
2019/05/16 Javascript
JS回调函数简单易懂的入门实例分析
2019/09/29 Javascript
使用JS来动态操作css的几种方法
2019/12/18 Javascript
wxpython中Textctrl回车事件无效的解决方法
2016/07/21 Python
Python编程实现双击更新所有已安装python模块的方法
2017/06/05 Python
python类的方法属性与方法属性的动态绑定代码详解
2017/12/27 Python
Python爬虫实例_城市公交网络站点数据的爬取方法
2018/01/10 Python
TensorFlow keras卷积神经网络 添加L2正则化方式
2020/05/22 Python
Python 中的函数装饰器和闭包详解
2021/02/06 Python
HTML5中的postMessage API基本使用教程
2016/05/20 HTML / CSS
linux面试题参考答案(6)
2014/08/29 面试题
资源环境与城市管理专业推荐信
2013/11/30 职场文书
求职自荐信格式
2013/12/04 职场文书
《灯光》教学反思
2014/02/08 职场文书
2014全国两会学习心得体会1000字
2014/03/10 职场文书
化工专业自荐书
2014/06/16 职场文书
科技节口号
2014/06/19 职场文书
2014年大学班长工作总结
2014/11/14 职场文书
2015世界地球日活动总结
2015/02/09 职场文书
清洁工个人总结
2015/03/04 职场文书
2015年小学体育教师工作总结
2015/10/23 职场文书