vue-dompurify-html

# vue-dompurify-html `vue-dompurify-html` هو توجيه لـ Vue.js يوفر بديلاً آمناً للتوجيه المدمج `v-html`. يستفيد من مكتبة DOMPurify لتعقيم محتوى HTML قبل عرضه، مما يساعد على منع ثغرات البرمجة النصية عبر المواقع (XSS). ## الميزات - **عرض HTML آمن**: ينظف سلاسل HTML تلقائياً باستخدام DOMPurify قبل إدخالها إلى DOM. - **استبدال مباشر**: يمكن استخدامه كبديل مباشر لـ `v-html` في مشاريع Vue 2 و Vue 3. - **قابل للتكوين**: يدعم خيارات تكوين مخصصة لـ DOMPurify لتخصيص قواعد التعقيم. - **دعم TypeScript**: يتضمن تعريفات TypeScript لتحسين تجربة المطور. ## التثبيت قم بتثبيت الحزمة عبر npm أو yarn: ```bash npm install vue-dompurify-html # or yarn add vue-dompurify-html ``` ## الاستخدام ### Vue 3 سجل التوجيه بشكل عام في ملف الدخول الخاص بالتطبيق: ```javascript import { createApp } from 'vue' import App from './App.vue' import VueDOMPurifyHTML from 'vue-dompurify-html' const app = createApp(App) app.use(VueDOMPurifyHTML) app.mount('#app') ``` ثم استخدمه في القوالب الخاصة بك: ```html <template> <div v-dompurify-html="htmlContent"></div> </template> ``` ### Vue 2 بالنسبة لـ Vue 2، قم باستيراد الحزمة وتسجيلها كإضافة: ```javascript import Vue from 'vue' import VueDOMPurifyHTML from 'vue-dompurify-html' Vue.use(VueDOMPurifyHTML) ``` ## التكوين يمكنك تمرير خيارات تكوين DOMPurify مباشرةً إلى التوجيه: ```html <div v-dompurify-html="{ content: htmlContent, options: { USE_PROFILES: { html: true } } }"></div> ``` بدلاً من ذلك، يمكنك تعيين الإعدادات الافتراضية العامة عند تسجيل الإضافة: ```javascript app.use(VueDOMPurifyHTML, { default: { USE_PROFILES: { html: true } } }) ``` ## الرخصة هذا المشروع مرخص بموجب رخصة MIT. انظر ملف [LICENSE](LICENSE) للحصول على التفاصيل. ## المساهمة نرحب بالمساهمات! يرجى قراءة [إرشادات المساهمة](CONTRIBUTING.md) قبل تقديم طلب السحب. ## الشكر والتقدير تم إلهام هذه الحزمة من الحاجة إلى طريقة أكثر أماناً لعرض HTML في تطبيقات Vue، وهي تبني على العمل الممتاز لفريق DOMPurify.