如何解决如何在 iOS 上运行 Azure TTS
我在 react 中使用了 azure microsoft-cognitiveservices-speech-sdk 进行文本到语音转换。在应用程序中，我需要在没有任何用户干预的情况下播放音频（文本）。我很清楚 iOS 对播放音频的限制。因此，我需要播放“播放器”（See sample）在静音（零音量）中的第一个按钮上单击。但是，如果我尝试重用播放器，则会出现错误
Uncaught DOMException: Failed to set the 'duration' property on 'MediaSource': The 'updating' attribute is true on one or more of this MediaSource's SourceBuffers.
请帮忙建议一种允许我在 iOS 上播放音频的方法。
解决方法
我能够使用 speakTextAsync API 在 iOS 14.6 上实现此功能。试试这个。
// status fields and start button in UI
var phraseDiv;
var resultDiv;
var startSpeakTextAsyncButton;
// subscription key and region for speech services.
var subscriptionKey,serviceRegion;
var authorizationToken;
var SpeechSDK;
var synthesizer;
document.addEventListener("DOMContentLoaded",function () {
startSpeakTextAsyncButton = document.getElementById("startSpeakTextAsyncButton");
subscriptionKey = document.getElementById("subscriptionKey");
serviceRegion = document.getElementById("serviceRegion");
phraseDiv = document.getElementById("phraseDiv");
resultDiv = document.getElementById("resultDiv");
startSpeakTextAsyncButton.addEventListener("click",function () {
startSpeakTextAsyncButton.disabled = true;
phraseDiv.innerHTML = "";
// if we got an authorization token,use the token. Otherwise use the provided subscription key
var speechConfig;
if (subscriptionKey.value === "" || subscriptionKey.value === "subscription") {
alert("Please enter your Microsoft Cognitive Services Speech subscription key!");
startSpeakTextAsyncButton.disabled = false;
return;
}
speechConfig = SpeechSDK.SpeechConfig.fromSubscription(subscriptionKey.value,serviceRegion.value);
speechConfig.setProperty(SpeechSDK.PropertyId.SpeechServiceConnection_TranslationVoice,"en-US");
synthesizer = new SpeechSDK.SpeechSynthesizer(speechConfig);
let inputText = phraseDiv.value;
synthesizer.speakTextAsync(
inputText,function (result) {
startSpeakTextAsyncButton.disabled = false;
if (result.reason === SpeechSDK.ResultReason.SynthesizingAudioCompleted) {
resultDiv.innerHTML += "synthesis finished";
} else if (result.reason === SpeechSDK.ResultReason.Canceled) {
resultDiv.innerHTML += "synthesis failed. Error detail: " + result.errorDetails;
}
window.console.log(result);
synthesizer.close();
synthesizer = undefined;
},function (err) {
startSpeakTextAsyncButton.disabled = false;
resultDiv.innerHTML += "Error: ";
resultDiv.innerHTML += err;
resultDiv.innerHTML += "\n";
window.console.log(err);
synthesizer.close();
synthesizer = undefined;
});
});
if (!!window.SpeechSDK) {
SpeechSDK = window.SpeechSDK;
startSpeakTextAsyncButton.disabled = false;
document.getElementById('content').style.display = 'block';
document.getElementById('warning').style.display = 'none';
}
});<script src="https://cdn.jsdelivr.net/npm/microsoft-cognitiveservices-speech-sdk@latest/distrib/browser/microsoft.cognitiveservices.speech.sdk.bundle-min.js"></script>
<html>
<head>
<title>Microsoft Cognitive Services Speech SDK JavaScript Quickstart</title>
<meta charset="utf-8" />
</head>
<body style="font-family:'Helvetica Neue',Helvetica,Arial,sans-serif; font-size:13px;">
<!-- <uidiv> -->
<div id="warning">
<h1 style="font-weight:500;">Speech Recognition Speech SDK not found (microsoft.cognitiveservices.speech.sdk.bundle.js missing).</h1>
</div>
<div id="content" style="display:none">
<table width="100%">
<tr>
<td></td>
<td><h1 style="font-weight:500;">Microsoft Cognitive Services Speech SDK JavaScript Quickstart</h1></td>
</tr>
<tr>
<td align="right"><a href="https://docs.microsoft.com/azure/cognitive-services/speech-service/get-started" target="_blank">Subscription</a>:</td>
<td><input id="subscriptionKey" type="text" size="40" value="subscription">subscription</td>
</tr>
<tr>
<td align="right">Region</td>
<td><input id="serviceRegion" type="text" size="40" value="region"></td>
</tr>
<tr>
<td></td>
<td><button id="startSpeakTextAsyncButton">Start text to speech</button></td>
</tr>
<tr>
<td align="right" valign="top">Input Text</td>
<td><textarea id="phraseDiv" style="display: inline-block;width:500px;height:200px">(INPUT TEXT HERE)</textarea></td>
</tr>
<tr>
<td align="right" valign="top">Result</td>
<td><textarea id="resultDiv" style="display: inline-block;width:500px;height:100px"></textarea></td>
</tr>
</table>
</div>
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
