File System Access API – Access to User's File System

File System Access API allows web applications to read and write files to the user's device file system with user permission. This opens new possibilities, giving web applications the same power as desktop applications.

The API works only in secure environments (HTTPS or localhost) and requires active user involvement through file or directory selection.

---

Example: How to Open and Read a File

const [fileHandle] = await window.showOpenFilePicker();
const file = await fileHandle.getFile();
const contents = await file.text();
console.log(contents);

In this example: the user selects a file, and we read its contents as text.

---

Example: How to Write to a File

const handle = await window.showSaveFilePicker({
  suggestedName: 'example.txt',
});
const writable = await handle.createWritable();
await writable.write('Hello world');
await writable.close();

In this example: we create a new file or overwrite an existing one by writing text to it.

---

Advantages:

• Allows real file operations (read/write) like desktop applications
• Better user experience without server transfers
• Useful for text editors, drawing apps, or backup tools

---

Disadvantages and Limitations:

• Works only in Chromium-based browsers (Chrome, Edge, etc.)
• Always requires user interaction to select/confirm files
• Some features are still experimental and may change

---

Conclusion

File System Access API redefines the capabilities of web applications by enabling real file system access. While there are some limitations and browser support issues, it's very useful for modern web apps aiming to provide desktop-like experiences.

---