更新记录

1.0.0（2022-04-14）

1.语音合成 2.实时语音转写 3.语音听写

平台兼容性

• 需要帮助请联系:1580043700@qq.com

• 使用前准备

  由于科大讯飞url需要加密，为了减小小程序体积，使用了微信小程序插件，请记得引入插件

  引入插件

  1.全局引入 (manifest.json)

  
  "mp-weixin" : {
        "appid" : "",
        "plugins" : {
            "CryptoJs" : {
                "version" : "1.0.0",    //版本号(固定值)
                "provider" : "wxc4dcd44ab0c3682a"   //appid(固定值)
            }
        },
    }
  

  2.分包引入 (pages.json)

  {
  "subpackages": [
        {
            "root": "package",
            "name": "package",
            "pages": [],
            "plugins":{
                "CryptoJs" : {
                    "version" : "1.0.0",    //版本号(固定值)
                    "provider" : "wxc4dcd44ab0c3682a"   //appid(固定值)
                }   
            }
        }
  ]
  }
  

• 目录结构

    |
    |-components 插件
        |
        |-zhangjun-xfyun
            |
            |-audio.vue 语音播放组件
            |
            |-short-record.vue  语音听写(流式版)组件
            |
            |-timely-record.vue 实时语音转写组件
            |
            |-speech_synthesis.js   语音合成组件
  

• 使用方式

  1.语音播放组件(audio.vue)

  1.1使用

  <template>
    <Audio audioContextId="0001" :src="url" :autoPlay="true"></Audio>
  </template>
  
  <script>
  import Audio from "@/components/zhangjun-xfyun/audio.vue";
  
  export default {
    name: "index",
    components: { Audio },
     data() {
        return {
            url:''
        };
    },
  }
  </script>
  

  2.语音听写(流式版)组件(short-record.vue)

  2.1修改配置文件(修改short-record.vue 中的 appid、apiSecret、apiKey)

  
    config: {
        hostUrl: "wss://iat-api.xfyun.cn/v2/iat",
        host: "iat-api.xfyun.cn",
        uri: "/v2/iat",
        //TODO 在控制台-我的应用-语音听写（流式版）获取
        appid: "",
        apiSecret: "",
        apiKey: "",
    }
  

  2.2使用

  <template>
    <view>
        <view>
            <view class="item" v-for="(item, index) in list" :key="index">
                <view>
                    <Audio :audioContextId="index" :src="item.url"></Audio>
                </view>
                <view>{{ item.text }}</view>
            </view>
        </view>
        <view>
            <Record @stop="bindEnd" @change="bindChange"></Record>
        </view>
    </view>
  </template>
  
  <script>
  import Record from "@/components/zhangjun-xfyun/short-record.vue";
  import Audio from "@/components/zhangjun-xfyun/audio.vue";
  
  export default {
    components: {
        Record,
        Audio,
    },
    data() {
        return {
            list: [],
        };
    },
    onLoad() {},
    methods: {
        bindEnd(event) {
            const { url, text } = event;
            this.list.push({ url, text });
        },
        bindChange(text) {
            console.warn("bindChange", text);
        },
    },
  };
  </script>

  3.实时语音转写组件(timely-record.vue)

  3.1修改配置文件(修改timely-record.vue 中的 appid、apiSecret、apiKey)

  
    config: {
        hostUrl: "wss://rtasr.xfyun.cn/v1/ws",    
        //TODO 在控制台-我的应用-实时语音转写获取
        appid: "",
        apiKey: "",
    }
  

  3.2使用

  <template>
    <view>
        <view>
            <view class="item" v-for="(item,index) in list" :key="index">
                <view>
                    <Audio :audioContextId="index" :src="item.url"></Audio>
                </view>
                <view>{{item.text}}</view>
            </view>
        </view>
        <view>
            <Record @stop="bindEnd"></Record>
        </view>
    </view>
  </template>
  
  <script>
    import Record from '@/components/zhangjun-xfyun/timely-record.vue'
    import Audio from '@/components/zhangjun-xfyun/audio.vue'
  
    export default {
        components: {
            Record,
            Audio
        },
        data() {
            return {
                list: []
            }
        },
        onLoad() {},
        methods: {
            bindEnd(event) {
                const {url,text} = event;
                this.list.push({url,text})
            }
        }
    }
  </script>

  4.语音合成组件(speech_synthesis.js)

  4.1修改配置文件(修改speech_synthesis.js 中的 appid、apiSecret、apiKey)

  
  const config = {
    hostUrl: "wss://tts-api.xfyun.cn/v2/tts",
    host: "tts-api.xfyun.cn",
    uri: "/v2/tts",
    //TODO 在控制台-我的应用-在线语音合成（流式版）获取
    appid: "", 
    apiSecret: "", 
    apiKey: "", 
  }
  

  4.2使用

  <template>
    <Audio audioContextId="0001" :src="url" :autoPlay="true"></Audio>
  </template>
  
  <script>
  import { textToSpeech } from "@/component/zhangjun-xfyuns/speech_synthesis";
  
  export default {
    name: "index",
    components: { Audio },
    data() {
        return {
            text: "人之初，性本善。性相近，习相远。苟不教，性乃迁。教之道，贵以专。昔孟母，择邻处。",
            url:'' //合成语音文件临时地址
        };
    },
    onLoad(option) {
        textToSpeech(this.text).then(data => {
            this.url = data
        });
    },
  };
  </script>