如何使用JavaScript与FileAPI监控客户端共享目录文件变化？

Great question! Let’s break this down based on your Node.js-powered P2P file sharing setup—the answer depends entirely on whether your client is running in a browser or a Node.js desktop/CLI environment:

1. Browser-based clients: No, not natively #

Browser sandbox security rules block direct, real-time access to the local file system. The File API only lets you:

• Ask users to manually select a folder/file via a file picker
• Read the contents of that folder at the moment of selection

There’s no way to automatically detect subsequent changes (additions, deletions, edits) to the shared directory. You’d have to ask users to re-select the folder periodically to refresh the file list, which is far from ideal for a P2P sharing tool.

2. Node.js-based clients (Electron, NW.js, CLI apps): Absolutely yes #

If your client is built on Node.js (like an Electron desktop app), you have full access to the local file system and can monitor directory changes reliably. Here’s how to implement it:

Built-in option: fs.watch() #

Node.js has a native fs.watch() method that listens for file system events. It works, but note that behavior can vary across operating systems (e.g., duplicate events on Windows, missing modification events on some Linux distros).

Better option: Use the chokidar library #

For cross-platform stability and extra features (like ignoring hidden files, debouncing events), the chokidar npm package is the industry standard. Here’s a quick example tailored to your P2P workflow:

const chokidar = require('chokidar');
const crypto = require('crypto');
const fs = require('fs');

// Assume this is the folder the user selected to share
const sharedFolderPath = '/path/to/user/shared/folder';

// Initialize the watcher
const watcher = chokidar.watch(sharedFolderPath, {
  ignored: /(^|[\/\\])\../, // Skip hidden files/folders
  persistent: true,
  awaitWriteFinish: true // Wait until file writes are complete before triggering events
});

// Helper function to calculate file hash (for unique file identification)
async function getFileHash(filePath) {
  const hash = crypto.createHash('sha256');
  const stream = fs.createReadStream(filePath);
  
  return new Promise((resolve, reject) => {
    stream.on('data', (data) => hash.update(data));
    stream.on('end', () => resolve(hash.digest('hex')));
    stream.on('error', reject);
  });
}

// Handle new files added to the shared folder
watcher.on('add', async (filePath) => {
  const fileHash = await getFileHash(filePath);
  const fileName = filePath.split('/').pop();
  
  // Send update to your server: add this file to the shared list
  // Example: sendToServer({ action: 'add', fileName, fileHash, peerId: 'your-client-id' });
  console.log(`Added file to shared list: ${fileName}`);
});

// Handle files removed from the shared folder
watcher.on('unlink', (filePath) => {
  const fileName = filePath.split('/').pop();
  
  // Notify server to remove this file from the shared list
  // Example: sendToServer({ action: 'remove', fileName, peerId: 'your-client-id' });
  console.log(`Removed file from shared list: ${fileName}`);
});

// Handle file modifications (update hash in shared list)
watcher.on('change', async (filePath) => {
  const fileHash = await getFileHash(filePath);
  const fileName = filePath.split('/').pop();
  
  // Notify server to update the file's hash in the shared list
  // Example: sendToServer({ action: 'update', fileName, newHash: fileHash, peerId: 'your-client-id' });
  console.log(`Updated file hash for: ${fileName}`);
});

Key considerations for your P2P setup #

• Permissions: Make sure your Node.js client requests and receives read/write access to the shared folder (desktop apps will prompt users via system-level permission dialogs).
• File uniqueness: Use file hashes (like SHA-256) instead of just filenames to avoid conflicts when multiple peers share files with the same name.
• Performance: For large folders, add debouncing to avoid flooding your server with too many events at once.
• Sync reliability: After detecting a change, confirm the server has updated the shared list before proceeding to avoid desyncs between peers.

Final Takeaway #

If you’re building a browser-only client, real-time directory monitoring isn’t possible due to security restrictions. But if you’re using Node.js (e.g., Electron) for your client, you can fully implement automatic shared folder monitoring to keep your P2P file list in sync.

内容的提问来源于stack exchange，提问作者John Dugger