react-emotion_如何使用Web Speech API和Node.js构建语音转Emotion Converter-CSDN博客

react-emotionHave you ever wondered - can we make Node.js check to see if what we say is positive or negative? 您是否曾经想过-我们可以让Node.js检查一下我们说的是肯定还是否定的？ I got a newsletter which discussed tone detection....

摘要由CSDN通过智能技术生成

react-emotion

Have you ever wondered - can we make Node.js check to see if what we say is positive or negative?

您是否曾经想过-我们可以让Node.js检查一下我们说的是肯定还是否定的？

I got a newsletter which discussed tone detection. The program can check what we write and then tells us if it might be seen as aggressive, confident, or a variety of other feelings.

我收到了一个通讯，讨论了音调检测。该程序可以检查我们写的内容，然后告诉我们它是否可能被视为具有进取心，自信或其他多种感觉。

That got me wondering how could I build a simplified version using the browser and Node.js that would be initiated by speaking.

那让我想知道如何使用通过语音启动的浏览器和Node.js构建简化版本。

As a result, I ended up with a small project that detects if what was spoken has positive, neutral, or negative valence.

结果，我结束了一个小项目，该项目可以检测所讲的内容是否具有正价，中性价或负价。

Here's how I did it.

这是我的方法。

计划 (The plan)

When you're starting a project, you should sketch out - at least vaguely - your goal and how to reach it. Before starting my search I noted down that I needed:

当您开始一个项目时，您应该(至少模糊地)勾勒出您的目标以及如何实现它。在开始搜索之前，我记下了我需要：

Voice recording
录音
A way to translate the recording to text
一种将录音转换为文本的方法
A way to give the text a score
一种给文本打分的方法
A way to show the result to the user that just spoke
向刚刚讲过的用户显示结果的方法

After researching for a while, I discovered that the voice recording and translation to text parts were already done by the Web Speech API that's available in Google Chrome. It has exactly what we need in the SpeechRecognition interface.

经过一段时间的研究，我发现语音记录和文本部分的翻译已经由Google Chrome浏览器中提供的Web Speech API完成。正是我们在SpeechRecognition界面中所需要的。

As for text scoring, I found AFINN which is a list of words that are already scored. It has a limited scope with "only" 2477 words but it's more than enough for our project.

至于文字评分，我发现AFINN是已经评分的单词列表。它的范围有限，只有“ 2477个字”，但对于我们的项目来说已经绰绰有余了。

Since we're already using the browser we can show a different emoji with HTML, JavaScript and CSS depending on the result. So that handles our last step.

由于我们已经在使用浏览器，因此可以根据结果显示具有HTML，JavaScript和CSS的不同表情符号。这就是我们的最后一步。

Now that we know what we're going to use, we can sum it up:

现在我们知道了要使用的内容，我们可以总结一下：

The browser listens to the user and returns some text using the Web Speech API
浏览器收听用户并使用Web Speech API返回一些文本
It makes a request to our Node.js server with the text
它使用文本向我们的Node.js服务器发出请求
The server evaluates the text using AFINN's list and returns the score
服务器使用AFINN的列表评估文本并返回分数
The browser shows a different emoji depending on the score
浏览器会根据得分显示不同的表情符号

Note: If you're familiar with project setup you can mostly skip the "project files and setup" section below.

注意：如果您熟悉项目设置，则通常可以跳过下面的“项目文件和设置”部分。

项目文件和设置 (Project files and setup)

Our project folder and files structure will be as follows:

我们的项目文件夹和文件结构如下：

src/
  |-public // folder with the content that we will feed to the browser
    |-style // folder for our css and emojis
      |-css // optional folder, we have only one obvious file
        |-emojis.css
      |-images // folder for the emojis
    |-index.html
    |-recognition.js
  package.json
  server.js // our Node.js server

On the front end side of things, our index.html file will include the JS and CSS:

在事情的前端，我们的index.html文件将包含JS和CSS：

<html>
  <head>
    <title>
      Speech to emotion
    </title>
	<link rel="st