?
This document uses PHP Chinese website manual Release
數(shù)據(jù) URL,以該模式data:
為前綴的 URL,允許內(nèi)容創(chuàng)建者將小文件嵌入文檔中。
注意:現(xiàn)代瀏覽器將數(shù)據(jù) URL 視為唯一不透明的起源,而不是繼承設(shè)置對象的原點
負責導(dǎo)航。
數(shù)據(jù) URL 由四部分組成:前綴(data:
),指示數(shù)據(jù)類型的 MIME 類型,非文本形式的可選base64
標記以及數(shù)據(jù)本身:
data:[<mediatype>][;base64],<data>
mediatype
是一個 MIME 類型的字符串,例如'image/jpeg'
用于 JPEG 圖像文件。如果省略,則默認為text/plain;charset=US-ASCII
如果數(shù)據(jù)是文本的,則可以簡單地嵌入文本(使用適當?shù)膶嶓w或基于封閉文檔類型的轉(zhuǎn)義符)。否則,您可以指定base64
嵌入 base64 編碼的二進制數(shù)據(jù)。
幾個示例:
data:,Hello%2C%20World!
簡單的純文本/數(shù)據(jù)data:text/plain;base64,SGVsbG8sIFdvcmxkIQ%3D%3D
的 base64 編碼版本,上面data:text/html,%3Ch1%3EHello%2C%20World!%3C%2Fh1%3E
有一個 HTML 文件<h1>Hello, World!</h1>data:text/html,<script>alert('hi');</script>
執(zhí)行 JavaScript 警告的 HTML 文檔。請注意,關(guān)閉腳本標記是必需的。
這可以通過Linux和Mac OS X系統(tǒng)上的命令行uuencode
實用程序輕松完成:
uuencode -m infile remotename
infile
參數(shù)是要編碼為 Base64 格式的文件名,remotename
是不實際使用的遠程名稱data
網(wǎng)址的文件。
輸出結(jié)果如下所示:
begin-base64 664 test YSBzbGlnaHRseSBsb25nZXIgdGVzdCBmb3IgdGV2ZXIK====
數(shù)據(jù) URL 將使用初始標題行之后的編碼數(shù)據(jù)。
Web API 有基本的編碼或解碼到 base64:Base64 編碼和解碼。
本節(jié)介紹創(chuàng)建和使用data
網(wǎng)址時常見的問題。
語法data
網(wǎng)址的格式非常簡單,但很容易忘記在“數(shù)據(jù)”段之前放置逗號,或者錯誤地將數(shù)據(jù)編碼為 base64 格式。在 HTMLA data
網(wǎng)址中的格式在文件中提供了一個文件,該文件可能非常有用寬度相對于封閉文檔的寬度。作為一個 URL,data
應(yīng)該可以用空格(換行符,制表符或空格)來形成,但是在使用 base64編碼時會出現(xiàn)實際問題。延長限制盡管 Firefox 支持的data
網(wǎng)址長度基本上沒有限制,但瀏覽器不需要支持任何特定的最大值數(shù)據(jù)的長度。例如,Opera 11 瀏覽器限制 URL 長度為65535個字符data
網(wǎng)址為65529個字符(65529個字符是編碼數(shù)據(jù)的長度,而不是源,如果使用清楚地 data:
,不指定 MIME 類型)。缺少錯誤處理媒體中的參數(shù)無效或指定'base64'
時出現(xiàn)拼寫錯誤,但忽略錯誤提供。不支持查詢字符串等。
數(shù)據(jù) URL 的數(shù)據(jù)部分是不透明的,所以試圖在數(shù)據(jù) URL 中使用查詢字符串(包含<url>?parameter-data
語法的頁面特定參數(shù))將包含查詢字符串到 URL 所代表的數(shù)據(jù)中。例如:
data:text/html,lots of text...<p><a name%3D"bottom">bottom</a>?arg=val
這代表一個 HTML 資源,其內(nèi)容是:
lots of text...<p><a name="bottom">bottom</a>?arg=val
規(guī)范 | 標題 |
---|---|
RFC 2397 | “數(shù)據(jù)”URL方案 |
Feature | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
Basic Support | (Yes) | 121 | (Yes) | 82 | 7.20 | (Yes) |
CSS files | (Yes) | 121 | (Yes) | 82 91 | 7.20 | (Yes) |
HTML files | ? | No | ? | No | ? | ? |
JavaScript files | (Yes) | 121 | (Yes) | 91 | 7.20 | (Yes) |
Feature | Android | Chrome for Android | Edge mobile | Firefox for Android | IE mobile | Opera Android | iOS Safari |
---|---|---|---|---|---|---|---|
Basic Support | (Yes) | (Yes) | (Yes)1 | (Yes) | (Yes)1 | (Yes) | (Yes) |
CSS files | (Yes) | (Yes) | (Yes)1 | (Yes) | (Yes)1 | (Yes) | (Yes) |
HTML files | ? | ? | No | ? | No | ? | ? |
JavaScript files | (Yes) | (Yes) | (Yes)1 | (Yes) | (Yes)1 | (Yes) | (Yes) |
1. 最大支持的大小是4GB
2. 最大支持的大小是32kB