logo
GeekFormat

CSP Builder

แม่แบบนโยบาย

เริ่มต้นโดยเลือกแม่แบบ จากนั้นปรับแต่งคำสั่งให้เหมาะสมกับความต้องการทางธุรกิจของคุณ

ตัวแก้ไขคำสั่ง

แก้ไขคำสั่งทีละบรรทัด รองรับการเพิ่ม ลบ และแทรกแหล่งที่มาอย่างรวดเร็ว

ผลลัพธ์ที่ส่งออก

Content-Security-Policy
ส่วนหัว HTTP
Content-Security-Policy: default-src 'self'; script-src 'self' https:; style-src 'self' 'unsafe-inline' https:; img-src 'self' data: https:; connect-src 'self' https:; frame-ancestors 'self'
Meta HTML
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' https:; style-src 'self' 'unsafe-inline' https:; img-src 'self' data: https:; connect-src 'self' https:; frame-ancestors 'self'">

คำเตือนเกี่ยวกับความเสี่ยง

มี 'unsafe-inline' ซึ่งลดการป้องกัน XSS
แนะนำให้กำหนด object-src 'none' อย่างชัดเจน

สร้าง CSP ออนไลน์ ตั้งค่ากฎของแหล่งที่มาให้ถูกต้องและชัดเจน

คำแนะนำที่เกี่ยวข้อง

กรณีการใช้งาน

  • สร้าง CSP ที่นำไปใช้งานได้จริงก่อนนำเว็บไซต์ขึ้นระบบ เพื่อลดความเสี่ยงจากการถูกฉีดสคริปต์ (Script Injection) และทรัพยากรภายนอกที่ควบคุมไม่ได้
  • ตั้งค่า frame-ancestors เป็น 'none' ในระบบจัดการหลังบ้านเพื่อป้องกันไม่ให้หน้าเว็บถูกนำไปฝังในเว็บไซต์ตกปลา (Phishing)
  • สลับไปใช้เทมเพลตสำหรับสภาพแวดล้อมการพัฒนาเพื่ออนุญาต http:, ws:, 'unsafe-inline' และ 'unsafe-eval'
  • สร้าง CSP Header และ meta tag สำหรับ Nginx, Cloudflare หรือ Backend เพื่อความปลอดภัยที่ครบถ้วน

คุณสมบัติ

  • กำหนดกฎแยกตามประเภททรัพยากร: จัดระเบียบสคริปต์, สไตล์, รูปภาพ และที่อยู่ API ไม่ให้ปะปนกัน
  • เพิ่มความมั่นใจก่อนนำขึ้นระบบจริง: เริ่มต้นด้วย CSP พื้นฐานแล้วค่อยๆ ปรับให้เข้มงวดขึ้นตามความต้องการ
  • ลดข้อผิดพลาดในรายการที่อนุญาต: ช่วยลดปัญหาการพิมพ์ชื่อโดเมนผิด, ลืมใส่เครื่องหมายอัฒภาค (;) หรือการขัดกันของกฎที่พบบ่อย
  • สร้างเสร็จพร้อมใช้งานทันที: คัดลอกไปใช้ในเซิร์ฟเวอร์, CDN หรือ Gateway ด้านความปลอดภัยได้ทันที

วิธีการใช้งาน

  1. เลือกเทมเพลตที่เหมาะสม (เข้มงวดสำหรับระบบจริง, แนะนำแบบสมดุล หรือสำหรับการพัฒนาในเครื่อง) หรือเพิ่มคำสั่งเอง
  2. แก้ไขค่าแหล่งที่มาในแต่ละคำสั่ง โดยใช้ปุ่มลัดเพื่อเพิ่ม 'self', https: และเครื่องหมายอื่นๆ ได้อย่างรวดเร็ว
  3. เลือกว่าจะเปิดโหมด Report-Only หรือไม่ พร้อมพรีวิว HTTP Response Header และ HTML meta tag ที่สร้างขึ้น
  4. ตรวจสอบคำเตือนเกี่ยวกับความเสี่ยง และคัดลอกเนื้อหา CSP ไปใช้ในคอนฟิกเซิร์ฟเวอร์หรือแท็ก head ของหน้าเว็บ

คำถามที่พบบ่อย

CSP ช่วยแก้ปัญหาอะไรได้บ้าง?

CSP ใช้สำหรับจำกัดว่าหน้าเว็บสามารถโหลดสคริปต์, สไตล์, รูปภาพ, API และ iframe จากแหล่งใดได้บ้าง ซึ่งเป็นหัวใจสำคัญของความปลอดภัยพื้นฐานในฝั่ง Frontend

ข้อผิดพลาดที่พบบ่อยที่สุดในการตั้งค่า CSP คืออะไร?

ปัญหาที่พบบ่อยคือการระบุโดเมนที่อนุญาตไม่ครบถ้วน, การลืมอนุญาตโดเมนของ CDN, การบล็อกสคริปต์หรือสไตล์แบบอินไลน์โดยไม่ตั้งใจ และความแตกต่างระหว่างแหล่งที่มาในเครื่องกับระบบจริง

เหมาะสำหรับการตั้งค่าใน Nginx, Cloudflare หรือ Backend หรือไม่?

เหมาะมาก เนื้อหา CSP ที่สร้างขึ้นสามารถคัดลอกไปวางในคอนฟิกของ Nginx, Apache, Node.js, Java, Cloudflare หรือส่วนหัวความปลอดภัยอื่นๆ ได้ทันที

เครื่องมือนี้เหมาะสำหรับตรวจสอบความปลอดภัยก่อนนำเว็บไซต์ขึ้นระบบจริงหรือไม่?

เหมาะอย่างยิ่ง ช่วยให้นักพัฒนาและทีม DevOps สร้างกฎ CSP พื้นฐานได้อย่างรวดเร็ว ลดโอกาสในการลืมหรือเขียนกฎผิดรูปแบบ

เครื่องมือสร้าง Authentication Headerเครื่องมือวิเคราะห์ Cache-Controlเครื่องมือวิเคราะห์ Content-Dispositionเครื่องมือสร้าง CORS Headerเครื่องมือตรวจสอบ CORSCSP Builderตัวแปลง cURL เป็นโค้ดตรวจสอบการแพร่กระจาย DNS ทั่วโลกค้นหา DNSForwarded Header Parserเครื่องมือสร้าง Hreflang TagHSTS AnalyzerHTTP Cookie ParserHTTP Headers CheckerHTTP Request Runnerค้นหารหัสสถานะ HTTPค้นหา IPตัวแปลง IPv4เครื่องมือขยายช่วง IPv4เครื่องมือจัดการที่อยู่ IPv6ตัวแยกวิเคราะห์ส่วนหัว Linkค้นหา MX Recordตรวจสอบพอร์ตสร้างพารามิเตอร์ URLตัวแยกวิเคราะห์ส่วนหัว Rate Limitเครื่องมือตรวจสอบห่วงโซ่การเปลี่ยนเส้นทางสร้าง Robots.txtตรวจสอบ Robots.txtตรวจสอบส่วนหัวความปลอดภัยสร้าง Security.txtตัวแยกวิเคราะห์ Set-Cookieตรวจสอบเครือข่ายเว็บไซต์สร้าง Sitemapตรวจสอบ Sitemapตัวตรวจสอบใบรับรอง SSLเครื่องคำนวณซับเน็ตตัวแยกวิเคราะห์ URLตัวแยกวิเคราะห์ User-Agentตัวสร้างลิงก์ UTMทดสอบ WebSocketWhat Is My IP?ค้นหา WHOIS