Es gibt mehrere mögliche Problemumgehungen, die die Möglichkeit bieten, Audio aus Text zu erstellen; Zwei davon erfordern die Anforderung einer externen Ressource, die andere verwendet meSpeak.js von @masswerk.
Ansatz bei Download the Audio Pronunciation of Words from Google beschrieben verwenden, die aus nicht in der Lage, leidet vorab zu bestimmen, welche Wörter existieren tatsächlich als Datei an die Ressource ohne writing a shell script oder eine HEAD Anfrage durchführen zu überprüfen, ob ein Netzwerkfehler auftritt. Zum Beispiel ist das Wort "do" bei der unten verwendeten Ressource nicht verfügbar.
window.addEventListener("load",() => {
const textarea = document.querySelector("textarea");
const audio = document.createElement("audio");
const mimecodec = "audio/webm; codecs=opus";
audio.controls = "controls";
document.body.appendChild(audio);
audio.addEventListener("canplay", e => {
audio.play();
});
let words = textarea.value.trim().match(/\w+/g);
const url = "https://ssl.gstatic.com/dictionary/static/sounds/de/0/";
const mediatype = ".mp3";
Promise.all(
words.map(word =>
fetch(`https://query.yahooapis.com/v1/public/yql?q=select * from data.uri where url="${url}${word}${mediatype}"&format=json&callback=`)
.then(response => response.json())
.then(({query: {results: {url}}}) =>
fetch(url).then(response => response.blob())
.then(blob => blob)
)
)
)
.then(blobs => {
// const a = document.createElement("a");
audio.src = URL.createObjectURL(new Blob(blobs, {
type: mimecodec
}));
// a.download = words.join("-") + ".webm";
// a.click()
})
.catch(err => console.log(err));
});
<textarea>what it does my ninja?</textarea>
Resources bei Wikimedia Commons Category:Public domain nicht aus demselben Verzeichnis bedient erforderlich, siehe How to retrieve Wiktionary word content?, wikionary API - meaning of words.
Wenn der genaue Speicherort der Ressource bekannt ist, kann das Audio angefordert werden, obwohl die URL andere Präfixe als das Wort selbst enthalten kann.
fetch("https://upload.wikimedia.org/wikipedia/commons/c/c5/En-uk-hello-1.ogg")
.then(response => response.blob())
.then(blob => new Audio(URL.createObjectURL(blob)).play());
Nicht ganz sicher, wie die Is there a clean wikipedia API just for retrieve content summary?Wikipedia API, How to get Wikipedia content using Wikipedia's API?, verwenden nur die Audio-Datei zu erhalten. Die JSON Antwort müsste für Text geklärt werden, der in .ogg endet, dann müsste eine zweite Anfrage für die Ressource selbst gemacht werden.
fetch("https://en.wiktionary.org/w/api.php?action=parse&format=json&prop=text&callback=?&page=hello")
.then(response => response.text())
.then(data => {
new Audio(location.protocol + data.match(/\/\/upload\.wikimedia\.org\/wikipedia\/commons\/[\d-/]+[\w-]+\.ogg/).pop()).play()
})
// "//upload.wikimedia.org/wikipedia/commons/5/52/En-us-hello.ogg\"
die
Fetch API cannot load https://en.wiktionary.org/w/api.php?action=parse&format=json&prop=text&callback=?&page=hello. No 'Access-Control-Allow-Origin' header is present on the requested resource
meldet sich, wenn sie nicht vom gleichen Ursprung angefordert. Wir müssten versuchen, YQL wieder zu verwenden, obwohl nicht sicher, wie die Abfrage formuliert wird, um Fehler zu vermeiden.
Der dritte Ansatz verwendet eine leicht modifizierte Version von meSpeak.js, um das Audio ohne eine externe Anforderung zu generieren.Die Modifizierung wurde einen richtigen Rückruf für .loadConfig() Methode ist
fetch("https://gist.githubusercontent.com/guest271314/f48ee0658bc9b948766c67126ba9104c/raw/958dd72d317a6087df6b7297d4fee91173e0844d/mespeak.js")
.then(response => response.text())
.then(text => {
const script = document.createElement("script");
script.textContent = text;
document.body.appendChild(script);
return Promise.all([
new Promise(resolve => {
meSpeak.loadConfig("https://gist.githubusercontent.com/guest271314/8421b50dfa0e5e7e5012da132567776a/raw/501fece4fd1fbb4e73f3f0dc133b64be86dae068/mespeak_config.json", resolve)
}),
new Promise(resolve => {
meSpeak.loadVoice("https://gist.githubusercontent.com/guest271314/fa0650d0e0159ac96b21beaf60766bcc/raw/82414d646a7a7ef11bb04ddffe4091f78ef121d3/en.json", resolve)
})
])
})
.then(() => {
// takes approximately 14 seconds to get here
console.log(meSpeak.isConfigLoaded());
meSpeak.speak("what it do my ninja", {
amplitude: 100,
pitch: 5,
speed: 150,
wordgap: 1,
variant: "m7"
});
})
.catch(err => console.log(err));
Einen Nachteil des obigen Ansatzes zu schaffen, dass es etwa 14 und eine halbe Sekunde, bis die drei Dateien, bevor das Audio zu laden nimmt, ist abgespielt. Vermeidet jedoch externe Anforderungen.
Es wäre positiv für eines oder beide 1) Erstellen Sie eine FOSS, Entwickler verwaltet Datenbank oder Verzeichnis von Sounds für beide gemeinsame und ungewöhnliche Wörter; 2) Durchführen einer weiteren Entwicklung von meSpeak.js, um die Ladezeit der drei notwendigen Dateien zu reduzieren; und verwenden Sie Promise basierte Ansätze, um Benachrichtigungen über den Fortschritt des Ladens der Dateien und die Bereitschaft der Anwendung bereitzustellen.
Nach Einschätzung dieser Benutzer wäre es eine nützliche Ressource, wenn Entwickler selbst eine Online-Datenbank von Dateien erstellen und beisteuern, die mit einer Audiodatei des bestimmten Worts geantwortet haben. Nicht ganz sicher, ob der geeignete Ort für Audiodateien ist? Muss die möglichen Optionen berücksichtigen, wenn das Interesse an einem solchen Projekt gezeigt wird.