เครื่องมือตรวจสอบเนื้อหาผสม

HTML ที่ต้องสแกน

ตรวจจับทรัพยากร http:// ที่ถูกโหลดภายในหน้า HTTPS

ถัดไป

หลังจากย้ายเว็บไซต์ไปใช้โปรโตคอล HTTPS แล้ว หากมีแท็ก <img>, <script>, <link> หรือ <iframe> ที่ยังชี้ไปยัง http://... อยู่ จะทำให้สัญลักษณ์ล็อกสีเขียวแสดงขึ้น และในเบราว์เซอร์รุ่นใหม่ มักจะโหลดหน้าเว็บไม่เสร็จสมบูรณ์ เมื่อคุณป้อน URL โปรแกรมตรวจสอบนี้จะโหลดหน้าเว็บดังกล่าว ตรวจสอบทรัพยากรย่อยทั้งหมด (ภาพ ไฟล์สไตล์ สคริปต์ ฟอนต์ หากรีเฟอเรนซ์ วิดีโอ และเสียง) และระบุรายการที่ถูกส่งผ่านโปรโตคอล HTTP แบบธรรมดา เพื่อให้คุณสามารถแก้ไขได้ก่อนที่ผู้ใช้จะเห็นคำเตือนว่า “ไม่ปลอดภัยอย่างสมบูรณ์”

วิธีการทำงานของเครื่องสแกน

  1. 1

    กรุณาป้อน URL

    URL แบบ HTTPS สแกนเนอร์จะดำเนินการตามการเปลี่ยนเส้นทางเพียงขั้นตอนเดียว

  2. 2

    ได้รับข้อมูลจากหน้านี้แล้ว

    HTML จะถูกวิเคราะห์สำหรับการอ้างอิงส่วนประกอบย่อยทุกครั้ง

  3. 3

    การอ้างอิงแต่ละรายการถูกจัดประเภทไว้แล้ว

    HTTPS, HTTP หรือโปรโตคอลที่เกี่ยวข้อง (`//cdn...`)

  4. 4

    รายงานที่จัดกลุ่มตามประเภท

    เนื้อหาแบบแอ็กทีฟเทียบกับแบบพาสซีฟ พร้อมการจัดลำดับตามระดับความรุนแรง

เนื้อหาผสมแบบแอ็กทีฟเทียบกับแบบพาสซีฟ

เบราว์เซอร์จัดการเนื้อหาทั้งสองประเภทต่างกัน:

  • เนื้อหาผสมแบบแอ็กทีฟ (สคริปต์, iframe, สไตล์ชีต, XHR/fetch, worker, WebSocket) เบราว์เซอร์สมัยใหม่จะบล็อกทันที ประกอบด้วย: <script>, <link rel="stylesheet">, <iframe>, fetch(), XMLHttpRequest และ importScripts()
  • เนื้อหาผสมแบบพาสซีฟ (ภาพ วิดีโอ และโปสเตอร์เสียง) ถูกโหลดแต่ถูกทำเครื่องหมาย: สัญลักษณ์ล็อกจะหายไป และแถบ URL จะแสดงคำเตือน ประกอบด้วย: <img>, <audio>, <video> และเป้าหมาย action ของฟอร์ม

ทำไมเรื่องนี้จึงสำคัญ

  • ความไว้วางใจ: ล็อคที่เสียหายจะสื่อให้ผู้ใช้รับรู้ได้ว่า “เว็บไซต์นี้ไม่ปลอดภัย”
  • ความสามารถในการใช้งาน: เมื่อเนื้อหาที่ใช้งานอยู่ถูกบล็อก สคริปต์จะไม่ทำงาน และไฟล์สไตล์ก็จะไม่ถูกประมวลผล ทำให้หน้าเว็บดูผิดปกติหรือไม่สมบูรณ์
  • SEO: กูเกิลให้ความสำคัญกับหน้าเว็บที่ใช้โปรโตคอล HTTPS มากกว่า การทำงานของโปรโตคอล HTTPS ที่ผิดปกติจะส่งผลเสียต่ออันดับการจัดอันดับโดยอ้อม
  • การปฏิบัติตามข้อกำหนด: PCI DSS และกรอบการทำงานด้านการปฏิบัติตามข้อกำหนดอื่นๆ อีกหลายฉบับกำหนดให้ใช้โปรโตคอล HTTPS โดยห้ามมีเนื้อหาผสม (mixed content) บนหน้าเว็บที่เกี่ยวข้องกับการทำธุรกรรม

แหล่งข้อมูลทั่วไป

แหล่งที่มา วิธีแก้ไขทั่วไป
CDN แบบดั้งเดิมบน HTTP เปลี่ยนโดเมนเป็น CDN ที่ใช้ HTTPS
รหัสฝังเดิมของ YouTube/Vimeo อัปเดตรหัสฝังให้เป็นเวอร์ชันล่าสุด
URL ของสคริปต์เครือข่ายโฆษณา ใช้เวอร์ชัน HTTPS (มีให้ใช้งานมาหลายปีแล้ว)
ฟอนต์และแผนที่จากบุคคลที่สาม เปลี่ยน http://fonts.googleapis.com เป็น https://
วิดเจ็ตปุ่มโซเชียล ใช้โค้ดวิดเจ็ตปัจจุบัน
URL ของภาพที่ผู้ใช้สร้างขึ้น เขียนใหม่เมื่อบันทึก; โหลดผ่านโปรกซีขณะแสดงผล
URL ที่ถูกเขียนไว้ในโค้ดของโพสต์บล็อก การค้นหาและแทนที่แบบกลุ่มในฐานข้อมูล

วิธีแก้ไขปัญหา

  1. URL ที่ขึ้นอยู่กับโปรโตคอล (//cdn.example.com/a.js): ใช้โปรโตคอลของหน้าเว็บในปัจจุบันในการโหลดเนื้อหา เหมาะสำหรับ CDN ส่วนใหญ่ แต่ถือว่าล้าสมัยแล้ว, ควรใช้ https://... แทนอย่างชัดเจน
  2. เขียนใหม่ในแหล่งที่มา ปรับปรุงเทมเพลตและเนื้อหาให้ใช้รหัส https:// จากนั้นสแกนฐานโค้ดโดยใช้รูปแบบคำสั่ง regex: http://(?!localhost)
  3. การอัปเกรดนโยบายความปลอดภัยของเนื้อหา: Content-Security-Policy: upgrade-insecure-requests แจ้งให้เบราว์เซอร์เปลี่ยน URL ของสื่อประเภท HTTP เป็น HTTPS โดยไม่แสดงข้อความเตือนใดๆ เหมาะอย่างยิ่งสำหรับเว็บไซต์ที่ไม่สามารถตรวจสอบ URL ทุกตัวได้
  4. เทียบเท่ากับ <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"> ในรูปแบบที่ใช้งานโดยตรง (inline equivalent)
  5. สำหรับสื่อประเภท Proxy HTTP-only ให้ผ่านทางจุดเริ่มต้นที่รองรับ HTTPS หากแหล่งข้อมูลด้านต้นทางไม่มีจุดปลายทางที่รองรับ HTTPS เลยจริงๆ (ซึ่งพบได้น้อยในปัจจุบัน)

สิ่งที่เครื่องตรวจสอบพบ

  • URL ภายนอกทั้งหมดที่อ้างถึงใน <img>, <script>, <link>, <iframe>, <video>, <audio> และ <source>
  • แอตทริบิวต์ action ของฟอร์ม
  • การอ้างอิง url(...) ใน CSS แบบ inline ภายในบล็อก <style>
  • ไม่สามารถตรวจสอบทรัพยากรที่ถูกแทรกด้วย JavaScript ได้ เนื่องจากทรัพยากรเหล่านี้จะถูกเพิ่มเข้าไปในขณะทำงานของโปรแกรม และจำเป็นต้องมีการตรวจสอบจากฝั่งเบราว์เซอร์ (แผงปัญหาใน Chrome DevTools สามารถตรวจพบกรณีดังกล่าวได้)

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

บางส่วน โดยเฮดเดอร์หรือแท็กเมตา upgrade-insecure-requests CSP จะแจ้งให้เบราว์เซอร์เปลี่ยน URL ของซับรีซอร์สเซส HTTP เป็น HTTPS อัตโนมัติ การเปลี่ยนแปลงนี้จะทำงานได้ก็ต่อเมื่อเซิร์ฟเวอร์รองรับ HTTPS หากเซิร์ฟเวอร์ด้านต้นทางใช้เพียง HTTP เท่านั้น การเปลี่ยนแปลงจะล้มเหลว

ไม่ แสดงเฉพาะทรัพยากรที่ระบุไว้ใน HTML แบบสแตติกเท่านั้น สคริปต์ที่สร้างองค์ประกอบ <img> ในขณะรันจะไม่ปรากฏ และแผงปัญหาของ Chrome DevTools จะตรวจจับสิ่งเหล่านี้ได้ภายในเบราว์เซอร์

ฟีเจอร์นี้ปลอดภัยสำหรับเนื้อหาผสมบนหน้าเว็บที่ใช้ HTTPS (โดยสืบทอดคุณสมบัติของ HTTPS) แต่จะไม่ทำงานได้บนเครื่องมือภายในที่รองรับเฉพาะ HTTP หรือบนหน้าเว็บที่ถูกจัดเก็บเป็นไฟล์โบราณ และได้รับการยกเลิกการใช้งานแล้ว ควรใช้ https:// อย่างชัดเจนแทน

แคชของเบราว์เซอร์ ให้ใช้การรีเฟรชใหม่ (Ctrl+Shift+R / Cmd+Shift+R) หรือทดสอบในหน้าต่างแบบอินคิกโนเกทเพื่อยืนยันว่าปัญหาได้รับการแก้ไขแล้ว รายงานจาก CSP และคำเตือนในคอนโซลจะแสดงสถานะปัจจุบัน

โปรแกรมดึงข้อมูลฝั่งเซิร์ฟเวอร์จะดาวน์โหลดหน้าเว็บเพื่อนำมาวิเคราะห์ โดยตัว URL เองจะไม่ถูกเก็บไว้นอกเหนือจากข้อมูลในคำขอ

เครื่องมือที่เกี่ยวข้อง

เครื่องมือตรวจสอบความยาวของคำอธิบายเมตา

วัดคำอธิบายเมตาเป็นจำนวนอักขระและพิกเซลโดยประมาณ เปรียบเทียบแนวทางการเรียบเรียง และดูตัวอย่างการจัดวางบนเดสก์ท็อปกับมือถือ

เครื่องดึงลิงก์ภายนอก

วางโค้ด HTML ดิบ และระบุ URL ฐานได้ตามต้องการ จากนั้นรับรายการลิงก์ภายนอก http/https ทั้งหมดในโค้ดแบบไม่มีรายการซ้ำ เพื่อใช้ตรวจสอบลิงก์และประเมินผล SEO

เครื่องมือตรวจสอบเฮดเดอร์ความปลอดภัย HTTP

วาง HTTP response headers แล้วตรวจ HSTS, CSP, clickjacking, MIME, referrer และนโยบาย cross-origin ภายในเบราว์เซอร์

เครื่องมือสร้างสเกมาสำหรับคำถามบ่อย (FAQ Schema Generator)

สร้างมาร์กอัป JSON-LD แบบ FAQPage จากคู่คำถามและคำตอบ เพื่อให้หน้าเว็บของคุณเข้าเกณฑ์ผลการค้นหาแบบสมบูรณ์ (rich results) และกล่องคำตอบของ Google

ตัวจำลองผลการค้นหา Google

ดูตัวอย่างผลค้นหาแบบ Google โดยประมาณด้วยขีดจำกัดจำนวนอักขระสำหรับมือถือและเดสก์ท็อป ร่างของคุณอยู่ในเซสชันเบราว์เซอร์นี้เท่านั้น

เครื่องมือตรวจสอบ XML Sitemap

ตรวจสอบ XML Sitemap ในเบราว์เซอร์เพื่อค้นหาข้อผิดพลาดในการแยกวิเคราะห์ ตำแหน่งที่ขาดหาย URL ซ้ำ และค่าฟิลด์ที่พบบ่อย

เครื่องมือนี้มีให้บริการในภาษาอื่น