เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ · HTML บรรณาธิการ WYSIWYG
เหตุใด execCommand จึงเลิกใช้และตัวแก้ไขเบราว์เซอร์ใดใช้แทน
· มันทำงานอย่างไร
html เป็นที่พอใจ นักพัฒนาเวิร์กโฟลว์
ครอบคลุมการขึ้นและลงของ document.execCommand เหตุใดเอาต์พุตจึงไม่สอดคล้องกัน และวิธีที่ผู้แก้ไขสมัยใหม่ใช้ Selection, Range และ beforeinput แทน
ปุ่มตัวหนาบรรทัดเดียวที่หยุดปลอดภัย — เปิดขึ้นด้วย execCommand('bold') และคำเตือนการเลิกใช้งาน
ปุ่มตัวหนาสามารถเรียกใช้เพียงครั้งเดียว: เน้นพื้นผิวการแก้ไข จากนั้นขอให้ `document.execCommand` ใช้ `bold` กับการเลือกปัจจุบัน ToolAcre ยังคงใช้เส้นทางนั้นเนื่องจากเบราว์เซอร์เป็นเจ้าของเครื่องหมายรูปหมวกและช่วงที่เลือกภายในองค์ประกอบที่แก้ไขได้ การเรียกแบบกะทัดรัดนั้นสะดวก แต่ความสะดวกสบายไม่ได้ทำให้ต้นไม้ผลลัพธ์สามารถคาดเดาได้
รหัสถือว่าการปฏิเสธเป็นเรื่องปกติ Wrapper คำสั่งจับข้อยกเว้น ประกาศว่าเบราว์เซอร์ปฏิเสธการดำเนินการ และสั่งให้ผู้เขียนไปที่โหมดต้นฉบับ ทางเลือกสำรองนั้นตรงไปตรงมามากกว่าการสัญญาว่าจะคลิกแถบเครื่องมือหนึ่งครั้งจะสร้างองค์ประกอบเฉพาะหรือทำงานเหมือนกันในทุกเครื่องยนต์
execCommand ทำอะไรและมาจากไหน — อธิบายต้นกำเนิดของมันใน Internet Explorer ยุคแรกๆ และการนำไปใช้ของเบราว์เซอร์ทุกตัว
Wrapper เดียวกันจะขับเคลื่อนรายการตัวหนา ตัวเอียง ไม่เรียงลำดับและเรียงลำดับ การลบการจัดรูปแบบ เลิกทำ ทำซ้ำ บล็อกการจัดรูปแบบ ลิงก์ และการยกเลิกการเชื่อมโยง นี่คือคำสั่งที่ปรากฏจริงในแถบเครื่องมือ บทความนี้ไม่ได้ขยายรายการด้วยการจัดตำแหน่ง สี แบบอักษร ตาราง รูปภาพ หรือคุณลักษณะ Rich-Text อื่นๆ ที่คุ้นเคยซึ่งการใช้งานไม่เคยเปิดเผย
ทุกคำสั่งทำงานกับ DOM ที่แก้ไขได้แบบเรียลไทม์ หลังจากนั้น แผงจะรีเฟรชแหล่งที่มา การแสดงตัวอย่าง จำนวนคำ และรายงานการลบออกจาก HTML ภายในปัจจุบัน ผลลัพธ์ที่บันทึกไว้จึงไม่ใช่บันทึกคำสั่ง เป็นการทำให้เป็นอนุกรมที่กรองแล้วของโครงสร้างใดก็ตามที่เบราว์เซอร์ทิ้งไว้หลังจากดำเนินการหรือปฏิเสธการดำเนินการที่ร้องขอ
เหตุใดคำสั่ง API จึงเลิกใช้แล้ว: เบราว์เซอร์สามารถสร้างรูปร่าง DOM ที่แตกต่างกันได้
การเลิกใช้งานมีความสำคัญเนื่องจาก API ไม่ได้ให้สัญญาเชิงโครงสร้างที่แม่นยำแก่ผู้เขียนบรรณาธิการสำหรับการกลายพันธุ์แต่ละครั้ง ข้อจำกัด ToolAcre เตือนอย่างชัดเจนว่าลักษณะการทำงานที่แตกต่างกันระหว่างเอ็นจิ้น โดยเฉพาะกับรายการที่ซ้อนกัน รายการที่มองเห็นอาจยอมรับได้ในขณะที่ตัวเลือกการซ้อนหรือตัวตัดคำนั้นแตกต่างจากมาร์กอัปที่เบราว์เซอร์อื่นสร้างขึ้น
ไม่มีแหล่งเก็บข้อมูลใดที่สนับสนุนการกล่าวอ้างว่าทุกเบราว์เซอร์ เวอร์ชัน หรือคำสั่งมีผลความเข้ากันได้โดยเฉพาะ ข้อความที่ปลอดภัยนั้นแคบกว่า: การใช้งานนี้จะเรียก API ที่เลิกใช้แล้ว จับการปฏิเสธ และเสนอการแก้ไขแหล่งที่มาโดยตรงเป็นช่องทางหลบหนี ทดสอบเบราว์เซอร์และการดำเนินการที่คุณต้องการใช้แทนที่จะคาดการณ์เมทริกซ์
การเลือกและช่วงเป็นทางเลือกที่เกี่ยวข้อง แต่เครื่องมือนี้ใช้ไม่ได้
การเลือกและช่วงสามารถอธิบายขอบเขต DOM ที่เลือก และสนับสนุนการจัดการต้นไม้อย่างชัดเจน แต่ ToolAcre ไม่ได้ใช้กลไกการจัดรูปแบบการแทนที่กับขอบเขตเหล่านั้น การตั้งชื่อ API เหล่านั้นราวกับว่าเป็นเส้นทางโค้ดปัจจุบันอาจทำให้ผลิตภัณฑ์เข้าใจผิดได้ ที่นี่ คำสั่งของเบราว์เซอร์ยังคงเป็นตัวกลายพันธุ์ และตัวฆ่าเชื้อยังคงเป็นขอบเขตเอาต์พุต
โมเดลแบบกำหนดเองสามารถเป็นเจ้าของเครื่องหมาย บล็อก ธุรกรรม และการแมปการเลือกได้ แต่นั่นเป็นสถาปัตยกรรมผลิตภัณฑ์ที่แตกต่างกันและมีการทดสอบที่แตกต่างกัน โปรแกรมแก้ไขน้ำหนักเบานี้จงใจหลีกเลี่ยงการอ้างสิทธิ์ในเครื่องจักรดังกล่าว สัญญาที่ตรวจสอบได้คือการดำเนินการด้วยภาพอาจสร้าง DOM ที่ขึ้นกับเบราว์เซอร์ ในขณะที่โหมดแหล่งที่มาจะแสดงมาร์กอัปที่กรองแล้วซึ่งจะถูกคัดลอกหรือดาวน์โหลดจริง
beforeinput ไม่ได้เป็นส่วนหนึ่งของเส้นทางการจัดรูปแบบของตัวแก้ไขนี้
การใช้งานยังไม่ขัดขวาง `beforeinput` เพื่อแปลความตั้งใจในการแก้ไขเป็นธุรกรรมที่กำหนดเอง เหตุการณ์อินพุตเพียงทริกเกอร์การรีเฟรชหลังจากที่เบราว์เซอร์เปลี่ยนพื้นผิว การวางและวางเป็นข้อยกเว้น: เหตุการณ์เหล่านั้นถูกป้องกัน คลิปบอร์ดหรือเพย์โหลดการถ่ายโอนจะถูกกรอง และเฉพาะผลลัพธ์ HTML หรือข้อความธรรมดาเท่านั้นที่ถูกแทรก
ความแตกต่างดังกล่าวขัดขวางการกล่าวอ้างทางสถาปัตยกรรมในวงกว้าง ToolAcre เป็นเจ้าของประตูการวาง แต่ไม่ใช่ทุกการเปลี่ยนแปลงการกดแป้นพิมพ์ การพิมพ์ทั่วไป การลบ การป้อนพฤติกรรม และคำสั่งแถบเครื่องมือยังคงดำเนินการแก้ไขเบราว์เซอร์ เครื่องฆ่าเชื้อจะตรวจสอบผลลัพธ์ที่ต่อเนื่องกัน มันไม่ได้เปลี่ยนตัวแก้ไขให้เป็นเฟรมเวิร์กที่ขับเคลื่อนด้วยอินพุตหรือทำให้การกลายพันธุ์ DOM ระดับกลางทุกรายการเป็นมาตรฐาน
ตัวอย่างการทำงาน: ตรวจสอบเอาต์พุตคำสั่งเดิมที่ตัวแก้ไขนี้สร้างขึ้นจริง
หากต้องการตรวจสอบอย่างเป็นรูปธรรม ให้พิมพ์ประโยคสั้น ๆ สองประโยค เลือกหนึ่งวลีแล้วกดตัวหนา สลับไปที่แหล่งที่มา HTML และตรวจสอบองค์ประกอบรอบๆ วลีนั้น ToolAcre จับคู่ `b` แบบเดิมกับ `strong` ระหว่างการฆ่าเชื้อ ดังนั้นผลลัพธ์ที่กรองจึงสามารถมีความหมายได้ แม้ว่าคำสั่งการแก้ไขแบบเรียลไทม์จะเลือกแท็กแบบเดิมในตอนแรกก็ตาม
ทำซ้ำกับรายการแล้วเลิกทำ แถบเครื่องมือส่ง `insertUnorderedList` และ `undo`; มันไม่ได้เก็บประวัติการสมัครแยกต่างหาก หากเบราว์เซอร์ปฏิเสธ ขอบเขตสถานะจะแจ้งเช่นนั้น หากการซ้อนดูแปลก โหมดแหล่งที่มาคือเส้นทางการแก้ไขที่รองรับ ผลลัพธ์ที่สังเกตได้ ไม่ใช่ป้ายกำกับปุ่ม คือหลักฐาน
สิ่งนี้ไม่ครอบคลุมถึง: ไม่มีการใช้สถาปัตยกรรมตัวแก้ไขทดแทนที่นี่
บทความนี้ไม่ได้อ้างสิทธิ์ในการสนับสนุนระบบคำสั่งการแทนที่ที่ทันสมัย ธุรกรรมการทำงานร่วมกัน แผนผังเบราว์เซอร์ข้ามที่กำหนด หรือสแต็กเลิกทำแบบกำหนดเอง นอกจากนี้ยังไม่อนุมานพฤติกรรมของแป้นพิมพ์ลัดเนื่องจากแหล่งที่มากำหนดการทำงานของแถบเครื่องมือ ไม่ใช่รีจิสทรีของทางลัด คุณลักษณะที่ไม่ได้รับการสนับสนุนยังคงละเว้นมากกว่าความสามารถโดยนัย
การรักษาความปลอดภัยแยกจากตัวเลือกคำสั่ง รายการที่อนุญาตกรองมาร์กอัปที่ปล่อยออกมาและตัวอย่างเป็นแบบแซนด์บ็อกซ์โดยไม่มีสคริปต์ แต่โปรแกรมฆ่าเชื้อปฏิเสธความรับผิดชอบอย่างชัดเจนว่าเป็นตัวกรอง XSS อินพุตที่ไม่เป็นมิตรทั่วไป เซิร์ฟเวอร์ที่ยอมรับเนื้อหาสิ่งพิมพ์ที่ไม่น่าเชื่อถือยังคงต้องการ HTML5-parser sanitizer ฝั่งเซิร์ฟเวอร์ที่เหมาะสมและนโยบายเฉพาะปลายทาง
ประเด็นสำคัญ: เป็นเจ้าของ DOM ไม่ใช่คำสั่ง — สรุปเส้นทางการย้ายข้อมูลและวิธีที่มาร์กอัปผลลัพธ์เป็นสิ่งที่คุณตรวจสอบในเครื่องมือ WYSIWYG-to-HTML
เป็นเจ้าของผลลัพธ์ที่คุณสามารถตรวจสอบได้ ในตัวแก้ไขนี้ คำสั่งจะขอให้เบราว์เซอร์แปลงโครงสร้างต้นไม้ที่แก้ไขได้ จากนั้นรายการที่อนุญาตจะเขียนการทำให้เป็นอนุกรมของต้นไม้นั้นใหม่เป็นชุดย่อยที่รองรับ โหมดแหล่งที่มาจะเปิดเผยแฮนด์ออฟและให้พื้นผิวการซ่อมแซมที่ใช้งานได้จริงเมื่อพฤติกรรมการแก้ไขเบราว์เซอร์ไม่สะดวกหรือไม่สอดคล้องกัน
ใช้ตัวอย่างแบบใช้แล้วทิ้งในเบราว์เซอร์เดียวกันกับงานจริงของคุณ ออกกำลังกายเฉพาะคำสั่งที่จัดส่ง ตรวจสอบลิงก์และการซ้อน ทดสอบเลิกทำก่อนใช้งาน และคัดลอก HTML ที่กรองแล้วหลังจากอ่านแล้วเท่านั้น ขั้นตอนการทำงานนั้นเคารพการเลิกใช้งานโดยไม่ต้องแสร้งว่า ToolAcre ได้แทนที่การแก้ไขพื้นฐานแล้ว API