微信小程序使用同声传译实现语音识别功能

微信小程序使用同声传译实现语音识别功能

我使用同声传译语音识别功能是为了实现微信小程序首页的语音搜索功能，如果你也是那么恭喜你，你可以ctrl+c、ctrl+v再改一改，如果你不是那么你也不要着急的走可以看完我的文章会对你有所帮助！

首先是在微信公众平台（也就是小程序的后台），在左侧菜单栏中的设置-->第三方设置下的插件管理-->添加-->搜索同声传译-->点击添加

接下来就是在代码中进行添加一些设置。

如果你是使用微信开发者工具进行开发小程序的话，需要在app.json文件中添加一下代码。

// app.json
{
    ...
    "plugins": {
        ...
        "WechatSI": {
            "version": "0.3.4", // 这是同声传译的版本（也可以在微信公众平台添加的同声传译查看最新版本）
            "provider": "wx069ba97219f66d99" // 这是同声传译的ID
        }
    }
}

如果你是使用 Hbuildex 进行开发小程序的话，需要在 manifest.json 文件的源码视图中进行添加修改。

在源码视图中找到 mp-weixin，然后按照以下代码进行添加修改

// manifest.json
/* 小程序特有相关 */
"mp-weixin": {
    "appid": "xxxxxxxxxx", // 这是你小程序的AppId
    ...
    "plugins": {
        "WechatSI": {
            "version": "0.3.4", // 这是同声传译的版本（也可以在微信公众平台添加的同声传译查看最新版本）
            "provider": "wx069ba97219f66d99" // 这是同声传译的ID
        }    
    }
}

做完以上步骤之后，就可以根据官方文档进行开发了

下面就是我的功能实现代码了

// index.vue 在这里我的页面布局只写了语音按钮（简化了）

(欢迎评论区留言，大家一起讨论学习)