一直有人問(wèn)HTML加密混淆怎么做，其實(shí)這在業(yè)內是早已很多人研究過(guò)的課題。
假日期間整理一篇文章分享給大家。
我們先理下需求，加密的目的是什么？加密到什么級別？為此我們可以犧牲什么？
我們知道這個(gè)世界不存在絕對的安全，加密會(huì )被破解、混淆會(huì )被反混淆。
技術(shù)小白、開(kāi)發(fā)者、黑客，是完全不同的級別，防范不同級別的人策略都不一樣。
防范力度越大，投入代價(jià)也越大，比如聘請專(zhuān)業(yè)的安全公司。
除了投入，我們還需要考慮程序的執行性能和用戶(hù)體驗。
加密的代碼在運行時(shí)必須解密，混淆后尤其是混淆HTML后，程序的執行性能會(huì )下降。
是否真的有必要做這類(lèi)的源碼保護，還需要謹慎取舍。
一般而言，前端的代碼，負責的是用戶(hù)體驗，后端的代碼，負責更安全的數據處理。
前端不要涉及泄漏太多涉密信息，那么加密的意義不是特別大。
我很少在前端代碼里看到值得保護的內容，比如高深的算法，很多代碼是沒(méi)必要犧牲用戶(hù)體驗來(lái)保護的。
但有些前端代碼涉及最終用戶(hù)的數據安全，此時(shí)還是要努力做數據保護的。
接下來(lái)具體分析幾種手段。
不要在前端放敏感數據
這個(gè)聽(tīng)起來(lái)是廢話(huà)，但真的很重要。
有些開(kāi)發(fā)者在手機端明文存用戶(hù)的密碼，這是非常危險的事情。
即使是原生開(kāi)發(fā)，一旦手機被root，也會(huì )造成數據泄漏。更何況HTML5開(kāi)發(fā)。
比較好的做法是手機端存token，而不是密碼，這里有篇文章專(zhuān)門(mén)介紹這塊，涉及做登錄的開(kāi)發(fā)者推薦仔細看看設計基于HTML5的APP登錄功能及安全調用接口的方式（原理篇）
js、css壓縮
壓縮不是加密，也不是混淆。但壓縮后的js文件，往往也具有混淆的功能。
js、css壓縮是很常見(jiàn)的技術(shù)，我們經(jīng)?？吹礁鞣N框架的文件名是xxx.min.js，xxx.min.css。
使用合適的js、css壓縮方案，可以減少文件體積、提高載入速度，最重要的是，它還能加快程序的執行性能。簡(jiǎn)直是有百利而無(wú)一害。
混淆js比較常用的工具是yahoo的YUI混淆，在HBuilder里點(diǎn)菜單工具-插件安裝，里面有YUI compress，可以壓縮js和css。
如果js、css比較大，發(fā)布前壓縮下是比較推薦的做法。
HTML、js、css混淆
壓縮雖然也能混淆，但不是以讓別人看不懂為目的，混淆是真正以別人看不懂為目的。
但是這樣的混淆就不像壓縮那么有百利而無(wú)一害了，它會(huì )降低程序執行性能。
一些開(kāi)發(fā)者不希望發(fā)行包解壓后可以直接看到源碼，那么此時(shí)可以使用混淆方案。
網(wǎng)上搜索HTML混淆，資料和工具都非常多。
原理都是類(lèi)似的，js代碼變成亂七八糟的字符串，然后用eval執行，HTML代碼變亂七八糟字符串，用document.write或innerHTML執行，css也可以動(dòng)態(tài)的在document.write里寫(xiě)<style>。
這些工具有免費也有商業(yè)的，一般越商業(yè)的越難被反混淆。
這個(gè)是免費的在線(xiàn)混淆工具 http://www.myobfuscate.com
這個(gè)是比較知名的商業(yè)工具，http://www.jasob.com
其實(shí)大家也可以根據原理自己寫(xiě)混淆算法。
混淆也是一個(gè)有年頭的成熟技術(shù)，比如Google在保護gmail的前端代碼時(shí)，也是通過(guò)混淆來(lái)保護的。
不管是壓縮還是混淆，使用grunt來(lái)做發(fā)布是不錯的方式，開(kāi)發(fā)后一鍵調用grunt處理，非常便捷。
防止webkit remote debug，即防止瀏覽器控制臺調試
Android4.4及以上和iOS是支持webkit remote debug的，在HBuilder的教程里也有如何使用chrome調試Android應用，和使用safari調試iOS應用的教程。
在HBuilder開(kāi)發(fā)的App里，manifest.json里下的plus-distribute下有一個(gè)debug標簽，標記為false后打包（可視化界面里也有配置），這樣的包運行在手機上時(shí)webview會(huì )阻止瀏覽器的遠程調試請求。
如果你想調試，那么把debug改為true后再打包。
當然有些Android rom不是很規范，并不能阻止調試，這屬于rom的bug。
另外注意只有打包才能防調試，真機運行是不能阻止調試的。
專(zhuān)業(yè)加密加固加殼服務(wù)
由于A(yíng)ndroid的特殊性，針對apk出現了加固、加殼產(chǎn)業(yè)，這也是業(yè)內常見(jiàn)的apk保護方案。
很多應用市場(chǎng)都提供加固服務(wù)，比如360手機助手的加固。
還有一批專(zhuān)業(yè)公司如愛(ài)加密，里面有免費的基礎安全保障服務(wù)，也有收費的高級安全保障服務(wù)。
這里還有一個(gè)防止apk解壓的小技巧：http://www.52pojie.cn/thread-287242-1-1.html
這篇文章對于前端的代碼保護也講的非常專(zhuān)業(yè)，值得大家學(xué)習http://div.io/topic/1220
后記
有些非專(zhuān)業(yè)安全公司提供的所謂源碼加密服務(wù)，其實(shí)是漏洞百出的。
安全無(wú)小事，使用專(zhuān)業(yè)安全服務(wù)產(chǎn)品更可信賴(lài)。
愛(ài)加密公司正在開(kāi)發(fā)專(zhuān)業(yè)的HTML5代碼保護方案，大家可以關(guān)注http://ask.dcloud.net.cn/question/8168
聯(lián)系客服
