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


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开启硬件加速的使用和坑
Aug 21 HTML / CSS
关于CSS Tooltips(鼠标经过时显示)的效果
Apr 10 HTML / CSS
一款纯css3实现的漂亮的404页面的实例教程
Nov 27 HTML / CSS
CSS Grid布局教程之网格单元格布局
Dec 30 HTML / CSS
HTML5+CSS3 诱人的实例:3D立方体旋转动画实例
Dec 30 HTML / CSS
详解使用HTML5的classList属性操作CSS类
Oct 13 HTML / CSS
HTML5 新旧语法标记对我们有什么好处
Dec 13 HTML / CSS
html5 application cache遇到的严重问题
Dec 26 HTML / CSS
canvas 阴影和图形变换的示例代码
Jan 02 HTML / CSS
移动端Html5中百度地图的点击事件
Jan 31 HTML / CSS
canvas实现烟花的示例代码
Jan 16 HTML / CSS
html form表单基础入门案例讲解
Jul 15 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
Breeze 文章管理系统 v1.0.0正式发布
2006/12/14 PHP
一个简单的PHP验证码实现代码
2014/05/10 PHP
PHP获取文件扩展名的4种方法
2015/11/24 PHP
PHP的Laravel框架结合MySQL与Redis数据库的使用部署
2016/03/21 PHP
laravel5.6框架操作数据curd写法(查询构建器)实例分析
2020/01/26 PHP
PHP页面静态化――纯静态与伪静态用法详解
2020/06/05 PHP
Jquery 高亮显示文本中重要的关键字
2009/12/24 Javascript
javascript parseInt() 函数的进制转换注意细节
2013/01/08 Javascript
基于jQuery实现模拟页面加载进度条
2013/04/01 Javascript
javascript 实现键盘上下左右功能的小例子
2013/09/15 Javascript
JavaScript数组Array对象增加和删除元素方法总结
2015/01/20 Javascript
Javascript 判断两个IP是否在同一网段实例代码
2016/11/28 Javascript
JS实现无缝循环marquee滚动效果
2017/05/22 Javascript
vue todo-list组件发布到npm上的方法
2018/04/04 Javascript
详解Vue.js v-for不支持IE9的解决方法
2018/12/29 Javascript
javascript设计模式 ? 外观模式原理与用法实例分析
2020/04/15 Javascript
Python实现简单遗传算法(SGA)
2018/01/29 Python
Python画柱状统计图操作示例【基于matplotlib库】
2018/07/04 Python
Python实现全排列的打印
2018/08/18 Python
ubuntu16.04制作vim和python3的开发环境
2018/09/23 Python
python实现图片彩色转化为素描
2019/01/15 Python
解决django 新增加用户信息出现错误的问题
2019/07/28 Python
python使用celery实现异步任务执行的例子
2019/08/28 Python
CentOS7下安装python3.6.8的教程详解
2020/01/03 Python
Tensorflow进行多维矩阵的拆分与拼接实例
2020/02/07 Python
Python数据可视化实现漏斗图过程图解
2020/07/20 Python
css3和jquery实现自定义checkbox和radiobox组件
2014/04/22 HTML / CSS
美国第二大团购网站:LivingSocial
2016/07/24 全球购物
Sunglasses Shop德国站:欧洲排名第一的太阳镜网站
2017/08/01 全球购物
瑞典时尚服装购物网站:Miinto.se
2017/10/30 全球购物
英国电信商店:BT Shop
2019/12/17 全球购物
Hashtable 添加内容的方式有哪几种,有什么区别?
2012/04/08 面试题
餐厅采购员岗位职责
2014/03/06 职场文书
家庭财产分割协议范文
2014/11/24 职场文书
2015秋季田径运动会广播稿
2015/08/19 职场文书
Spring中bean集合注入的方法详解
2022/07/07 Java/Android