【轉】DataURL在Web瀏覽器中的兼容性總結

1. IE8+，Firefox，Chrome，Opera，Safari 等現代瀏覽器廣泛支持data URL
2. IE8 data URL 最大長度限制爲32k字節，超出無效。IE9+沒有這個限制
3. IE只識別base64編碼或百分號編碼(URL編碼, encodeURIComponent)的data URL，IE不識別無編碼的data URL，非IE瀏覽器可識別無編碼的data URL
4. IE不支持對<iframe>,<frame>標籤的src設置data URL
5. IE官方說法說data URL僅支持如下5種使用場景：
   • object (images only)
   • img
   • input type=image
   • link
   • CSS declarations that accept a URL
6. 據本人實測，IE也在除了官方所述5種以外的其它場合支持data URL：
   1. a href
   2. meta refresh. 示例：
      

      <meta http-equiv="refresh" content="5;URL=data:text/html;base64,xxxx....">

   3. script src
   4. window.open
   5. embed src
7. 對於audio, video一類的元素，每每資源文件較大，使用data URL並不常見，我也沒有對其進行測試。
8. Firefox中粘貼截圖是直接轉換爲data URL的圖片，其它瀏覽器乾脆沒法粘貼，我記得之前Chrome好像能夠粘貼截圖的，今天再測Chrome,Opera都不能粘貼截圖(<div contenteditable></div>作的測試).   （粘貼截圖經常使用於在線富文本編輯器）
9. 可爲data URL指定字符集編碼。示例：data:text/plain;charset=US-ASCII,xxxx....

 

 

附錄：

DataURL語法規則：

 

       dataurl    := "data:" [ mediatype ] [ ";base64" ] "," data
       mediatype  := [ type "/" subtype ] *( ";" parameter )
       data       := *urlchar
       parameter  := attribute "=" value

 

 

DataURL規範：rfc2397

維基百科詞條：Data URI scheme

最好的在線生成DataURL網站：Data Url Maker  頁面簡潔，支持文件拖放，支持對指定網址的CSS文件作data URL優化。

from：http://blog.csdn.net/cuixiping/article/details/14215947