🍋
Menu
Web

Data URI

Data URI (مخطط البيانات المباشرة)

مخطط URL يضمّن محتوى الملف مباشرة في HTML أو CSS أو JavaScript باستخدام التنسيق data:[نوع الوسائط][;base64],بيانات، مما يلغي الحاجة لطلب HTTP منفصل لجلب المورد.

التفاصيل التقنية

تتبع Data URIs الصيغة: data:[<نوع MIME>][;charset=<ترميز>][;base64],<بيانات>. تُستخدم عادةً للصور الصغيرة (أيقونات، SVG) وخلفيات CSS وملفات الخطوط لتقليل رحلات HTTP ذهابًا وإيابًا. ومع ذلك، لا يمكن للمتصفح تخزين Data URIs مؤقتًا بشكل منفصل، وتزيد حجم ملف HTML/CSS بنسبة ~33% (زيادة base64)، وتخضع لقيود الحجم في بعض المتصفحات (2 ميغابايت في IE القديم، غير محدودة عمومًا في المتصفحات الحديثة). بالنسبة لـ SVG، يتجنب المتغير المرمز بـ URL (data:image/svg+xml,...) زيادة base64 بالكامل.

مثال

```javascript
// Encode string to Base64
const encoded = btoa('Hello, World!');  // 'SGVsbG8sIFdvcmxkIQ=='

// Decode Base64 to string
const decoded = atob('SGVsbG8sIFdvcmxkIQ==');  // 'Hello, World!'

// File to Base64 Data URI
const reader = new FileReader();
reader.onload = () => console.log(reader.result);
// → 'data:image/png;base64,iVBORw0KGgo...'
reader.readAsDataURL(file);
```

صيغ ذات صلة

أدوات ذات صلة

مصطلحات ذات صلة