สิทธิ์ถาวรสำหรับ File System Access API

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

ความท้าทายของวิธีการปัจจุบัน

API การเข้าถึงระบบไฟล์ช่วยให้นักพัฒนาซอฟต์แวร์เข้าถึงไฟล์ในฮาร์ดดิสก์ในเครื่องของผู้ใช้ในลักษณะการอ่านและ (ไม่บังคับ) ได้ แอปยอดนิยมแอปหนึ่ง (และอีกมากมาย) ที่ใช้ API นี้คือ Visual Studio Code (VS Code) ซึ่งเป็น IDE ของ Microsoft ที่ทำงานในเบราว์เซอร์โดยตรง เมื่อเปิด VS Code คุณจะเห็นหน้าจอต้อนรับซึ่งคุณสามารถสร้างไฟล์ใหม่ เปิดไฟล์หรือโฟลเดอร์ที่มีอยู่ได้

หน้าจอต้อนรับของ Visual Studio Code

หากคุณคลิกเปิดโฟลเดอร์ และเลือกโฟลเดอร์ใดโฟลเดอร์หนึ่งบนฮาร์ดดิสก์ เบราว์เซอร์จะถามคุณว่าคุณต้องการให้ VS Code มีสิทธิ์ดูโฟลเดอร์นี้หรือไม่

โค้ด Visual Studio ขอสิทธิ์เข้าถึงการดู

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

โค้ด Visual Studio ขอสิทธิ์แก้ไข

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

โค้ดของ Visual Studio พร้อมข้อความแจ้งไอคอนแถบที่อยู่

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

โค้ด Visual Studio จะแสดงไฟล์ที่เปิดล่าสุด

แต่ถ้าคุณเคยให้สิทธิ์การเขียนในโฟลเดอร์มาก่อนแล้ว คุณจะต้องให้สิทธิ์อีกครั้ง ทำให้การทำงานหนักขึ้นเร็วมาก ก่อนเจาะลึกเกี่ยวกับโซลูชัน ซึ่งก็คือสิทธิ์ถาวรสำหรับ File System Access API โค้ด VS มีวิธีจัดการเพื่อจดจำโฟลเดอร์ล่าสุดอย่างไร

โค้ด Visual Studio ขอสิทธิ์แก้ไขหลังจากโหลดซ้ำ

ใน File System Access API การเข้าถึงไฟล์และโฟลเดอร์จะได้รับการจัดการผ่าน FileSystemHandle ออบเจ็กต์: FileSystemFileHandle ออบเจ็กต์สำหรับไฟล์และ FileSystemDirectoryHandle สำหรับโฟลเดอร์ (ไดเรกทอรี) ข้อมูลทั้งสองนี้สามารถเก็บไว้ใน IndexedDB ซึ่งเป็นสิ่งที่ VS Code ทำนั่นเอง คุณสามารถดูรายละเอียดนี้ได้โดยเปิด Chrome DevTools ในแท็บ Application แล้วไปที่ส่วน IndexedDB และเลือกตารางที่เกี่ยวข้อง vscode-filehandles-store ในฐานข้อมูล vscode-web-db

โค้ด Visual Studio ของ Chrome DevTools ที่แสดงส่วน IndexedDB ด้วย FileSystemHandle ที่จัดเก็บไว้

รูปแบบใหม่: สิ่งที่เปลี่ยนแปลงและเวลาที่เปลี่ยนแปลงไป

Chrome กำลังจะเปิดตัวลักษณะการทำงานใหม่เพื่อให้ผู้ใช้เลือกให้สิทธิ์เข้าถึงไฟล์และโฟลเดอร์อย่างถาวรได้ เพื่อหลีกเลี่ยงไม่ให้ผู้ใช้ไม่ต้องแสดงข้อความแจ้งซ้ำอยู่เรื่อยๆ ลักษณะการทำงานใหม่นี้สังเกตได้ใน Chrome 122 หากต้องการทดสอบก่อนหน้านี้ โดยเริ่มจาก Chrome 120 ให้สลับแฟล็ก 2 รายการ "chrome://flags/#file-system-access-persistent-permission" และ "chrome://flags/#one-time-permission" เป็นเปิดใช้

อย่างแรก ลักษณะการทำงานใหม่ประกอบด้วยข้อความแจ้งสิทธิ์แบบ 3 ทางแบบใหม่ที่อนุญาตให้ผู้ใช้ให้สิทธิ์แอปเข้าถึงไฟล์และโฟลเดอร์ที่เลือกในการเข้าชมแต่ละครั้งได้ (ไม่บังคับ)

โค้ดของ Visual Studio พร้อมข้อความแจ้งสิทธิ์ 3 ทาง

ข้อความแจ้งแบบ 3 ทางใหม่นี้มีตัวเลือกดังต่อไปนี้

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

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

การตั้งค่าเว็บไซต์ใน Visual Studio Code พร้อมไอคอนแก้ไขไฟล์

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

การตั้งค่าความเป็นส่วนตัวและความปลอดภัยของ Chrome สำหรับเว็บไซต์ vscode.dev

วิธีทริกเกอร์ลักษณะการทำงานใหม่

ส่วน File System Access API จะไม่มีการเปลี่ยนแปลงที่นักพัฒนาแอปเห็น หากต้องการทริกเกอร์ลักษณะการทำงานใหม่ด้วยสิทธิ์ถาวร คุณต้องปฏิบัติตามเงื่อนไขเบื้องต้นที่แตกต่างกัน 3 วิธีดังนี้

  1. ผู้ใช้ต้องให้สิทธิ์แก่ไฟล์หรือโฟลเดอร์ (หรือไฟล์หรือโฟลเดอร์หลายรายการ) ในระหว่างการเข้าชมต้นทางครั้งล่าสุด และแอปต้องจัดเก็บออบเจ็กต์ FileSystemHandle ที่เกี่ยวข้องใน IndexedDB เมื่อเข้าชมต้นทางครั้งถัดไป แอปจะต้องเรียกออบเจ็กต์ FileSystemHandle รายการที่จัดเก็บไว้จาก IndexedDB แล้วเรียกใช้เมธอด FileSystemHandle.requestPermission() หากเป็นไปตามเงื่อนไขเบื้องต้นเหล่านี้ ระบบจะแสดงข้อความแจ้ง 3 ทางใหม่
  2. ต้นทางต้องเรียกใช้เมธอด FileSystemHandle.requestPermission() ใน FileSystemHandle ที่เคยมีสิทธิ์เข้าถึงมาก่อน แต่ระบบได้เพิกถอนสิทธิ์เข้าถึงโดยอัตโนมัติเนื่องจากแท็บทำงานอยู่เบื้องหลังมาระยะหนึ่งแล้ว (การเพิกถอนสิทธิ์อัตโนมัติทำงานโดยอิงตามตรรกะเดียวกับที่อธิบายไว้ในบทความสิทธิ์ครั้งเดียวใน Chrome) หากเป็นไปตามเงื่อนไขเบื้องต้นเหล่านี้ ระบบจะแสดงข้อความแจ้ง 3 ทางใหม่
  3. ผู้ใช้ต้องติดตั้งแอปแล้ว แอปที่ติดตั้ง จะได้รับสิทธิ์โดยอัตโนมัติเมื่อผู้ใช้ให้สิทธิ์เข้าถึง ในกรณีนี้ ข้อความแจ้ง 3 ทางจะไม่แสดง แต่แอปจะมีลักษณะการทำงานใหม่โดยค่าเริ่มต้นแทน

ในกรณีที่ 1 และ 2 ข้อความแจ้งจะแสดงออบเจ็กต์ FileSystemHandle ทั้งหมดที่แอปมีสิทธิ์เข้าถึงก่อนหน้านี้ ไม่ใช่เฉพาะรายการที่เรียกใช้เมธอด requestPermission() เพื่อให้สอดคล้องกับวิธีการทำงานในสิทธิ์แบบครั้งเดียว หากผู้ใช้ปฏิเสธหรือปิดข้อความแจ้งมากกว่า 3 ครั้ง ก็จะไม่มีการทริกเกอร์อีกต่อไป และข้อความแจ้งสิทธิ์ปกติจะแสดงขึ้นแทน

ลองใช้ลักษณะการทำงานแบบใหม่

หากคุณใช้ Chrome เวอร์ชันที่รองรับหรือตั้งค่าแฟล็กที่จำเป็นแล้ว คุณจะทดสอบลักษณะการทำงานใหม่ใน VS Code บนเว็บได้ เปิดโฟลเดอร์และให้สิทธิ์เข้าถึง จากนั้นปิดแท็บแล้วเปิดใหม่ จากนั้นคลิกเปิดล่าสุด (โปรดทราบว่าการโหลดซ้ำทันทีไม่ได้ผลในการทริกเกอร์ข้อความแจ้ง คุณต้องปิดแท็บทั้งหมด) เลือกโฟลเดอร์ก่อนหน้า แล้วข้อความแจ้งใหม่จะปรากฏขึ้น สำหรับกรอบการทดสอบที่ลดลง ให้ดูการสาธิตการเข้าถึงระบบไฟล์แบบถาวรและดูซอร์สโค้ด

บทสรุป

สิทธิ์แบบถาวรสำหรับ File System Access API เป็นหนึ่งในฟีเจอร์ที่มีการร้องขอมากที่สุดของ API และเป็นข้อบกพร่องในการใช้งานที่ได้รับความนิยมอย่างสูงด้วย โดยมีนักพัฒนาซอฟต์แวร์จำนวนมากร่วมใช้งานด้วย การนำฟีเจอร์นี้ไปถึงมือนักพัฒนาแอปและที่สำคัญที่สุดคือตอนนี้เราปิดช่องว่างด้านฟีเจอร์ที่สำคัญเมื่อเทียบกับแอปเฉพาะแพลตฟอร์ม

บริการรับรองคำให้การ

โพสต์นี้ได้รับการตรวจสอบโดย Christine Hollingsworth, Austin Sullivan และ Rachel Andrew