ความละเอียดหน้าจอกับขนาดหน้าต่างต่างกันอย่างไร เข้าใจพารามิเตอร์ขนาดในฟิงเกอร์ปริ้นท์ด้วย MostMate

สรุปสั้น ๆ: ความละเอียดหน้าจอบอกขนาดพิกเซลของจอภาพ ส่วนขนาดหน้าต่างบอกขนาดพื้นที่ที่มองเห็นของเบราว์เซอร์ เว็บไซต์อ่านได้ทั้งสองค่า ค่าทั้งสองเข้าสู่ฟิงเกอร์ปริ้นท์ แต่ค่าเดียวโดยลำพังไม่สื่ออะไรมากนัก ให้พารามิเตอร์สอดคล้องกันและสภาพแวดล้อมคงเสถียรในระยะยาว สำคัญกว่าการไล่ตาม "ตัวเลขที่ดูดี" เนื้อหาต่อจากนี้ไล่เรียงตามลำดับ แยกแนวคิด วิธีอ่านค่าพารามิเตอร์ ความสัมพันธ์กับฟิงเกอร์ปริ้นท์ ข้อเข้าใจผิดที่พบบ่อย วิธีตรวจดู และการตั้งค่าใน MostMate

"หน้าเช็กฟิงเกอร์ขึ้น Screen Resolution เป็น 1920×1080 แต่แถวถัดลงมาขนาดหน้าต่างกลับเป็น 1536×750 เลขสองตัวไม่ตรงกัน" ใครที่ดูรายงานตรวจฟิงเกอร์อย่างจริงจังเป็นครั้งแรก ส่วนใหญ่เคยค้างตรงนี้ บางคนสงสัยว่าหน้าตรวจพลาด บางคนเริ่มกังวลว่าสภาพแวดล้อมมีปัญหา ความจริงแล้วเลขสองตัวนี้ไม่เคยเป็นสิ่งเดียวกันมาแต่แรก ที่ไม่ตรงกันต่างหากคือเรื่องปกติ สิ่งที่ควรสังเกตจริง ๆ คือความสัมพันธ์ระหว่างพารามิเตอร์ขนาดเหล่านี้สมเหตุสมผลกันหรือไม่

MostMate เป็นแอนตี้ดีเทคเบราว์เซอร์ที่เว็บไซต์ทางการแนะนำว่าเป็น "แอนตี้ดีเทคเบราว์เซอร์ AI ที่ใช้ง่ายสำหรับมือใหม่" โปรแกรมเตรียมสภาพแวดล้อมเบราว์เซอร์แยกให้แต่ละบัญชี และพารามิเตอร์เกี่ยวกับหน้าจอเป็นหนึ่งในรายการพื้นฐานของการตั้งค่าสภาพแวดล้อม บทความนี้จะแยกสองแนวคิดนี้ให้ชัดก่อน แล้วจึงลงรายละเอียดว่าจะตั้งค่าและตรวจสอบในเบราว์เซอร์อย่างไร

ความละเอียดหน้าจอกับขนาดหน้าต่าง ต่างกันไม่ใช่แค่หนึ่งตัวเลข

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

ความละเอียดหน้าจอกำหนดด้วยฮาร์ดแวร์ของจอ ค่าที่พบบ่อยอย่าง 1920×1080 และ 2560×1440 หมายถึงจอทั้งแผงมีพิกเซลเท่าไร เมื่อลงระบบเสร็จก็แทบไม่เปลี่ยนอีก การย่อขยายของระบบเปลี่ยนแค่สัดส่วนการแสดงผล พิกเซลจริงยังอยู่ที่แผงเดิม

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

ขนาดหน้าต่างเปลี่ยนแปลงคล่องตัวกว่ากว่ามาก ลากขอบ แบ่งครึ่งจอ ลากไปจออื่น ค่าที่อ่านได้เปลี่ยนตามทันที แม้เครื่องเดิมแต่ละวันก็อาจไม่เท่าเดิม

ก่อนอื่นวางสองอย่างนี้ไว้เทียบกันสักรอบ:

เว็บไซต์อ่านพารามิเตอร์ขนาดได้บ้างอะไรบ้าง

เบราว์เซอร์จัดข้อมูลของหน้าจอและหน้าต่างเป็นกลุ่มพารามิเตอร์ให้สคริปต์ในหน้าเรียกใช้ เรียกอ่านครั้งเดียวก็ได้ครบทั้งหมด เอกสารอินเทอร์เฟซ screen ของ MDN รวบรวมนิยามครบถ้วนของพร็อพเพอร์ตี้เหล่านี้ เวลาเช็กตามปกติ ดูสี่กลุ่มต่อไปนี้เป็นหลัก

• screen.width / screen.height: ข้อมูลขนาดของจอทั้งแผง มาจากจอภาพกับการตั้งค่าระบบ สคริปต์ในหน้าอ่านได้ตลอดเวลาและไม่ต้องขออนุญาต
• window.innerWidth / window.innerHeight: ความกว้างและความสูงของพื้นที่ที่มองเห็นของหน้า ก็คือขนาดหน้าต่างที่พูดถึงกันตามปกติ หน้าต่างเปลี่ยนเมื่อไร ค่านี้เปลี่ยนตามเมื่อนั้น
• window.devicePixelRatio: อัตราส่วนระหว่างพิกเซล CSS กับพิกเซลจริง จอความละเอียดสูงและการย่อขยายของระบบจะทำให้ค่านี้เป็น 1.25, 1.5 หรือ 2 ความละเอียดเท่าเดิมแต่ย่อขยายต่างกัน ค่าที่อ่านได้ก็ต่างกัน
• screen.availWidth / screen.availHeight: พื้นที่ใช้งานหลังหักแถบงานของระบบออก มักน้อยกว่าความละเอียดเต็มอยู่หลักสิบพิกเซล แถบงานวางตำแหน่งไหน ก็หักไปทางนั้น

แต่ละกลุ่มดูเดี่ยว ๆ ก็ธรรมดา ต่อเมื่อรวมกันถึงจะเรียกได้ว่าเป็นลักษณะเฉพาะ ขนาดหน้าต่างเปลี่ยนตามการใช้งาน พารามิเตอร์หน้าจอค่อนข้างคงที่ เว็บไซต์แยกข้อมูลออกเป็นสองชั้น ชั้นอุปกรณ์กับชั้นสถานะ ได้จาก "อะไรเปลี่ยน อะไรไม่เปลี่ยน" นี่เอง

ทำไมพารามิเตอร์ขนาดจึงกลายเป็นส่วนหนึ่งของฟิงเกอร์ปริ้นท์

ฟิงเกอร์ปริ้นท์มักไม่ตัดสินจากพารามิเตอร์เดียว เว็บไซต์มองว่าชุดพารามิเตอร์เมื่อต่อกันแล้วใกล้เคียงอุปกรณ์จริงที่คงเสถียรหรือไม่

1920×1080 เพียงค่าเดียวสื่ออะไรได้น้อย เครื่องที่ใช้ความละเอียดนี้ทั่วโลกมีเป็นสิบล้าน แต่พอวางไว้กับระบบปฏิบัติการ User-Agent devicePixelRatio รายการฟอนต์ และข้อมูล GPU ความจำเพาะของชุดข้อมูลก็พุ่งขึ้นทันตา

1920×1080 คู่กับ Windows และ Chrome เดสก์ท็อป เป็นหนึ่งในคอมโบที่พบมากที่สุด แต่ถ้าจอเล็กคู่กับ User-Agent ของระบบเดสก์ท็อป กลับกลายเป็นคู่ที่ขัดกับสามัญสำนึก เว็บไซต์ทางการยกตัวอย่างนี้ไว้แล้ว: ขนาดจอมือถือ 390×844 จับคู่กับระบบปฏิบัติการเดสก์ท็อป เห็นได้ในแวบเดียวว่าสภาพแวดล้อมถูกประกอบขึ้นมา ฟิงเกอร์ปริ้นท์เบราว์เซอร์ประกอบด้วยพารามิเตอร์อะไรบ้าง บทความ what-is-browser-fingerprint มีรายการครบถ้วน พารามิเตอร์ขนาดเป็นแค่กลุ่มหนึ่งเท่านั้น

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

บทบาทของพารามิเตอร์ขนาดในฟิงเกอร์ปริ้นท์จึงคล้ายแถวค่าตรวจหนึ่งแถวในผลตรวจสุขภาพ แถวเดียวไม่พอให้สรุปอะไร ต้องเทียบทั้งตารางถึงจะเห็นความผิดปกติ

ความละเอียดเท่ากัน แปลว่าฟิงเกอร์เท่ากันหรือไม่

ไม่จำเป็น ผู้ใช้สองคนใช้ 1920×1080 เหมือนกันก็อาจต่างกันที่ระบบปฏิบัติการ เวอร์ชันเบราว์เซอร์ devicePixelRatio เขตเวลา ฟอนต์ และผลการเรนเดอร์ของ GPU กับ Canvas ต่างกันตรงไหนได้สักจุด ฟิงเกอร์รวมก็แยกจากกันทันที ความละเอียดเท่ากันสรุปเป็นฟิงเกอร์เท่ากันไม่ได้

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

วิธีดูพารามิเตอร์ขนาดของสภาพแวดล้อมปัจจุบัน

อ่านแนวคิดจบแล้ว ลงมือตรวจจริงใช้เวลาสองนาที ทำตามลำดับนี้:

1. เปิดคอนโซลอ่านค่า: กด F12 เข้าเครื่องมือนักพัฒนา แล้วพิมพ์ใน Console screen.width, screen.height, window.innerWidth, window.innerHeight และ window.devicePixelRatio อ่านครบห้าค่าในครั้งเดียว
2. ไปเทียบที่เว็บตรวจ: เข้าหน้าแรกของ BrowserLeaks หาแถว Screen Resolution, Viewport Size, Device Pixel Ratio, Available Screen มาเทียบกัน หน้าตรวจบันทึกค่าช่วงที่หน้าโหลด ถ้า DevTools เปิดอยู่แถวหน้าต่างจะเล็กลง แถวหน้าจอไม่กระทบ รู้ไว้ก่อนเวลาเทียบก็พอ
3. ทดลองเปลี่ยนหนึ่งรอบ: ขยายหน้าต่างเต็มแล้วจดค่าชุดหนึ่ง ย่อหน้าต่างลงครึ่งหนึ่งแล้วจดอีกชุด พารามิเตอร์ที่ผูกกับหน้าจอนิ่งสนิท ส่วนที่ผูกกับหน้าต่างเปลี่ยนตาม ทำครั้งนี้จบ ประโยคว่า "แถวไหนเปลี่ยน แถวไหนไม่เปลี่ยน" ก็ไม่ต้องท่องจำแล้ว

ใครอยากอ่านรายงานตรวจแบบเป็นระบบกว่านี้ บทความ อ่านคะแนนความน่าเชื่อถือ Iphey อย่างไร แจกแจงวิธีอ่านค่าครบถ้วน ใช้คู่กันได้

ใน MostMate ตั้งความละเอียดหน้าจอและตรวจสอบอย่างไร

เมื่อผ่านพารามิเตอร์และข้อสังเกตแล้ว ที่เหลือคือการลงมือในสภาพแวดล้อม MostMate รวมการตั้งค่าฟิงเกอร์ไว้ในฟอร์มสภาพแวดล้อม (环境表单) ส่วนภาพรวมว่าผลิตภัณฑ์นี้เป็นอย่างไร หน้า MostMate คืออะไร เล่าไว้ครบกว่า ตรงนี้จะพูดถึงเฉพาะส่วนพารามิเตอร์หน้าจอ

ตอนสร้างหรือแก้ไขสภาพแวดล้อม ในส่วนตั้งค่าฟิงเกอร์ (指纹设置) จะมีพารามิเตอร์ฮาร์ดแวร์อย่างความละเอียดหน้าจอ หน่วยความจำอุปกรณ์ จำนวนคอร์ CPU และรายการฟอนต์ ความละเอียดหน้าจอมีสามโหมดให้เลือก คือ "จริง" (真实) "สุ่ม" (随机) และ "กำหนดเอง" (自定义) แผงพรีวิวฟิงเกอร์ (指纹预览面板) ด้านขวาจะลิสต์ค่าปัจจุบันแบบเรียลไทม์ ความละเอียดหน้าจอแยกเป็นแถวของตัวเอง แก้ปุ๊บเห็นผลปั๊บ

โหมด "จริง": ใช้พารามิเตอร์หน้าจอของเครื่องนี้โดยตรง เหมาะกับกรณีใช้คอมเครื่องปัจจุบันเป็นอุปกรณ์เดียว ค่าที่ได้ตรงกับเครื่องจริง ผู้ใช้ที่มีสภาพแวดล้อมเดียวส่วนใหญ่หยุดที่โหมดนี้ก็พอ

โหมด "สุ่ม": ให้สภาพแวดล้อมสร้างชุดค่าสุ่มขึ้นมา เหมาะกับกรณีสร้างสภาพแวดล้อมหลายตัวแต่ไม่อยากให้ทุกตัวใช้ชุดพารามิเตอร์หน้าจอชุดเดียวกัน การสุ่มแก้เรื่อง "ทุกเจ้าเหมือนกันหมด" แต่แก้เรื่อง "จับคู่ถูกไหม" ไม่ได้ ชุดค่าที่สุ่มได้ต้องเอาผ่านแผงพรีวิวสักรอบ เทียบให้ตรงกับระบบปฏิบัติการและเวอร์ชันเบราว์เซอร์ ส่วนเหตุผลที่พารามิเตอร์สุ่มทำให้เกิดรอยบุบใหม่ บทความ ทำไมการสุ่มฟิงเกอร์จึงไม่ปลอดภัย เล่าไว้เต็ม ๆ

โหมด "กำหนดเอง": กำหนดค่าเองทีละค่า เหมาะกับการตั้งตามโปรไฟล์อุปกรณ์เป้าหมาย เช่น กรอกความละเอียดตามค่าที่นิยมของโน้ตบุ๊กรุ่นหลัก แล้วตั้ง DPR ให้ตรงระดับที่สอดคล้องกัน สามพารามิเตอร์ตรวจทีละรายการในฟอร์มเดียวกัน ง่ายกว่ากลับมาแก้ทีหลัง

การตรวจหลังตั้งค่าทำเป็นสามขั้น หนึ่ง ดูในแผงพรีวิวว่าความละเอียดหน้าจอกับระบบปฏิบัติการอยู่ในช่วงจับคู่ที่สมเหตุสมผลหรือไม่ สอง ยืนยันว่า DPR เข้าคู่กับความละเอียด คอมโบที่พบน้อยอย่างความละเอียดสูงคู่การย่อขยายต่ำใช้ด้วยความระวัง สาม เปิดสภาพแวดล้อมเข้าเว็บตรวจสักครั้ง เทียบค่าที่หน้าตรวจอ่านได้กับค่าในแผงพรีวิว สองฝ่ายตรงกันจึงถือว่าลงตัว

สภาพแวดล้อมของงานชุดเดียวกัน พารามิเตอร์หน้าจอควรเหมือนกันหมด หรือกระจายอย่างมีแบบแผน สภาพครึ่งสุ่มครึ่งจริงเป็นสถานะที่โดนจับผิดง่ายที่สุดเวลาเทียบกัน

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

ความละเอียดหน้าจอกับขนาดหน้าต่างเป็นอย่างเดียวกันหรือไม่

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

ความละเอียดหน้าจอกำหนดฟิงเกอร์เบราว์เซอร์ด้วยตัวเดียวได้หรือไม่

ไม่ได้ เป็นเพียงกลุ่มลักษณะเสริมหนึ่งกลุ่มในฟิงเกอร์ เว็บไซต์ตัดสินร่วมกับระบบปฏิบัติการ เวอร์ชันเบราว์เซอร์ DPR ฟอนต์ GPU และพารามิเตอร์อื่น ดูแค่ความละเอียดสรุปอะไรไม่ได้

ปรับขนาดหน้าต่างเบราว์เซอร์แล้วฟิงเกอร์เบราว์เซอร์เปลี่ยนไหม

ตัวตนไม่ถูกรีเซ็ต การเปลี่ยนขนาดหน้าต่างกระทบแค่ค่าที่ผูกกับหน้าต่างไม่กี่ตัว พารามิเตอร์หน้าจอกับลักษณะการเรนเดอร์ไม่เปลี่ยนตาม ความเข้าใจรวมของเว็บไซต์จึงยังอยู่เท่าเดิม

ในแอนตี้ดีเทคเบราว์เซอร์ควรตั้งความละเอียดเป็นโหมดสุ่มไหม

ไม่ควรเข้าใจง่าย ๆ ว่ายิ่งสุ่มยิ่งดี ความหมายของการสุ่มคือกันหลายสภาพแวดล้อมใช้ชุดพารามิเตอร์เดียวกัน โดยมีเงื่อนไขว่าผลสุ่มต้องจับคู่กับระบบปฏิบัติการและเวอร์ชันเบราว์เซอร์ได้อย่างสมเหตุสมผล

คอมที่ความละเอียด 1920×1080 หน้าต่างเบราว์เซอร์ก็ 1920×1080 ใช่ไหม

ไม่จำเป็น ขนาดหน้าต่างขึ้นกับว่าใช้งานอย่างไร ขยายเต็ม ครึ่งจอ หรือแบ่งหน้าจอ ล้วนทำให้ขนาดหน้าต่างเหลื่อมจากความละเอียดหน้าจอ

บทสรุป

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

สำหรับผู้ใช้ทั่วไป เข้าใจสองชุดพารามิเตอร์นี้ก็ละลายข้อสงสัยบนหน้าตรวจได้เกือบครึ่ง สำหรับผู้ที่ดูแลหลายบัญชี พารามิเตอร์ขนาดเป็นรายการตรวจสภาพแวดล้อมที่แรงน้อยที่สุด: ตอนตั้งค่าผ่านแผงพรีวิวสักรอบ หลังขึ้นใช้งานเทียบกับเว็บตรวจอีกครั้ง

MostMate รวมความละเอียดหน้าจอ ระบบปฏิบัติการ DPR และพารามิเตอร์อื่นไว้ในฟอร์มสภาพแวดล้อมเดียวกัน ตั้งเสร็จคือตรวจเสร็จ แก้ปุ๊บมีผลปั๊บ ถ้าสนใจ ดาวน์โหลด MostMate สร้างสภาพแวดล้อมหนึ่งตัว แล้วเอาแผงพรีวิวกับหน้าตรวจมาเทียบกันดูสักรอบ