小程序功能特點

文本轉語音

多平臺多發音人可選

可調語速

可提供音頻下載

良心產品無廣告?

小程序碼

已對接在線語音識別服務

思必馳dui平臺 (超過40個免費可選發音人)

訊飛開放平臺 (5個免費可選發音人)

百度語音(4個免費發音人可選)

小程序截圖

服務端主要代碼

class TTSController extends Controller {async tts () {let params = this.ctx.querylet result = null// 根據plat參數來調用不同的接口if (params.plat === 'xf') {result = await this.ctx.service.xftts.getTts(params)} else if (params.plat === 'baidu') {result = await this.ctx.service.baidutts.getTts(params)} else {result = await this.ctx.service.aispeechtts.getTts(params)}// 設置response的類型，這樣客戶端接收到的就是一個文件流this.ctx.response.type = 'audio/mpeg'this.ctx.body = result} } 復制代碼

小程序客戶端template代碼（使用的mpvue）

<template><div class="container"><div class="preview"><textarea :class="textAreaFocus? 'focus' : ''" auto-height @focus="bindTextAreaFocus" @blur="bindTextAreaBlur" placeholder="請輸入文本" v-model="text" maxlength="256"/></div><div class="setting"><picker @change="bindPlatChange" v-model="platIndex" range-key="name" :range="platArr"><div class="item"><div class="label">選擇平臺</div><div class="value voice">{{platArr[platIndex].name}}</div></div></picker><picker @change="bindPickerChange" v-model="index" range-key="name" :range="array"><div class="item"><div class="label">選擇發音人</div><div class="value voice">{{array[index].name}}</div></div></picker><div class="item speed"><div class="label">調節語速</div><div class="value"><slider @change="onSpeedChange" :value="speedObj.default" :step='speedObj.step' activeColor="#6F8FFF" :min="speedObj.min" :max="speedObj.max" show-value /></div></div></div><div style="height: 140rpx;"><div class="btn-group"><div class="item"><button @click="audioPlay" type="main">播放合成語音</button> </div><div class="item"> <button @click="audioDownload" type="submain">復制鏈接下載</button> </div></div></div><div class="desc">說明：tts是英文 text to speech的縮寫，即文本轉語音技術<contact-button type="default-light"session-from="weapp">聯系客服</contact-button></div></div> </template> 復制代碼

script 代碼

<script> import voiceIdArray from './voiceIdArray'export default {data () {return {array: voiceIdArray.aispeech,platArr: [{id: 'xf', name: '科大訊飛'}, {id: 'aispeech', name: '思必馳'}, {id: 'baidu', name: '百度'}],platIndex: 1,index: 26,text: `改革春風吹滿地，吹滿地，春風吹滿地。\n中國人民真爭氣，真爭氣，人民真爭氣。\n這個世界太瘋狂，耗子都給貓當伴娘。\n齊德隆，齊東強。\n齊德隆的咚得隆咚鏘。`,voiceId: 'lili1f_diantai',speed: 1,textAreaFocus: false,audioCtx: null,ttsServer: 'https://tts.server.com',audioSrc: '',downloadUrl: '',xfSpeedObj: {min: 0,max: 100,default: 50,step: 1},aispeechSpeedObj: {min: 0.7,max: 2,default: 1,step: 0.1},baiduSpeedObj: {min: 0,max: 9,default: 5,step: 1},speedObj: {}}},watch: {platIndex (newVal, oldVal) {if (newVal === 2) {this.array = voiceIdArray.baiduthis.index = 0this.speedObj = this.baiduSpeedObj}if (newVal === 1) {this.array = voiceIdArray.aispeechthis.index = 26this.speedObj = this.aispeechSpeedObj}if (newVal === 0) {this.array = voiceIdArray.xfthis.index = 0this.speedObj = this.xfSpeedObj}}},onShareAppMessage () {return {title: '文本轉語音服務，多發音人可選'}},methods: {onSpeedChange (e) {this.speedObj.default = e.target.value},bindPlatChange (e) {this.platIndex = e.target.value * 1},bindPickerChange (e) {this.index = e.target.value},getAudioSrc () {if (this.text === '') {return false}const speed = this.speedObj.defaultconst voiceId = this.array[this.index].idconst plat = this.platArr[this.platIndex].idreturn encodeURI(`${this.ttsServer}/tts?plat=${plat}&voiceId=${voiceId}&speed=${speed}&text=${this.text}`)},getDownloadUrl () {const plat = this.platArr[this.platIndex].idconst voiceId = this.array[this.index].idwx.showLoading({title: '加載中'})wx.request({url: 'https://tts.server.com/getdownloadurl',data: {plat: plat,voiceId: voiceId,speed: this.speedObj.default,text: this.text},header: {'content-type': 'application/json' // 默認值},success (res) {wx.hideLoading()wx.setClipboardData({data: res.data.short_url,success (res) {wx.showToast({title: '鏈接已復制請用瀏覽器下載(ios端無法下載)',icon: 'none',duration: 3000})}})}})},audioPlay () {this.audioCtx.src = this.getAudioSrc()if (!this.audioCtx.src) {wx.showToast({title: '請先輸入文本',icon: 'none',duration: 2000})return false}wx.showLoading({title: '加載中'})this.audioCtx.play()},audioDownload () {this.getDownloadUrl()},bindTextAreaBlur (e) {this.textAreaFocus = falsethis.text = e.target.value},bindTextAreaFocus () {this.textAreaFocus = true}},created () {this.speedObj = this.aispeechSpeedObj},mounted () {this.audioCtx = wx.createInnerAudioContext()this.audioCtx.onEnded((res) => {wx.hideLoading()})this.audioCtx.onPlay((res) => {wx.hideLoading()})wx.showShareMenu({withShareTicket: true})} } </script> 復制代碼

接口對接過程中，百度的是最方便的因為有sdk可以直接使用，訊飛的最麻煩需要自己做參數加密，思必馳dui的雖然沒提供SDK但是文檔寫的比較詳細對接過程也很方便快速。

目前無法解決的就是，小程序內無法直接下載的問題，只能提供鏈接，然后用戶自己打開瀏覽器進行下載（iPhone似乎無解）。

轉載于:https://juejin.im/post/5c413f48f265da616e4cb1d0

總結

以上是生活随笔為你收集整理的小程序--语音合成tts 对接多平台（讯飞，思必驰，百度）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。