响应式语音被 CORS 阻止

Question

我尝试构建一个函数来读取彼此之间具有定义延迟的数字。

{
...
play : function (digits, delay = 500) {
  if (digits && digits.length > 0) {
    responsiveVoice.speak(digits[0], "Czech Female", {
      rate: 0.7,
      onend: () => setTimeout(() => {
        this.play(digits.splice(1), delay);
      }, delay)
    });
  }
}

digits 是一个数字数组，delay 是数字之间的延迟（毫秒）。

该功能在一段时间内正常工作，但随机失败并在控制台中出现以下错误：

从源“http”访问“https://texttospeech.responsivevoice.org/v1/text:synthesize?text=0&lang=cs&engine=g1&name=&pitch=0.5&rate=0.35&volume=1&key=XXXXXXXX&gender=female”处的 XMLHttpRequest ://localhost:8080' 已被 CORS 策略阻止：请求的资源上不存在“Access-Control-Allow-Origin”标头。 无法加载 ResponsiveVoice 音频。将您的浏览器连接到 API 端点时出现问题。 GEThttps://texttospeech.responsivevoice.org/v1/text:synthesize?text=0&lang=cs&engine=g1&name=&pitch=0.5&rate=0.35&volume=1&key=XXXXXXXX&gender=femalenet::ERR_FAILED

谁能告诉我哪里出了问题？

Answer 1

当涉及到字符0（至少）时，您使用的库似乎表现不佳。我测试了您的代码，它适用于任何其他输入。

不知何故，当向这个库输入0 时，它会将请求作为XMLHttpRequest 而不是HTMLAudioElement（用于每个工作演讲）发送到API。

XMLHttpRequest 对跨域请求有一些限制（有关更多信息，您可以阅读有关 CORS 的信息），并且 API 似乎不支持 XMLHttpRequest 调用。

这是库和 API 之间的不一致，我怀疑库中存在与真/假检查相关的错误。

您应该联系他们的支持并报告此错误。

编辑：

正如 cmets 中所写，似乎有一种解决方法，即在数字前添加一个空格。