วิธีใช้งาน
- เลือก Encode เพื่อทำให้ข้อความปลอดภัยสำหรับใช้ใน HTML หรือเลือก Decode เพื่อแปลงเอนทิตีกลับเป็นอักขระ
- เมื่อ encode ให้เลือกว่าจะคงตัวอักษรที่มีเครื่องหมายกำกับเสียงและสัญลักษณ์ไว้เหมือนเดิม หรือแปลงเป็นเอนทิตี
- พิมพ์หรือวางข้อความ แล้วผลลัพธ์จะอัปเดตทันที
- คัดลอกผลลัพธ์ หรือเลือก “ใช้ผลลัพธ์เป็นอินพุต” เพื่อตรวจสอบว่าถอดรหัสกลับเป็นข้อความต้นฉบับได้หรือไม่
วิธีการทำงาน
ใน HTML อักขระบางตัวมีความหมายพิเศษ: < ใช้เริ่มแท็ก, & ใช้เริ่มเอนทิตี และ " หรือ ' ใช้ปิดค่าของแอตทริบิวต์ หากต้องการแสดงอักขระเหล่านี้เป็นข้อความ ต้องเขียนเป็นการอ้างอิงอักขระ: < สำหรับ <, > สำหรับ >, & สำหรับ &, " สำหรับ " และ ' สำหรับ ' เครื่องหมายอะพอสทรอฟีใช้รูปแบบตัวเลข เพราะ ' ไม่ได้กำหนดไว้ใน HTML 4.
อักขระอื่นทั้งหมด รวมถึงตัวอักษรที่มีเครื่องหมายกำกับ ข้อความภาษาจีน และอีโมจิ สามารถเขียนได้โดยตรงเมื่อบันทึกและแสดงหน้าเว็บด้วย UTF-8 ซึ่งเป็นค่าเริ่มต้นของเว็บไซต์สมัยใหม่ การแปลงอักขระเหล่านี้เป็นเอนทิตีจำเป็นเฉพาะกับระบบที่ไม่รองรับ UTF-8 อย่างปลอดภัย เช่น เทมเพลตอีเมลหรือฐานข้อมูลเก่าบางระบบ คุณสามารถเลือกใช้เอนทิตีแบบมีชื่อ เช่น é เมื่อมีชื่อที่ใช้กันทั่วไป (และใช้รูปแบบตัวเลขแทนในกรณีอื่น) หรือใช้การอ้างอิงแบบตัวเลข เช่น é สำหรับทุกอักขระ
การถอดรหัสไม่ได้ใช้ตัวแยกวิเคราะห์ HTML ของเบราว์เซอร์ แต่ใช้ตารางในตัวที่มีเอนทิตีแบบมีชื่อทั้ง 252 รายการจาก HTML 4.01, ' และชื่อที่ใช้กันทั่วไปใน HTML5 อีกประมาณ 30 รายการ รวมถึงการอ้างอิงแบบเลขฐานสิบและฐานสิบหก การอ้างอิงแบบตัวเลขเป็นไปตามกฎของ HTML5: �, ค่า surrogate และค่าที่สูงกว่า U+10FFFF จะกลายเป็นอักขระแทนที่ � ส่วนค่า 128–159 จะอ่านเป็น Windows-1252 ดังนั้น – จึงกลายเป็น en dash นอกจากนี้ยังรองรับชื่อแบบเก่าบางรายการ เช่น & และ © ที่ไม่มีเซมิโคลอนปิดท้าย เช่นเดียวกับเบราว์เซอร์ HTML5 กำหนดชื่อไว้มากกว่า 2,000 รายการ ชื่อที่พบไม่บ่อยและไม่มีในตารางจะคงเดิมและแสดงไว้ในรายการ
การ escape ข้อความก่อนแทรกลงใน HTML เป็นมาตรการสำคัญในการป้องกัน cross-site scripting (XSS) แต่ใช้ได้ถูกต้องเฉพาะกับเนื้อหาในองค์ประกอบและค่าแอตทริบิวต์ที่ครอบด้วยเครื่องหมายคำพูด ข้อความที่ใส่ไว้ในบล็อก <script>, แอตทริบิวต์ style หรือ URL ต้องใช้วิธี escape แบบอื่น
ตัวอย่าง
แสดงโค้ดบนหน้าเว็บ
หากต้องการแสดง <div class="box"> เป็นข้อความในโพสต์บล็อก ให้แปลงเป็น <div class="box"> เบราว์เซอร์จะแสดงแท็กเดิมเป็นข้อความ แทนการสร้างองค์ประกอบ
เตรียมข้อความสำหรับเทมเพลตอีเมลรุ่นเก่า
เมื่อเลือก “เอนทิตีแบบมีชื่อเมื่อมี” ข้อความ “Café – 5 €” จะกลายเป็น Café – 5 € ซึ่งแสดงผลได้ถูกต้อง แม้อีเมลจะส่งด้วยชุดอักขระที่ไม่ใช่ UTF-8
จัดระเบียบข้อความที่ดึงมาหรือส่งออก
ไฟล์ส่งออกจาก CMS มีข้อความ Fish & Chips – £9 เมื่อถอดรหัสแล้วจะได้ Fish & Chips – £9 พร้อมนำไปวางในสเปรดชีต
คำถามที่พบบ่อย
อักขระใดบ้างที่ต้อง escape ใน HTML?
ในเนื้อหาของ element ต้อง escape อักขระ & และ < (แนะนำให้ escape > ด้วย) ส่วนค่าแอตทริบิวต์ ต้อง escape อักขระเครื่องหมายคำพูดที่ใช้ครอบค่าด้วย กฎง่าย ๆ ที่ปลอดภัยคือ escape อักขระพิเศษทั้งห้าตัว (& < > " ') ทุกที่ ซึ่งเป็นวิธีที่เครื่องมือนี้ใช้
เอนทิตีแบบมีชื่อกับแบบตัวเลขต่างกันอย่างไร?
เอนทิตีแบบมีชื่อ เช่น © อ่านเข้าใจง่ายกว่า แต่มีให้ใช้กับอักขระเพียงบางชุดเท่านั้น ส่วนการอ้างอิงอักขระแบบตัวเลข เช่น © (เลขฐานสิบ) หรือ © (เลขฐานสิบหก) ใช้ได้กับอักขระ Unicode ทุกตัว รวมถึงอีโมจิ
ทำไม ที่ถอดรหัสแล้วจึงดูเหมือนช่องว่าง?
คือช่องว่างแบบไม่ตัดบรรทัด (U+00A0) หน้าตาเหมือนช่องว่างปกติ แต่ป้องกันการขึ้นบรรทัดใหม่และจะไม่ถูกรวมช่องว่างโดย HTML เป็นอักขระคนละตัวกับช่องว่างทั่วไป ซึ่งสำคัญเมื่อเปรียบเทียบหรือค้นหาข้อความ
ต้อง encode ตัวอักษรที่มีเครื่องหมายกำกับเสียง เช่น é ไหม?
ไม่จำเป็น หากหน้าเว็บใช้ UTF-8 (<meta charset="utf-8">) ซึ่งหน้าเว็บสมัยใหม่เกือบทั้งหมดใช้การตั้งค่าเริ่มต้นไว้ แล้ว escape เฉพาะอักขระพิเศษทั้งห้าตัวก็พอ
การ encode เพียงพอที่จะป้องกัน XSS หรือไม่?
เพียงพอสำหรับข้อความที่ไม่น่าเชื่อถือซึ่งแทรกในเนื้อหาของ element HTML หรือในค่าแอตทริบิวต์ที่มีเครื่องหมายคำพูดครอบไว้ แต่ไม่เพียงพอสำหรับโค้ด JavaScript, CSS, แอตทริบิวต์ที่ไม่มีเครื่องหมายคำพูด หรือ URL เช่น href="javascript:…" ซึ่งต้องจัดการให้เหมาะกับบริบทนั้น ๆ
ความเป็นส่วนตัว
การเข้ารหัสและถอดรหัสทำด้วยการจัดการสตริงในเบราว์เซอร์ ข้อความของคุณจะไม่ถูกแสดงผลเป็น HTML อัปโหลด จัดเก็บ หรือนำไปรวมในข้อมูลวิเคราะห์