CSS文件加密保護

原文鏈接：http://www.feeldesignstudio.com/2013/08/cssencryption

 

很多Web設計師都想保護自己辛苦寫成的CSS文件，但是基於眾所周知的原因，我們的CSS是無法加密的。這篇文章主要是給出一個障眼的方法，讓菜鳥知難而退即可。

思路其實非常的簡單，就是將部分字符轉為Unicode編碼，比如下面的css文件：

 

CSS

 

@import "style.min.css";

經過轉換變為：

 

CSS

 

@\0069\006d\0070\006f\0072\0074"\0073\0074\0079\006c\0065.\006d\0069\006e.\0063\0073\0073";

　　

當然也可以隨便的去掉一個或兩個0：

 

CSS

 

@\0069\6d\070\6f\0072\074"\073\74\79\6c\0065.\06d\69\006e.\063\73\0073";

　　

這樣的話，一般人也懶得去看你的CSS代碼了。下面是一段CSS代碼：

 

CSS

 

body {
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:14px;
  line-height:1.6;
  color:#333333;
  background-color:#ffffff;
}

　　

“加密”后的代碼：

 

CSS

 

\0062\006f\0064\0079  {
    \0066\006f\006e\0074-\0066\0061\006d\0069\006c\0079:"\0048\0065\006c\0076\0065\0074\0069\0063\0061 \004e\0065\0075\0065"\002c\0048\0065\006c\0076\0065\0074\0069\0063\0061\002c\0041\0072\0069\0061\006c\002c\0073\0061\006e\0073-\0073\0065\0072\0069\0066;
    \0066\006f\006e\0074-\0073\0069\007a\0065:\0031\0034\0070\0078;
    \006c\0069\006e\0065-\0068\0065\0069\0067\0068\0074:1.6;
    \0063\006f\006c\006f\0072:#\0033\0033\0033\0033\0033\0033;
    \0062\0061\0063\006b\0067\0072\006f\0075\006e\0064-\0063\006f\006c\006f\0072:#\0066\0066\0066\0066\0066\0066;
}

　　

在開發工具中看到的是：

 

挺唬人的，不過不到萬不得已，不要這樣做，開發人員的心應該是開源的。

注意：在網上有一些文章提到在CSS文件中插入”\0″,”\00″,”\000″的方法，這個現在已經不再適用。

附一個轉碼的Javascript方法：

 

JavaScript

 

    functionstring_as_unicode_escape(input){
        functionpad_four(input){
            varl=input.length;
            if(l==0)return'0000';
            if(l==1)return'000'+input;
            if(l==2)return'00'+input;
            if(l==3)return'0'+input;
            returninput;
        }
 
        varoutput='';
        for(vari=0,l=input.length;i<l;i++)
            output+='\\'+pad_four(input.charCodeAt(i).toString(16));
        returnoutput;
    }

　　

不過在轉換的時候需要注意忽略一些特殊字符和關鍵字，比如#@:;.{}-之類的，還有hover、before、after等關鍵字，這個就不一一例舉了。