Google docs - Accédez aux modifications du texte en temps réel

Question

Objectif

Nos utilisateurs travaillent dans Google Docs. Le texte qu'ils écrivent leur sera lu à mesure qu'ils le tapent grâce à la synthèse vocale. Le système doit fonctionner sur le plus grand nombre de plateformes et de navigateurs possible.

Notre solution

Cela semble correspondre à la Google Apps script Il fonctionne sur tous les navigateurs de bureau et sur certains navigateurs mobiles.

Cela fonctionne

Nous disposons d'un module de synthèse vocale qui fonctionne parfaitement, ce qui ne pose aucun problème. Nous utilisons un barre latérale actuellement. La barre latérale peut lire de l'audio en utilisant la fonction Balise HTML 5 Audio qui fonctionne sans aucun problème.

Le problème

Le problème est de récupérer le texte du document Google Docs. Jusqu'à présent, je n'ai pas réussi à trouver un moyen d'accéder au texte du document Google directement à partir de la barre latérale. Ce que nous avons fait à la place est :

1. La barre latérale interroge toutes les x millisecondes notre script Google Apps fonctionnant sur le cloud de Google.
2. Notre script Google Apps s'exécutant sur le cloud de Google accède ensuite au document synchronisé dans le cloud.
3. S'il trouve des changements, il les renvoie dans la barre latérale.
4. Sidebar lit l'audio en utilisant la balise HTML5 Audio et notre Text-To-Speech.

Il faut une seconde ou plus entre le moment où l'utilisateur a saisi le texte dans google docs et le moment où la modification est synchronisée dans google docs cloud.

Nous avons chronométré les différentes étapes. La synthèse vocale est rapide, et l'audio HTML5 ne pose aucun problème non plus.

Le site perte de temps reçoit le modifications du texte . Il faut actuellement 1-3 secondes ce qui est beaucoup trop long pour notre cas d'utilisation.

Question

Peut-on accéder plus rapidement au texte dans les Google Docs ? Peut-être directement au lieu de passer par le nuage de Google ?

MISE À JOUR 2017-02-15 Il semble que ce ne soit pas possible actuellement. Ce qui est possible, c'est de le faire avec une extension Chrome, qui analyse la page d'accueil de Google Docs et extrait le texte du HTML+JS. C'est assez difficile mais... possible.

Answer 1

Si un plugin de navigateur est un moyen approprié de fournir cette fonctionnalité, il devrait être possible d'écouter les modifications apportées par Google Docs au DOM lorsqu'il met à jour le contenu de la page.

// This div contains all of the page content and not much else, in my rudimentary testing.
var pageRoot = document.getElementsByClassName('kix-appview-editor')[0].firstChild;

var observer = new MutationObserver(handleNewChanges);
observer.observe(pageRoot, {
  subtree: true,
  childList: true,
  attributes: false,
});

// Later, you can stop observing
observer.disconnect();

Votre handleNewChanges sera appelée à chaque fois que le contenu du DOM change, avec une liste de changements. Les changements sont assez désordonnés, mais

• Les changements sans importance (comme la sélection d'un texte par l'utilisateur) peuvent être filtrés en examinant les nœuds ajoutés et supprimés,
• vous pouvez remonter l'arbre DOM pour trouver l'emplacement des modifications dans le document, et
• vous pouvez utiliser someNode.innerText pour obtenir le contenu réel.

En observant les changements et en conservant un certain état des documents, vous devriez être en mesure de déterminer quand les types de changements qui vous intéressent se produisent.

---

Cela semble bien correspondre à votre cas d'utilisation, car

• Aucun serveur distant n'est nécessaire. Le flux de données ressemblerait davantage à ceci, entièrement dans l'onglet du navigateur :

  ---------------                   ----------        
  | Google Docs | <=  fetch doc  <= |  Your  |
  |  Document   | => DOM changes => | Module |
  ---------------                   ----------

• Les mises à jour sont synchronisées avec la mise à jour visuelle du document, ce qui semble être la chose naturelle à déclencher.

• La quantité de comptabilité que vous devez faire pour analyser chaque changement DOM peut probablement être constante (c'est-à-dire, sans boucler sur le contenu du document). Cela signifie que les frais généraux ajoutés par l'observation sont constants, ce qui devrait permettre de s'adapter à n'importe quelle taille de document.

Answer 2

Comme vous l'avez compris, une extension de navigateur est une bonne solution, et elle pourrait être plus facile que vous ne le pensez : Les API d'extension de Chrome sont bien documentées et la création d'une extension est très similaire à la création d'une page Web à l'aide de la fonction HTML y Javascript .

Il y a même un API d'extension pour TTS qui peuvent s'intégrer à des Moteurs TTS :

Utilisez l'API chrome.ttsEngine pour mettre en œuvre un moteur de synthèse vocale (TTS). en utilisant une extension. Si votre extension s'enregistre en utilisant cette API, elle recevra des événements contenant un énoncé à sonner. recevra des événements contenant un énoncé à prononcer et d'autres paramètres lorsque d'autres paramètres lorsqu'une extension ou une application Chrome utilise l'API tts pour générer de la parole. Votre extension peut alors utiliser toute technologie Web disponible pour synthétiser et produire la parole, et renvoyer des événements à la fonction à la fonction d'appel pour signaler l'état.