الأمان

CSP صارمة وTrusted Types وما يجب فعله على الخادم.

في هذه الصفحة

يعمل المحرّر تحت سياسة أمان محتوى (CSP) صارمة مع Trusted Types، وهذا الموقع نفسه يعمل تحت هذه السياسة.

طبقات الحماية

طبقات الأمان
الطبقة	ماذا تفعل
المدخلات	يمرّ كل مسار إدخال (المحتوى الابتدائي و`setContent` واللصق والإفلات وعرض المصدر) عبر DOMPurify. وتُزال العناصر القادرة على تنفيذ سكربت قبل التحليل.
النموذج	لا يبقى إلا المحتوى المعروف في المخطط (schema)، ما لم تُضف `HtmlSupport`، وحتى حينها تُطبَّق قائمة الحظر الخاصة بها.
المخرجات	تُنتَج `getHTML()` عبر مُسلسِل لا يستخدم DOM. يتحقق من أسماء الوسوم والسمات، ويهرّب كل قيمة، ويفحص كل رابط مرة أخرى.
الروابط	المسموح افتراضيًا: `http` و`https` و`mailto` و`tel` مع الروابط النسبية. وصور `data:` معطّلة ما لم تضبط `urlPolicy.allowDataImages`.
CSP	يعمل تحت `script-src 'self'; style-src 'self'; require-trusted-types-for 'script'`. ولا يكتب العرض الحي أي سلاسل style مضمّنة.
Trusted Types	يضيف سياسة واحدة باسم `open-wysiwyg-editor` إلى توجيه `trusted-types` لديك، أو مرّر سياستك عبر `setTrustedTypesPolicy()`.

سياسة موصى بها

أضف اسم سياسة المحرّر إلى trusted-types. ويستخدم اللصق أيضًا سياسة ProseMirrorClipboard من ProseMirror، فأضفها كذلك.

Terminal

Content-Security-Policy: default-src 'self'; script-src 'self'; style-src 'self';
  img-src 'self' https: data:; require-trusted-types-for 'script';
  trusted-types open-wysiwyg-editor ProseMirrorClipboard

Trusted Types

مع require-trusted-types-for 'script' يحتاج كل مصرف HTML إلى قيمة موثوقة. ينشئ المحرّر سياسة واحدة ويستخدمها في كل مكان.

المتصفح ليس حدًّا أمنيًا

لا تثق أبدًا في HTML القادم من العميل. ينظّف المحرّر ما يحمّله وما ينتجه، لكن يستطيع أي شخص إرسال أي نص إلى واجهتك البرمجية. عقّم مرة أخرى على الخادم بمكتبة تثق بها قبل التخزين أو العرض لمستخدمين آخرين.

TypeScript

import sanitizeHtml from "sanitize-html"; // or isomorphic-dompurify

export async function savePost(formData: FormData) {
  const body = sanitizeHtml(String(formData.get("body") ?? ""));
  // store `body`
}

للمحتوى الابتدائي القادم من المستخدمين، استخدم خاصية value أو عنصر <template> داخل <owe-editor>، ولا تضع المحتوى مباشرة كأبناء. فلا يستطيع أيٌّ منهما تنفيذ شيء قبل أن يعقّمه المحرّر.

وجدت ثغرة؟ أبلغ عنها بشكل خاص، راجع سياسة الأمان.

عدّل هذه الصفحة على GitHub