اليوم سنشرح احد انوع الصور المستخدمة في الويب الحديث . ونرى لماذا استخدامها غير امن لموقعك او تطبيقك . سوف نقوم بشرح مبادئ SVG اولاً .
أولاً : مقدمة الى صور SVG
SVG هي اختصار ل Scalable Vector Graphics . فائدة SVG هي رسم متجهات الرسوم عن طريق XML .
يمكن ان نرسم صورة لشعار التوازن باستخدام XML :
http://isecur1ty-vulnerable-lab.com/blog/examples/svg/good.svg
يمكنك عمل عرض للكود المصدري لترى ان النقاط تم تحديدها بXML
لو اردت رسم دائرة يمكنك استعمال الكود الاتي في HTML
<!DOCTYPE html>
<html>
<body>
<h1>My first SVG</h1>
<svg width=”100″ height=”100″>
<circle cx=”50″ cy=”50″ r=”40″ stroke=”green” stroke-width=”4″ fill=”yellow” />
Sorry, your browser does not support inline SVG.
</svg>
</body>
</html>
تبدا صور svg بوسم <svg> وسبب استخدامها عدة اسباب :
- متعدد الاستعمالات .
- سهولة الحصول على القوالب .
- مضغوط .
- قابلة للاستعمال مع CSS .
- مفتوحة للجميع .
- جيدة جدا للاستخدام في الهواتف للاشكال والصور .
- سهلة التحليل وعملية .
ثانياً : تاريخ SVG
أول مرة تم اقتراحها من قبل بعض اعضاء W3C في عام 1998 . تم اشتقاقها من ادوبي Postscript و VML .
تم نطويرها والعمل عليها في 1999 .
SVG 1.0 انطلقت في 4 سبتمبر 2001
SVG 1.1 انطلقت في 15 يناير 2003
SVG 1.1 الاصدار الثاني انطلق في 16 اغسطس 2011
الاصدار 1.2 لا يزال كمسودة تحت التطوير .
انواع المتصفحات التي تدعم SVG
- Gecko
- Webkit
- Presto
- Trident
ثالثا: مميزات صور SVG
- الاشكال الهندسية : الدوائر , المربعات الخطوط وغيرها .
- خطوط SVG .
- الروابط .
- الانميشن والتحولات الشكلية .
- البيانات المتعددة او الMeta-data
- تنفيذ السكربتات والاحداث(الهجوم هنا)
- عالية الدقة .
- يمكن تحريرها من اي محرر نصوص .
الان لناتي للجانب المهم في SVG للمختبرين الامنين
رابعاً : SVG تحت الهجوم !
الجزء الاهم في ملفات SVG انها تعتبر حلقة وصل بين الصور وبين صفحات HTML المعلمة بXML .
اولا يجب ان نعرف ما هو MIME type ؟
MIME type : ويسمى media type وعادة ب content type في حال ارسال الملفات عبر الفورم ورفعها يتم تعريف الملف المرفوع بنوع الملف ولكل ملف MIME خاص به
مثلاً :
- application/json لملفات json
- text/html لصفحات HTML
- image/png لصور png
في حالة SVG يكون الMIME هو image/svg+xml هذا النوع مفيد جداً لانه سيفيدك في تخطي حماية رفع الملفات في اكثر الاحيان
المطور لا يكتب كل الMIME TYPE المسموح فهو يسمح لاي “صورة” ان ترفع لذلك يقوم بعمل الفتلر بالشكل image/~x وهذا يعني انه اي ملف نوع الMIME الخاص به يبدا ب image مسموح رفعه . وبسبب جهل اكثر المطورين ان صور SVG قد تحتوي على كود js فهم يسمحون بها مثال على ذلك احد اشهر المطورين في سكربت airship حيث قمت بابلاغه حول هذه المشكلة وكان متعجب من ان هذا الامر مسموح تنفيذ اكواد js في ملف صورة .
يمكنك الاطلاع على التقرير من هنا .
حتى ان منصة hackerone كتبوا مقال حول التقرير الخاص بي وناقشوا به العديد من الامور حول فكرة صور SVG .
يمكنك الدخول عليها من هنا
https://hackerone.com/blog/Hacktivity-Highlights:-XSS-via-SVG
الان لناخذ مثال على صورة SVG تنفذ كود JS على شكل رسالة
يمكنك تجربتها من الرابط التالي
http://isecur1ty-vulnerable-lab.com/blog/examples/svg/bad.svg
الصورة تحتوي على الكود التالي
لاحظ ان الكود يحتوي على سكربت وصيغة الصورة svg والMIME هو image/svg+xml هذا يجعل هذا الهجوم مناسب لعمل stored XSS ، يمكن وضع اكواد js في svg عن طريق احداث js او href الخاصة بوسم a او عدة طرق اخرى في xml.
كيف يتم تشغيل svg ؟
- الدخول المباشر الى ملف svg عن طريق المتصفح .
- وسم svg في html .
- استدعاء الصورة عن طريق وسم img (يجب ان لا يشغل js ).
- يمكن ايضا استدعاء الصورة عن طريق object .
svg مع XSS :
- svg المستخدمة في وسم صورة لا تشغل js نفس الحال في خطوط svg و استعمال svg عن طريق CSS .
- svg المستخدم في وسم iframe او embed او object يمرر js ويتم تنفيذه .
كل متصفح له خصائصه التي تختلف بعرض SVG وهناك امر مهم ان ملفات SVG يمكن ان تعمل محلياً لذلك في حالة تنزليها وعرضها محليا ايضاً ممكن ان تسبب خطر على المستخدمين .
كلمة اخيرة
اذا كنت مطور ويب او تعمل على برنامج رفع حاول تجنب السماح لصور SVG ان ترفع على موقعك . يمكنك ايضا استخدام svg في موقع في حال كانت static لكن لا تسمح برفعها . في حال احتجت الى اشكال وقابلية SVG اجعل عرضها عن طريق وسم IMG وامنع الوصول المباشر لها عن طريق تحميلها واضافة header يمنع المتصفح من عرض الملف في السيرفر .
مصادر
https://hackerone.com/reports/148853
تحياتي وتحيات فريق isecur1ty
هل يمكن عمل هجوم XXE باستخدام ملف SVG? انا سالت الكثير لاكن اكثرهم قالو نعم ولم يزيدو شيء!!
لا يمكن لان خدمة SVG تعمل في CLIENT SIDE
https://hackerone.com/reports/130661
??
مقال مهم وممتاز،
نشكرك على هذا المحتوى الرائع
واصل
awesome 🙂