من 6 أخطاء CSP إلى صفر: تصحيح سياسة أمن المحتوى لـ AdSense

لا تخمن ما هو محظور. شاهد الفشل في الوقت الفعلي باتباع هذه الخطوات:

1. عطل أدوات حظر الإعلانات (فهي تخفي أخطاء CSP الحقيقية).
2. افتح DevTools ← Console.
3. قم بتحميل صفحتك وابحث عن أخطاء "Refused to load..." الحمراء.
4. اكتب كل نطاق (domain) محظور.

إذا نظرت فقط إلى أخطاء الإنتاج، ستفوتك متطلبات بيئة التطوير الخاصة.

في التطوير (Next.js npm run dev)، تحتاج إلى تصريحين إضافيين:

1. unsafe-eval: يستخدم Next.js دالة eval() للتحديث السريع (HMR).
2. ws://localhost: تستخدم إضافات مثل Console Ninja و HMR مقابس الويب (WebSockets).

إذا حظرت هذه الأشياء، ستتعطل بيئة التطوير المحلية لديك.

const isDev = process.env.NODE_ENV === "development";
const nonce = crypto.randomUUID().replace(/-/g, "");

const scriptSrc = [
  "'self'",
  `'nonce-${nonce}'`,
  isDev ? "'unsafe-eval'" : "", // السماح بـ eval في التطوير
  "https://www.googletagmanager.com",
  // ... نطاقات أخرى
]
  .filter(Boolean)
  .join(" ");

const connectSrc = [
  "'self'",
  isDev ? "ws://localhost:* ws://127.0.0.1:*" : "", // السماح بـ WebSockets في التطوير
  "https://www.google-analytics.com",
  "https://ep1.adtrafficquality.google", // نقاط SODAR الخاصة بـ AdSense
  "https://ep2.adtrafficquality.google",
  // ... نطاقات أخرى
]
  .filter(Boolean)
  .join(" ");

من خلال التجربة والخطأ، إليك قائمة النطاقات التي يحتاجها Google AdSense فعلياً:

• script-src: googletagmanager.com, google-analytics.com, pagead2.googlesyndication.com, fundingchoicesmessages.google.com
• connect-src: googleads.g.doubleclick.net, tpc.googlesyndication.com, fundingchoicesmessages.google.com, ep1.adtrafficquality.google, ep2.adtrafficquality.google
• frame-src: googleads.g.doubleclick.net, tpc.googlesyndication.com, fundingchoicesmessages.google.com, ep1.adtrafficquality.google, ep2.adtrafficquality.google

ملاحظة: تجنب الـ wildcard قدر الإمكان. أضف أي نطاق جديد فقط بعد التأكد من خطأ حقيقي في Console.

إليك الإعداد النهائي في src/proxy.ts الذي يتعامل مع كل من التطوير (HMR) والإنتاج (AdSense):

const nonce = crypto.randomUUID().replace(/-/g, "");
const isDev = process.env.NODE_ENV === "development";

const scriptSrc = [
  "'self'",
  `'nonce-${nonce}'`,
  "'strict-dynamic'",
  "https://www.googletagmanager.com",
  "https://www.google-analytics.com",
  "https://pagead2.googlesyndication.com",
  "https://fundingchoicesmessages.google.com",
  "https://tpc.googlesyndication.com",
  "https://googleads.g.doubleclick.net",
  isDev ? "'unsafe-eval'" : "",
]
  .filter(Boolean)
  .join(" ");

const connectSrc = [
  "'self'",
  "https://www.google-analytics.com",
  "https://region1.google-analytics.com",
  "https://www.googletagmanager.com",
  "https://pagead2.googlesyndication.com",
  "https://googleads.g.doubleclick.net",
  "https://adtrafficquality.google",
  "https://ep1.adtrafficquality.google",
  "https://ep2.adtrafficquality.google",
  "https://fundingchoicesmessages.google.com",
  "https://challenges.cloudflare.com",
  isDev ?  : ,
]
  .()
  .();

 csp = [
  ,
  ,
  ,
  ,
  ,
  ,
  ,
].();