简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Maison > interface Web > js tutoriel > le corps du texte

Besoin d'aide avec l'extension de navigateur My Live Transcription – Ne fonctionne pas

Patricia Arquette
Libérer： 2024-10-20 16:39:02
original
892 Les gens l'ont consulté

Need Help with My Live Transcription Browser Extension – Not Working

Bonjour à tous,

J'ai travaillé sur une extension de navigateur qui devrait transcrire en direct toute vidéo diffusée dans le navigateur à l'aide de l'API de reconnaissance vocale. Cependant, je rencontre un problème qui fait que cela ne fonctionne pas comme prévu : la transcription n'apparaît pas et je ne sais pas pourquoi.

Ce que j'ai fait jusqu'à présent :
Manifest.json : j'ai configuré les autorisations pour capturer l'audio et exécuter les scripts nécessaires.
Background.js : le script d'arrière-plan est responsable de la capture audio à l'aide de chrome.tabCapture.
ContentScript.js : J'utilise l'API Web Speech (SpeechRecognition) pour traiter l'audio capturé et le transcrire.
Popup.js : Le popup est censé afficher la transcription en direct.
J'ai testé l'extension sur les navigateurs Brave et Chrome, mais la transcription ne fonctionne toujours pas.
Fichiers clés :
Manifest.json

{
  "manifest_version": 3,
  "name": "Live Transcription Extension",
  "version": "1.0",
  "description": "A browser extension for live transcription",
  "permissions": [
    "audioCapture",
    "activeTab",
    "storage",
    "tabCapture",
    "microphone"
  ],
  "action": {
    "default_popup": "popup.html"
  },
  "background": {
    "service_worker": "background.js"
  },
  "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["contentScript.js"]
    }
  ],
  "host_permissions": ["<all_urls>"]
}
Copier après la connexion

background.js

chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
  if (message.action === "start_transcription") {
    chrome.tabCapture.capture({ audio: true, video: false }, (stream) => {
      if (chrome.runtime.lastError || !stream) {
        console.error("Error capturing audio: ", chrome.runtime.lastError);
        sendResponse({ error: "Failed to capture audio" });
        return;
      }

      sendResponse({ stream });
    });
    return true;
  }
});
Copier après la connexion

ContentScript.js

const startSpeechRecognition = () => {
  const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
  if (!SpeechRecognition) {
    console.error("Speech Recognition API not supported.");
    return;
  }

  const recognition = new SpeechRecognition();
  recognition.continuous = true;
  recognition.interimResults = true;
  recognition.lang = "en-US";

  recognition.onresult = (event) => {
    let finalTranscript = '';
    for (let i = event.resultIndex; i < event.results.length; ++i) {
      if (event.results[i].isFinal) {
        finalTranscript += event.results[i][0].transcript;
      }
    }
    chrome.runtime.sendMessage({ action: 'transcribe', text: finalTranscript });
  };

  recognition.onerror = (event) => {
    console.error("Speech recognition error: ", event.error);
  };

  recognition.start();
};

startSpeechRecognition();
Copier après la connexion

Popup.js

chrome.runtime.onMessage.addListener((message) => {
  if (message.action === 'transcribe') {
    const transcriptionDiv = document.getElementById('transcription');
    transcriptionDiv.innerText += ` ${message.text}`;
  }
});
Copier après la connexion

Popup.html

<!DOCTYPE html>
<html>
<head>
  <title>Live Transcription</title>
</head>
<body>
  <h1>Live Transcription</h1>
  <div id="transcription">
    Transcription will appear here...
  </div>
  <script src="popup.js"></script>
</body>
</html>
Copier après la connexion

Le problème :
L'extension se charge bien, mais rien ne se passe lorsque j'essaie de transcrire une vidéo.
Aucune transcription n'apparaît dans la fenêtre contextuelle et je ne vois aucune erreur évidente dans la console Chrome.
J'ai également essayé d'exécuter l'extension sur Brave et j'obtiens toujours les mêmes résultats.
Ce que j'ai essayé :
J'ai vérifié l'API SpeechRecognition sur le navigateur : elle semble être prise en charge.
Autorisations de microphone accordées à l'extension.
Confirmé que le script d'arrière-plan capture l'audio, mais il ne semble pas déclencher la transcription.
J'ai essayé de tester l'extension localement et en production, mais cela ne fait aucune différence.
Problèmes possibles :
Autorisations du microphone : y a-t-il un problème dans la façon dont je demande des autorisations pour la capture audio ?
API SpeechRecognition : pourrait-il y avoir des problèmes de compatibilité avec le navigateur, ou quelque chose bloque-t-il la reconnaissance vocale ?
Gestion de la transcription : je ne sais pas si l'événement onresult dans le processus SpeechRecognition se déclenche correctement ou si le message n'arrive pas à la fenêtre contextuelle.
Toute aide ou conseil serait grandement apprécié ! Je suis bloqué là-dessus depuis un bon moment et j'adorerais que cela fonctionne.

Merci d'avance !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source：dev.to
Article précédent：Comment gérer le consentement aux cookies dans n'importe quelle application Next.js Article suivant：Bases de React ~ test unitaire/interface utilisateur
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Derniers numéros
function_exists() ne peut pas déterminer la fonction personnalisée Function test () {return true;} if (function_exists ('test')) {echo "le test est une ...
Depuis 2024-04-29 11:01:01
0
2
1636
Comment afficher la version mobile de Google Chrome Bonjour professeur, comment puis-je changer Google Chrome en version mobile ?
Depuis 2024-04-23 00:22:19
0
10
1791
La fenêtre enfant exploite la fenêtre parent, mais la sortie ne répond pas. Les deux premières phrases sont exécutables, mais la dernière ne peut pas être implémentée...
Depuis 2024-04-19 15:37:47
0
1
1526
Il n'y a aucune sortie dans la fenêtre parent document.onclick = function(){ window.opener.document.write('Je suis la sortie de la fenêt...
Depuis 2024-04-18 23:52:34
0
1
1438
Où sont les didacticiels sur la cartographie mentale CSS ? Didacticiel
Depuis 2024-04-16 10:10:18
0
0
1485
Rubriques connexes
Plus>
Recommandations populaires
Tutoriels populaires
Plus>
Tutoriels associés
Recommandations populaires
Derniers cours
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois：Formation PHP en ligne sur le bien-être public，Aidez les apprenants PHP à grandir rapidement！