استخدام ترميز Base64 لصور PNG في عناوين URI لبيانات CSS

من أجل تضمين صور PNG في أوراق أنماط CSS باستخدام معرفات URI للبيانات، بيانات PNG يجب أولاً ترميزه بتنسيق Base64. تسمح هذه التقنية بتضمين ملفات الصور الخارجية مباشرة داخل ورقة الأنماط.

حل سطر أوامر Unix:

base64 -i /path/to/image.png

سيقوم هذا الأمر بإخراج بيانات PNG المشفرة بـ Base64.

بايثون الحل:

import base64

with open("/path/to/image.png", "rb") as f:
    binary_data = f.read()

base64_data = base64.b64encode(binary_data).decode("utf-8")
ext = "png"

data_uri = f"data:image/{ext};base64,{base64_data}"

print(data_uri)

يقرأ برنامج Python النصي هذا ملف PNG في الوضع الثنائي، ويحوله إلى Base64، ثم ينشئ URI للبيانات، بما في ذلك نوع MIME المناسب وامتداده.

ملاحظات إضافية:

• تأكد من تضمين امتداد الصورة في URI للبيانات بعد نوع MIME، على سبيل المثال، "data:image/png;base64".
• استخدم طريقة "decode('utf-8')" في Python للتعامل مع أي مشكلات محتملة متعلقة بـ Unicode.