Hey there, I’ve run into this exact frustration before—Chrome’s old Filesystem API is basically a dead end for extensions these days, and here’s why and how to work around it:

First, let’s clear up the root issue: The legacy Filesystem API (the webkitRequestFileSystem one) was tied exclusively to Chrome Apps, which Google has phased out for desktop platforms. That’s why both unpacked and packed extensions can’t use it—packed ones throw that "not found in the store" error because the API’s permissions are no longer granted to regular extensions.

Luckily, there are two solid alternatives that let you write (and rewrite) files when a browser event fires:

1. Use the File System Access API (Modern, Standard Solution) #

This is the official replacement for the old Filesystem API, supported in Chrome 86+. It lets your extension request user permission to access a specific file or folder, and then you can read/write to it repeatedly (even across browser sessions, if you save the access handle).

How to implement it: #

• Step 1: Request user permission and get a file handle
  You need to trigger this via a user interaction (like a button click—Chrome blocks automatic file system access for security):

  // Trigger this when the user clicks a button in your extension UI
  async function getFileHandle() {
    const handle = await window.showSaveFilePicker({
      suggestedName: "my-log.txt",
      types: [{
        description: "Text Files",
        accept: {"text/plain": [".txt"]}
      }]
    });
    // Save the handle to chrome.storage.local so you can reuse it later
    await chrome.storage.local.set({fileHandle: handle});
    return handle;
  }
  

• Step 2: Write/rewrite to the file when your event fires
  When your target browser event occurs (e.g., a page load, button click), retrieve the saved handle and write to it:

  async function writeToFile(content) {
    // Get the saved handle from storage
    const {fileHandle} = await chrome.storage.local.get("fileHandle");
    if (!fileHandle) {
      // Fallback: Ask user to select a file if no handle is saved
      return getFileHandle().then(handle => writeToFile(content));
    }
  
    // Create a writable stream and write the content
    const writable = await fileHandle.createWritable({keepExistingData: false}); // Set to true to append instead of overwrite
    await writable.write(content);
    await writable.close();
  }
  
  // Example: Trigger on a browser action click
  chrome.action.onClicked.addListener(() => {
    writeToFile(`Log entry: ${new Date().toISOString()}\n`);
  });
  

• Note: You don’t need any special permissions in your manifest.json for this—just make sure your extension has access to the context where you’re running the code (e.g., a popup, content script with proper world access).

2. Use the chrome.downloads API (Simpler, No Persistent File Access) #

If you don’t need to write to a specific user-chosen file (just need to generate a file that overwrites itself each time), the chrome.downloads API works great. It lets you download content directly to the user’s default download folder, with an option to overwrite existing files.

How to implement it: #

• Step 1: Add the permission to manifest.json

  {
    "manifest_version": 3,
    "permissions": ["downloads"],
    // ... other manifest fields
  }
  

• Step 2: Trigger the download/overwrite on your event

  function writeViaDownload(content) {
    chrome.downloads.download({
      url: `data:text/plain;charset=utf-8,${encodeURIComponent(content)}`,
      filename: "my-log.txt",
      conflictAction: "overwrite", // This ensures existing files are replaced
      saveAs: false // Set to true if you want to prompt the user each time
    });
  }
  
  // Example: Trigger when a tab is updated
  chrome.tabs.onUpdated.addListener((tabId, changeInfo) => {
    if (changeInfo.status === "complete") {
      writeViaDownload(`Tab loaded: ${new Date().toISOString()} - ${tabId}\n`);
    }
  });
  

3. Development-Only Workaround (Node.js Helper) #

If you just need a temporary solution for development (and don’t mind running a local service), you can set up a simple Node.js server that listens for requests from your extension and writes files locally. This avoids browser security restrictions entirely, but it’s not suitable for production.

Quick example: #

• Node.js server:

  const express = require('express');
  const fs = require('fs');
  const app = express();
  app.use(express.text());
  
  app.post('/write-file', (req, res) => {
    fs.writeFileSync('./dev-log.txt', req.body, {flag: 'w'}); // 'w' overwrites, 'a' appends
    res.sendStatus(200);
  });
  
  app.listen(3000, () => console.log('Dev file server running on port 3000'));
  

• Extension code:

  async function writeToDevFile(content) {
    await fetch('http://localhost:3000/write-file', {
      method: 'POST',
      body: content,
      headers: {'Content-Type': 'text/plain'}
    });
  }
  

Just keep in mind this requires the user to run the Node server, so it’s only for your own development workflow.

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