SpeechSynthesis 如何返回选定的语言列表？

Question

大家早上好，

我仍在为文盲编写问卷。为此，我正在使用 Text to Speech 应用程序（感谢 @JO3-W3B-D3V）

问题在于问卷将以多种语言开发，这意味着文本到语音应用程序也必须支持多种语言。

SpeechSynthesis.getVoices()

如果我理解正确，上面的函数会返回代表当前设备上所有可用声音的所有对象的列表。现在回答我的问题：

1. 有没有办法返回这些语言的选择？例如，列表不应该返回设备上可用的所有 15 种语言，而是只返回 4 种选择的语言？

2. 有没有办法为设备添加更多语言？我正在使用 Chrome。如果我理解正确，Chromes 会从 Microsoft 和 Google 获得语言。因此，如果我向我的操作系统（Windows 10）添加新语言，Chrome 应该会显示新的语言选项。这个假设正确吗？我问是因为我已经这样做了，但没有任何改变，所以我可能会遗漏一些东西。

希望我的问题有意义:)

祝你有美好的一天！

Answer 1

解释

好的，所以我将分两部分回答这个问题，考虑到您有点问了两个问题，谢天谢地，这两个问题都相对简单直接。

问题一

你问过如何让 _ 选择你想要支持的语言，这很简单，就像操作数组一样简单，在我的示例中，我使用了 reduce 函数，相当简单东西。

P.S. 为了某种形式的一致性，我以与我在@987654322 中所写的方式非常相似的方式编写了这个 sn-p @你问过关于speechSynthesis的问题。

假设

正如代码 cmets 中所述，我编写此 sn-p 的方式是没有重复的条目，即在下面的 sn-p 中，您最终将得到一个仅包含一个支持的实体的列表英语这门语言。换句话说，你不会同时拥有en-GB 和en-US，当然你可以改变这个，我只是假设你想要这种类型的功能，当然这是down完全满足您和您的要求。

// IIFE for the sake of it. 
(function() {
  "use strict";

  // This is a simple list of languages that you wish to support. 
  var supportedLanguages = ['en', 'de', 'es', 'fr'];
  var languages = [];

  // This is essentially similar to jQuery's $.ready.
  var ready = function(callback) {
    var d = document,
      s = d.readyState;

    // DOMContentLoaded was fired
    if (s == "complete" || s == "loaded" || s == "interactive") {
      callback();
    } else {
      if (d.addEventListener) {
        d.addEventListener("DOMContentLoaded", callback, false);
      } else {
        d.attachEvent("onDOMContentLoaded", callback);
      }
    }
  };

  // This is just a simple function to process whether or not you'd like to
  // push a voice onto the array or not.
  var shouldPush = function(array, object) {
    var language = object.lang || '';
    var snipped = language.substring(0, 2);

    // Generate a list of all of the known languages. 
    var languageList = array.map(function(object) {
      return object.lang;
    });

    // Create a list of short hand language names.
    var snippedList = languageList.map(function(language) {
      return language.substring(0, 2);
    });

    // Save having a bloated if statement, personally I find this 
    // more readable. 
    //
    // Only push relevant ones, saves having any duplicated entities, i.e. 
    // this will not allow for both en-US & en-GB to be among the list,
    // this can be altered, this is merely based on an assumption that you 
    // wouldn't want both en-US & en-GB, etc. 
    var isToPush = !snippedList.includes(snipped) &&
      !languageList.includes(language) &&
      supportedLanguages.includes(snipped);

    // If true, push to array.
    if (isToPush) {
      array.push(object);
    }

    // Then of course return the array object. 
    return array;
  };

  // This is essentially the list of voices that you've picked to support.
  var getSelectedLanguages = function() {
    languages = speechSynthesis.getVoices().reduce(shouldPush, []);
  };

  // A starting point for this snippet.
  var start = function() {
    speechSynthesis.onvoiceschanged = function() {
      getSelectedLanguages();
      console.log(languages);
    };
  };

  // Run the code when ready.
  ready(start);
})();

问题二

我不完全确定是否有一种“干净且简单”的方法来做到这一点，我对此事进行了自己的研究，我发现它看起来需要某种形式修修补补。我发现的更好信息来源之一是this question。

进一步研究了这个问题，看起来Artyom也表明没有简单的方法可以实现这一点，它看起来你只能通过将语言安装到操作中来添加语言系统，所以我相信。

结论

一个可能的想法是您可以，我强调可以这个词可能通过实施来做到这一点一个您自己的 API，然而我无法想象这将是一个可靠或可靠的实现，因为我的结论是基于研究建议的，以便额外的语言被包括在内，用户对此负有一定责任，因为它看起来需要用户在其操作系统上安装_语言才能使speechSynthesis使用_语言。

实际上我觉得有点奇怪，关于这个主题的正式文档似乎很少/没有，而我发现的大多是非正式的文档、建议和假设。然而，这可能是由于我缺乏调查，请记住，我最多花了大约 15 分钟来研究这个问题。

来源

1. A link to flaviocopes.com regarding speechSynthesis.
2. A link to Artyom.js, a library for speech related APIs.
3. A link to a previous stack overflow question similar to the second part of this question.
4. A link to a medium article.
5. MDN documentation.
6. A treehouse blog post.

---

虽然我可能没有您想要的第二个问题的答案，但我希望整个答案以某种形式有所帮助！ :)