Accès natif aux dossiers

1Ce que fait cette fonction#

Cette fonction donne à votre application web un accès contrôlé à un dossier Android choisi par l'utilisateur, grâce au Storage Access Framework (SAF). Elle convient bien aux applications HTML hors ligne, aux éditeurs, aux flux de sauvegarde/restauration et aux outils d'import/export.

Elle ne donne PAS un accès illimité au stockage de l'appareil. L'utilisateur choisit explicitement un dossier, et votre application ne peut travailler qu'à l'intérieur de cette arborescence accordée.

2Activer dans le générateur#

À l'étape 4 du générateur, ACTIVEZ « Accès natif aux dossiers (SAF) ». Puis générez l'application.

Une fois activé, votre site obtient un assistant de haut niveau à window.WebToApkFS en plus du pont brut window.WebToApk.

⚠️ Remarque sur le stockage Android 11+ : sur Android 11 et versions ultérieures, lire le stockage partagé exige l'autorisation spéciale « Accès à tous les fichiers ». Au premier lancement de votre application générée, si l'autorisation de stockage est activée, elle ouvre automatiquement l'écran des paramètres Android pour que l'utilisateur l'accorde. Il lui suffit d'appuyer sur l'interrupteur dans les paramètres et de revenir à l'application : aucune navigation manuelle.

3Vérification de disponibilité compatible navigateur#

Protégez toujours votre code pour qu'il fonctionne encore dans Chrome/Safari, où le pont Android n'existe pas :

function canUseNativeFiles() {
  return !!(window.WebToApkFS && window.WebToApkFS.isAvailable());
}

if (canUseNativeFiles()) {
  console.log('Android native folder access available');
}

4Demander à l'utilisateur de choisir un dossier#

Appelez requestAccess() depuis un clic sur un bouton ou une autre action claire de l'utilisateur. Cela ouvre le sélecteur de dossier d'Android et renvoie l'URI du dossier choisi.

async function connectFolder() {
  const result = await window.WebToApkFS.requestAccess();
  if (!result.success) {
    alert('Folder access was not granted');
    return false;
  }
  console.log('Granted folder:', result.folderUri);
  return true;
}

5Opérations de base sur les fichiers#

Une fois l'accès accordé, vous pouvez lister les dossiers, créer des répertoires, lire des fichiers texte, écrire des fichiers texte, renommer des entrées et en supprimer.

// Create folders
window.WebToApkFS.mkdir('notes');
window.WebToApkFS.mkdir('notes/2026');

// Write a file
window.WebToApkFS.writeText('notes/2026/today.txt', 'Hello from offline app');

// Read it back
const text = window.WebToApkFS.readText('notes/2026/today.txt');
console.log(text);

// List folder contents
const entries = window.WebToApkFS.list('notes/2026');
console.log(entries);

6Renommer et supprimer#

Renommer ne change que le nom final de l'entrée. Supprimer gère la suppression de répertoire récursive et non récursive.

// Rename file or folder
window.WebToApkFS.rename('notes/2026/today.txt', 'journal.txt');

// Delete a single file
window.WebToApkFS.delete('notes/2026/journal.txt');

// Delete a folder tree
window.WebToApkFS.delete('notes/2026', { recursive: true });

7Bons cas d'usage#

✅ Applications de notes ou de journal hors ligne
✅ Outils d'import/export CSV / JSON
✅ Sauvegarde et restauration locales simples
✅ Éditeurs HTML statiques qui enregistrent le contenu de l'utilisateur
✅ Applications de tableau de bord qui exportent des rapports en texte ou CSV

8Limites#

⚠️ Fonction réservée à Android. Elle n'existera pas dans les navigateurs classiques de bureau ou mobiles.

⚠️ L'assistant actuel est conçu pour la liste de dossiers et les fichiers texte. Les flux binaires demandent des API supplémentaires.

⚠️ L'accès est limité au seul dossier accordé par l'utilisateur.

⚠️ Appelez ces API une fois la page chargée, pour que l'assistant ait été injecté.

9Exemple complet#

Cet exemple connecte un dossier, crée un répertoire de travail, écrit un fichier JSON et affiche la liste du dossier :

async function setupWorkspace() {
  if (!window.WebToApkFS || !window.WebToApkFS.isAvailable()) {
    console.log('Native folder access not available in this browser');
    return;
  }

  if (!window.WebToApkFS.hasAccess()) {
    const granted = await window.WebToApkFS.requestAccess();
    if (!granted.success) return;
  }

  window.WebToApkFS.mkdir('workspace');
  window.WebToApkFS.writeText(
    'workspace/config.json',
    JSON.stringify({ updatedAt: new Date().toISOString(), mode: 'offline' }, null, 2)
  );

  const files = window.WebToApkFS.list('workspace');
  document.getElementById('output').textContent = JSON.stringify(files, null, 2);
}