Annyang:是一款用于语音识别的轻量级 JavaScript 库-BFW插件库

Annyang:是一款用于语音识别的轻量级 JavaScript 库

Annyang: 用于语音识别的轻量级 JavaScript 库

随着语音识别技术的发展，越来越多的 Web 应用开始支持语音控制，以提供更便捷的用户体验。Annyang 是一个轻量级的 JavaScript 库，专门用于在 Web 应用中实现语音识别功能它基于浏览器的 Web Speech API，支持多种语言，并且易于与现有的应用程序集成。

Annyang 的特点

轻量级：Annyang 库非常小，仅几 KB 大小，对页面加载速度影响极小。
易于使用：只需几行代码即可实现复杂的语音命令处理。
多语言支持：支持多种语言，包括中文。
高可扩展性：可以与其他库（如 SpeechKITT）结合使用，提供更丰富的功能和更美观的用户界面。

Annyang 的基本用法

使用 Annyang 实现语音识别的步骤非常简单。首先，需要引入 Annyang 库，然后配置命令和相应的回调函数，最后启动语音识别功能。

以下是一个简单的示例代码，展示了如何使用 Annyang 实现基本的中文语音识别功能：

<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>Annyang 中文语音识别示例</title>
</head>
<body>

<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/annyang.2.6.1.js"></script>
<script>
    // 检查是否支持 Annyang
    if (annyang) {
        // 设置中文（简体）
        annyang.setLanguage('zh-CN');

        // 定义命令
        var commands = {
            '你好': function() {
                alert('你好，世界！');
            },
            'open *page': function(page) {
                alert('你要打开的是：' + page);
                // 可以在这里添加逻辑来打开指定的页面
            },
            'search *term': function(term) {
                alert('你要搜索的是：' + term);
                // 可以在这里添加逻辑来执行搜索
            }
        };

        // 添加命令到 Annyang
        annyang.addCommands(commands);

        // 启动 Annyang
        annyang.start();
    } else {
        alert('你的浏览器不支持语音识别');
    }
</script>

</body>
</html>

代码解释

引入 Annyang 库：通过 CDN 引入 Annyang 库文件。

检查浏览器支持：使用 if (annyang) 语句检查浏览器是否支持 Annyang。

if (annyang) {
    // ...
} else {
    alert('你的浏览器不支持语音识别');
}

设置语言：调用 annyang.setLanguage('zh-CN'); 设置语音识别的语言为中文（简体）。
```
annyang.setLanguage('zh-CN');
```

定义命令和回调函数：定义一个命令对象，其中键是语音命令，值是相应的回调函数。

var commands = {
    '你好': function() {
        alert('你好，世界！');
    },
    'open *page': function(page) {
        alert('你要打开的是：' + page);
    },
    'search *term': function(term) {
        alert('你要搜索的是：' + term);
    }
};

添加命令到 Annyang：使用 annyang.addCommands(commands); 方法将命令添加到 Annyang。
```
annyang.addCommands(commands);
```
启动 Annyang：调用 annyang.start(); 启动语音识别功能。
```
annyang.start();
```

借助 Annyang 和其他相关库，如 SpeechKITT，可以进一步美化用户界面并增强功能，从而提供更佳的用户体验。

完整代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Annyang 和 SpeechKITT 中文语音识别示例</title>
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum=1.0,minimum=1.0,user-scalable=0" />
    <style>
        #skitt-ui{
            height: 50px;
        }
    </style>
</head>
<body>

<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/annyang.2.6.1.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/speechkitt.min.js"></script>
<script>
    // 检查是否支持 Annyang
    if (annyang) {
        // 设置中文（简体）
        annyang.setLanguage('zh-CN');

        // 定义命令
        var commands = {
            '你好': function() {
                alert('你好，世界！');
            },
            'open *page': function(page) {
                alert('你要打开的是：' + page);
                // 可以在这里添加逻辑来打开指定的页面
            },
            'search *term': function(term) {
                alert('你要搜索的是：' + term);
                // 可以在这里添加逻辑来执行搜索
            }
        };

        // 添加命令到 Annyang
        annyang.addCommands(commands);

        // 初始化 SpeechKITT
        SpeechKITT.annyang();

        // 设置 SpeechKITT 主题和样式
        SpeechKITT.setStylesheet('//repo.bfw.wiki/bfwrepo/css/speechkitt.flat.css');
      //  SpeechKITT.vroom();

        // 设置 SpeechKITT 的提示信息
        SpeechKITT.setInstructionsText('请说一个命令...');
        SpeechKITT.setSampleCommands(['你好', 'open 百度', 'search天气']);

        // 设置 SpeechKITT 的开始和停止按钮文本
        SpeechKITT.setStartCommand(function() {
            annyang.start();
            SpeechKITT.setInstructionsText('Listening...');
        });

        SpeechKITT.setAbortCommand(function() {
            annyang.abort();
            SpeechKITT.setInstructionsText('Click to start listening again.');
        });

        // 显示 SpeechKITT 的 UI
       // SpeechKITT.displayRecognizedSentence('点击下方按钮开始说话');
        SpeechKITT.vroom();

        // 启动 Annyang
        annyang.start();
    } else {
        alert('你的浏览器不支持语音识别');
    }
</script>

</body>
</html>