Data URIジェネレーター＆パーサー
テキストやファイルからData URIを生成し、既存のData URIを解析してコンテンツとメタデータを抽出します。
100%クライアントサイド — データがデバイスから離れることはありません
生成オプション
Data URIs in Code
How to programmatically generate and parse Data URIs.
JavaScript
// Generate a Data URI from text
const text = "Hello World";
const base64 = btoa(text);
const dataUri = `data:text/plain;base64,${base64}`;
console.log(dataUri); // data:text/plain;base64,SGVsbG8gV29ybGQ=
// Parse a Data URI
const uri = "data:text/plain;base64,SGVsbG8gV29ybGQ=";
const match = uri.match(/^data:([^;,]*)(;base64)?,(.*)$/);
if (match) {
const mime = match[1];
const isBase64 = !!match[2];
const data = match[3];
const decoded = isBase64 ? atob(data) : decodeURIComponent(data);
console.log({ mime, decoded }); // { mime: "text/plain", decoded: "Hello World" }
}よくある質問
以下を検索するか、よくある質問をご覧ください。
Data URIは、外部リソースであるかのようにWebページ内にデータをインラインで埋め込むことができるスキームです。HTMLやCSSに画像を埋め込むためによく使用されます。
いいえ、Data URIにはプレーンテキストやURLエンコードされたデータも含めることができます。ただし、画像などのバイナリファイルを埋め込む場合はBase64が標準です。