目录
介绍
背景
Recorderjs简单说明
代码
1、创建项目
2、语音识别相关功能
3、控制器实现
4、自定义js实现
总结
Demo下载
介绍
随着智能化的到来，.net中也有了很多关于人工智能的库。而我们平时做的应用软件中，好像很少使用这些智能化库，似乎它们只能用在特定的地方，或者只能高学历的专业人才才可以使用，享受智能化库带来的好处。写这篇文章，只是为了尝试将人工智能相关内容可以在普通的软件中使用，一方面尝试智能化的普及，另一方面也让非专业人士能更好的认识人工智能能给普通大众带来哪些便利。
本文主要尝试使用语音识别来集成到普通web应用程序中，虽然一些大型的互联网公司，或者大型的应用系统已经使用。
背景
本文只是使用微软自提高的语音识别类库，如果想要在实际项目中使用，可能需要寻找更好的语音识别接口。这里只是做一个尝试，给一个demo供参考。
文本的demo使用vs，.net framework 4.7。如果没有安装的请自行安装。
此demo的知识点主要有两点。一个是web端语音文件的生成和上传；另一个就是后端对语音文件的接收和识别，并返回识别结果。而web端语音识别主要使用的是Recorderjs。
Recorderjs简单说明
Recorderjs是一个开源的js库，开源Github地址：/mattdiamond/Recorderjs 。其主要实现web上的语音输入，语音文件生成等相关的工作。可以从上面的github地址中下载源代码和demo自行查看。由于其上提供的demo有点问题，所以可以自行创建一个文件夹，把recorder.js文件拷贝到这个文件夹中，并拷贝example_simple_exportwav.html文件到这个文件夹，同时对html文件进行相应的修改即可查看效果。
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>Live input record and playback</title><style type='text/css'>ul { list-style: none; }#recordingslist audio { display: block; margin-bottom: 10px; }</style></head><body><h1>Recorder.js simple WAV export example</h1><p>Make sure you are using a recent version of Google Chrome.</p><p>Also before you enable microphone input either plug in headphones or turn the volume down if you want to avoid ear splitting feedback!</p><button onclick="start(this);">record</button><button onclick="stop(this);" disabled>stop</button><h2>Recordings</h2><ul id="recordingslist"></ul><h2>Log</h2><pre id="log"></pre><script>var audio_context;var recorder;function start(button) {navigator.mediaDevices.getUserMedia({ audio: true }).then(function (stream) {var input = new AudioContext().createMediaStreamSource(stream);recorder = new Recorder(input);recorder.record();});button.disabled = true;button.nextElementSibling.disabled = false;}function stop(button) {recorder && recorder.stop();button.disabled = true;button.previousElementSibling.disabled = false;createDownloadLink();recorder.clear();}function createDownloadLink() {recorder && recorder.exportWAV(function (blob) {var reader = new FileReader();reader.onloadend = function () {var data = reader.result;}reader.readAsDataURL(blob);var url = URL.createObjectURL(blob);var li = document.createElement('li');var au = document.createElement('audio');var hf = document.createElement('a');au.controls = true;au.src = url;hf.href = url;hf.download = new Date().toISOString() + '.wav';hf.innerHTML = hf.download;li.appendChild(au);li.appendChild(hf);recordingslist.appendChild(li);});}</script><script src="recorder.js"></script></body></html>
保存修改后并打开，效果如下
点击record按钮后有以下提示
点击【允许】按钮即可开始说话了。说完您像识别的内容并点击stop按钮后，页面效果如下。
关于recorderjs的相关说明就到这里了。
代码
1、创建项目
现在让我们正式开始创建项目，打开vs并创建新项目
这里我使用的.NET Framwork4.7，并没有使用core，但是实现方式是相同的，有兴趣的可以自行创建完成。点击【确定】按钮后显示如下，只需要选择MVC即可，其他默认不动。
2、语音识别相关功能
项目创建好后，在项目根目录下创建SpeechRecognition文件夹，并在其下场景SpeechRecognition类，将相关识别代码添加到此类中
/// <summary>/// SpeechRecognition 的摘要说明/// </summary>public class SpeechRecognition{private static SpeechRecognitionEngine recognizer = null;/// <summary>/// 识别的结果/// </summary>public static string BackResult { get; set; }private static string path = string.Empty;/// <summary>/// 得到语音识别唯一的实例/// </summary>/// <returns></returns>public static void GetSingleInstaller(){if (recognizer == null){foreach (RecognizerInfo recognizerInfo in SpeechRecognitionEngine.InstalledRecognizers()){if (recognizerInfo.Id == "MS-2052-80-DESK") //recognizerInfo.Culture.Equals(cultureInfo) && {recognizer = new SpeechRecognitionEngine(recognizerInfo);break;}}//加载自然语法recognizer.LoadGrammar(new DictationGrammar());//语音识别处理事件recognizer.SpeechRecognized +=new EventHandler<SpeechRecognizedEventArgs>(Recognizer_SpeechRecognized);}}private static void Recognizer_SpeechRecognized(object sender, SpeechRecognizedEventArgs e){if (e.Result != null && e.Result.Text != null){BackResult = e.Result.Text;recognizer.RecognizeAsyncStop();}}/// <summary>/// 开始聆听/// </summary>public static void StartListen(){path = AppDomain.CurrentDomain.BaseDirectory + "Uploads"; //\\blob.wavvar arrFiles = System.IO.Directory.GetFiles(path);recognizer.SetInputToWaveFile(arrFiles[arrFiles.Length - 1]);recognizer.RecognizeAsync();} }
关于SpeechRecognizer实现原理和相关说明，可以参考如下链接：
/zh-cn/dotnet/api/system.speech.recognition.speechrecognizer?view=netframework-4.7。
这里就不做过多的展开了。
值得说明的是，在项目中需要引用System.Speech.dll类库，请不要忘记了。
3、控制器实现
这里并没有新建新的控制器专门实现，而是使用了现有的Home控制器，在About页面实现相关演示代码。
[HttpPost]public ActionResult StartListen(){//接受上传的语音文件foreach (string f in Request.Files){HttpPostedFileBase file = Request.Files[f];if (file != null && file.ContentLength > 0){//文件名var newFileName = DateTime.Now.ToString("yyyyMMddHHmmss") + ".wav";//文件绝对路径var absolutePath = Server.MapPath("~/Uploads/") + newFileName;file.SaveAs(absolutePath);}}System.Threading.Thread.Sleep(50);SpeechRecognition.StartListen();int count = 1;while (string.IsNullOrEmpty(SpeechRecognition.BackResult)){count++;if (count > 10){SpeechRecognition.BackResult = "网络异常，请重新说";break;}System.Threading.Thread.Sleep(200);}try{return Content(SpeechRecognition.BackResult);}finally{SpeechRecognition.BackResult = string.Empty;}}
然后在About页面中添加如下html代码
<div class="col-md-12"><button type="button" class="btn btn-outline blue-soft" id="startSay" onclick="start(this)">+</button><input type="text" id="remark" name="Remark" class="form-control" placeholder="请输入内容" x-webkit-speech /><div class="help-block"><span id="lisMsg">点击上方按钮进行语音输入</span> <button type="button" class="btn btn-outline blue-soft" id="finishSay" onclick="stop(this)">说完了</button><ul id="recordingslist"></ul></div></div>@section scripts{<script src="~/Scripts/recorder.js"></script><script src="~/Scripts/js/test.js"></script>}
从上面代码可以看出，我们引用了record.js文件，并引用了一个新建的自定义test.js文件。
4、自定义js实现
不过做多的说明，直接上代码
var audio_context;var recorder;function start(button) {navigator.mediaDevices.getUserMedia({ audio: true }).then(function (stream) {var input = new AudioContext().createMediaStreamSource(stream);recorder = new Recorder(input);recorder.record();});$("#lisMsg").text("聆听中···");$("#remark").focus();$("#finishSay").show();}function stop(button) {recorder && recorder.stop();createDownloadLink();recorder.clear();$("#lisMsg").text("点击上方按钮进行语音输入");$("#finishSay").hide();}function createDownloadLink() {recorder && recorder.exportWAV(function (blob) {//var reader = new FileReader();var formdata = new FormData(); // form 表单 {key:value}formdata.append("audio", blob); // form input type="file"$.ajax({url: '/Home/StartListen',type: 'post',processData: false,contentType: false,data: formdata,dataType: 'json',success: function (data) {console.log(data);$("#remark").val(data);},complete: function (data) {// Handle the complete eventconsole.log(data.responseText);$("#remark").val(data.responseText);}});});}
到这里，此demo的相关实现就已经完成了。最后，需要我们在Global.asax中添加一句代码。如下
SpeechRecognition.GetSingleInstaller();
在开始的时候就初始化好语音识别的实例。最后的效果如下
总结
这里我只是给出了一个实现的思路，其实很多地方可以调整。比如UI界面我用的vs默认创建的，您可以改成使用基于bootstrap的框架来实现；选择的语音识别引擎是微软提供的，其实它的识别度并不是很好，您可以考虑寻找其他更好的语音识别接口来对接等等。
