a261442315 2024-06-17 10:48 采纳率: 50%
浏览 13
已结题

支持windows以及安卓系统的文本转语音功能的vue页面


<template>
  <div id="app">
    <div>我是div 我是 home 页面</div>
    <textarea v-model="textToSpeak" placeholder="输入要朗读的文本"></textarea>
    <div>
      <label for="voice">选择一个语音:</label>
      <el-select v-model="selectedVoice">
        <el-option v-for="voice in translatedVoices" :key="voice.name" :label="voice.label" :value="voice.name">
        </el-option>
      </el-select>
    </div>
    <button @click="speakText">播放</button>
    <div>
      <label>语速:</label>
      <input type="range" min="1" max="10" step="1" v-model="rate">
      <span>{{ rate }}</span>
    </div>
    <div>
      <label>音高:</label>
      <input type="range" min="1" max="10" step="1" v-model="pitch">
      <span>{{ pitch }}</span>
    </div>
    <div>
      <button @click="pauseText">暂停</button>
      <button @click="resumeText">继续</button>
      <button @click="stopText">停止</button>
    </div>
  </div>
</template>


<script>
export default {
  data() {
    return {
      textToSpeak: '',
      voices: [],
      selectedVoice: null,
      translatedVoices: [],
      rate: 1,
      volume: 1,
      pitch: 1,
      utterance: null,
      voiceTranslations: {
        "Microsoft Huihui - Chinese (Simplified, PRC)": "慧慧-中文",
        "Microsoft Kangkang - Chinese (Simplified, PRC)": "康康-中文",
        "Microsoft Yaoyao - Chinese (Simplified, PRC)": "瑶瑶-中文",
        "Google Deutsch": "德语",
        "Google US English": "美国英语",
        "Google UK English Female": "英国英语(女)",
        "Google UK English Male": "英国英语(男)",
        "Google español": "西班牙语(西班牙)",
        "Google español de Estados Unidos": "西班牙语(美国)",
        "Google français": "法语",
        "Google हिन्दी": "印地语",
        "Google Bahasa Indonesia": "印度尼西亚语",
        "Google italiano": "意大利语",
        "Google 日本語": "日语",
        "Google 한국의": "韩语",
        "Google Nederlands": "荷兰语",
        "Google polski": "波兰语",
        "Google português do Brasil": "葡萄牙语(巴西)",
        "Google русский": "俄语",
        "Google 普通话(中国大陆)": "普通话(中国大陆)",
        "Google 粤語(香港)": "粤语(香港)",
        "Google 國語(臺灣)": "国语(台湾)",
      },
    };
  },
  created() {
    this.updateVoices();
    window.speechSynthesis.onvoiceschanged = this.updateVoices;
  },
  methods: {
    updateVoices() {
      setTimeout(() => {
        const availableVoices = window.speechSynthesis.getVoices();
        this.voices = availableVoices;

        this.translatedVoices = availableVoices.map(voice => ({
          name: voice.name,
          label: this.getVoiceLabel(voice)
        }));

        if (this.voices.length > 0 && !this.selectedVoice) {
          this.selectedVoice = this.voices[0].name;
        }
      }, 500);
    },
    getVoiceLabel(voice) {
      return this.voiceTranslations[voice.name] || voice.name;
    },
    speakText() {
      if (!this.textToSpeak) {
        alert('请输入要播放的文本');
        return;
      }

      if (!this.selectedVoice) {
        alert('请选择一个语音');
        return;
      }

      this.utterance = new SpeechSynthesisUtterance(this.textToSpeak);
      this.utterance.rate = this.rate;
      this.utterance.volume = this.volume;
      this.utterance.pitch = this.pitch;

      const selectedVoice = this.voices.find(v => v.name === this.selectedVoice);
      if (selectedVoice) {
        this.utterance.voice = selectedVoice;
        window.speechSynthesis.speak(this.utterance);
      } else {
        alert('选择的语音无效');
      }
    },
    pauseText() {
      if (window.speechSynthesis.speaking && !window.speechSynthesis.paused) {
        window.speechSynthesis.pause();
      }
    },
    resumeText() {
      if (window.speechSynthesis.paused) {
        window.speechSynthesis.resume();
      }
    },
    stopText() {
      window.speechSynthesis.cancel();
      this.utterance = null;
    }
  }
};
</script>

这里想要实现安卓浏览器也可以支持文本转语音的功能,但是安卓系统下载的chrome浏览器输出栏中显示
Voice support NOT ready
Voice not supported. Using fallback mode
Mapped UK English Female to en-GB fallback voice
Mapped UK English Male to en-GB fallback voice
Mapped US English Female to en-US fallback voice
Mapped Spanish Female to es fallback voice
Mapped French Female to fr fallback voice
Mapped Deutsch Female to de fallback voice
Mapped Italian Female to it fallback voice
Mapped Hungarian Female to hu fallback voice
Mapped Serbian Male to sr fallback voice
Mapped Croatian Male to hr fallback voice
Mapped Bosnian Male to bs fallback voice
Mapped Fallback UK Female to en-GB fallback voice
有什么第三方库可以支持文本转语音,要求完全免费,不是什么免费额度

  • 写回答

4条回答 默认 最新

  • a261442315 2024-06-19 15:58
    关注

    web api提供的方法并不是不可用,只是因为安卓设备的默认tts引擎设置的问题,在Google play中下载Speech Recognition & Synthesis插件后再设置中将tts换位谷歌的引擎之后就可以正常获取到语音列表了

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(3条)

报告相同问题?

问题事件

  • 系统已结题 6月27日
  • 已采纳回答 6月19日
  • 创建了问题 6月17日

悬赏问题

  • ¥15 网络分析设施点无法识别
  • ¥15 状态图的并发态问题咨询
  • ¥15 PFC3D,plot
  • ¥15 VAE模型编程报错无法解决
  • ¥100 基于SVM的信息粒化时序回归预测,有偿求解!
  • ¥15 物体组批优化问题-数学建模求解答
  • ¥15 微信原生小程序tabBar编译报错
  • ¥350 麦克风声源定位坐标不准
  • ¥15 apifox与swagger使用
  • ¥15 egg异步请求返回404的问题