機器學習做自動聊天機器人

by Vanco Stojkov

通過Vanco Stojkov

建立聊天機器人需要什么？讓我們找出答案。 (What does it take to build a chatbot? Let’s find out.)

Without any delay, the image below shows what we are building:

沒有任何延遲，下圖顯示了我們正在構建的圖像：

To answer the question in the title, “What does it take to build a chatbot?” the answer is not much.

要回答標題“構建聊天機器人需要什么？”中的問題。答案不多。

I’m a web developer. It has been my desire to dig into this thrilling field for a long time. Unfortunately, I can’t say I have the knowledge in Natural Language Understanding (NLU) required to build a chatbot without help. The good news is that such help is available today.

我是網絡開發人員。長期以來，我一直渴望進入這個激動人心的領域。不幸的是，我不能說我不具備構建聊天機器人所需的自然語言理解(NLU)知識。好消息是，今天有這樣的幫助。

Google’s Cloud Natural Language API, Microsoft’s Cognitive Services APIs, and IBM’s Watson Conversation provide commercial NLU services, with generous free tiers. There are also completely free ones, at least for the moment. This includes API.AI, which has recently been acquired by Google, and Wit.ai, which Facebook owns.

Google的Cloud Natural Language API ，Microsoft的Cognitive Services API和IBM的Watson Conversation提供了具有大量免費套餐的商業NLU服務。也有完全免費的，至少目前是這樣。這包括API.AI ，最近被谷歌收購， Wit.ai ，其中Facebook的擁有。

From a web developer’s point of view, that’s all the help we need — an API which will remove the complexity for us.

從Web開發人員的角度來看，這就是我們需要的所有幫助-API將為我們消除復雜性。

讓我們從有趣的部分開始 (Let’s start with the fun part)

If you are eager to see the example live, here is the demo available on Heroku. The entire code for this example is available on GitHub.

如果您希望現場觀看此示例，請參見Heroku上的演示。該示例的完整代碼可在GitHub上找到。

For the purpose of this article, we’ll create a chatbot called TiBot to answer our questions about the date and time. We’ll use API.AI’s API to process these questions. I believe API.AP is more intuitive and easier to work with than Wit.ai.

出于本文的目的，我們將創建一個名為TiBot的聊天機器人，以回答有關日期和時間的問題。我們將使用API.A我的API來處理這些問題。我相信API.AP比Wit.ai更直觀，更易于使用。

At the back end, a simple Node.js server will handle requests sent from the front-end app via WebSockets. We’ll then fetch a response from the language processing API. Finally, we’ll send the answer back via WebSockets.

在后端，一個簡單的Node.js服務器將處理通過WebSockets從前端應用程序發送的請求。然后，我們將從語言處理API中獲取響應。最后，我們將通過WebSockets將答案發送回去。

At the front end, we have a messenger-like app built on a single Angular component. Angular is built-in TypeScript (a typed superset of JavaScript). If you are not familiar with either of them, you still should be able to understand the code.

在前端，我們有一個基于單個Angular組件的類似于Messenger的應用程序。 Angular是內置的TypeScript (JavaScript的類型化超集)。如果您不熟悉它們中的任何一個，那么您仍然應該能夠理解代碼。

I chose Angular because it inherently uses RxJS (the ReactiveX library for JavaScript). RxJS handles asynchronous data streams in an amazingly powerful yet simple manner.

我選擇Angular是因為它固有地使用RxJS (JavaScript的ReactiveX庫)。 RxJS以驚人的強大而簡單的方式處理異步數據流。

API.AI設置 (API.AI setup)

API.AI has a neat Docs section. First, we need to become familiar with some of the basic terms and concepts related to the APIs, and to know NLU in general.

API.AI有一個簡潔的Docs部分。首先，我們需要熟悉與API相關的一些基本術語和概念，并全面了解NLU。

Once we create an account at API.AI, we need to create an agent to start our project. With each agent, we get API keys — client and developer access tokens. We use the client access token to access the API.

在API.AI中創建帳戶后，我們需要創建一個代理以啟動我們的項目。對于每個代理，我們都獲得API密鑰-客戶端和開發人員訪問令牌。我們使用客戶端訪問令牌來訪問API。

Agents are like projects or NLU modules. The important parts of an agent are intents, entities, and actions and parameters.

代理就像項目或NLU模塊一樣。代理的重要部分是意圖，實體以及動作和參數。

Intents are the responses the API returns or, according to API.AI, “a mapping between what a user says and what action should be taken by your software.” For example, if a user says, “I want to book a flight,” the result we receive should look like the following:

意圖是API返回的響應，或者根據API.AI，“用戶所說的內容與您的軟件應采取的措施之間的映射。” 例如，如果用戶說“我要預訂航班”，我們收到的結果應如下所示：

{ ... "action": "book_flight" ... }

Entities help extract data from what the user says. If a user says, “I want to book a flight to Paris,” we want to get the information about Paris in. We need that data passed to our logic so that we can book a flight to Paris for our user. The result should look like this:

實體有助于從用戶所說的內容中提取數據。如果用戶說“我想預訂飛往巴黎的航班”，我們希望獲得有關巴黎的信息。我們需要將數據傳遞到邏輯中，以便我們可以為用戶預訂飛往巴黎的航班。結果應如下所示：

{  ...  "action": "book_flight",   "parameters": {    "destination": "Paris"  }  ...}

Entities are parameters values, like data types. There are system-defined entities by the API.AI platform. Examples of these include @sys.date, @sys.color, @sys.number. More complicated ones include @sys.phone-number, @sys.date-period, @sys.unit-length-name.

實體是參數值，例如數據類型。 API.AI平臺有系統定義的實體。這些示例包括@sys.date ， @sys.color ， @sys.number 。更復雜的參數包括@sys.phone-number ， @sys.date-period ， @sys.unit-length-name 。

We can also define our own entities, or pass them on the fly with each request. A good example of passing entities on the fly is that of users listening to their playlists. Users have a playlist entity in their request or a user session with all of the songs in the playlist. We would be able to respond to “Play Daydreaming” if the user is currently listening to Radiohead’s A Moon Shaped Pool playlist.

我們還可以定義自己的實體，或隨每個請求即時傳遞它們。動態傳遞實體的一個很好的例子是用戶收聽其播放列表。用戶在其請求中具有播放列表實體，或者與播放列表中的所有歌曲進行用戶會話。如果用戶當前正在收聽Radiohead的A Moon Shaped Pool播放列表，我們將能夠響應“ Play Daydreaming”。

Actions and parameters send requests to the API so that they result in an action. But they may also result in something our chatbot doesn’t understand. We may choose to fall back to a default response in that case.

動作和參數將請求發送到API，以便它們導致動作。但它們也可能導致我們的聊天機器人無法理解。在這種情況下，我們可以選擇退回默認響應。

Parameters are the companion of actions. They complement and complete the action. In some cases, we don’t need parameters. But there are cases where actions only make sense with parameters. An example is booking a flight without knowing the destination. That is something we need to think about before we even start creating the intents.

參數是動作的伴侶。他們補充并完成了動作。在某些情況下，我們不需要參數。但是在某些情況下，操作僅對參數有意義。例如，在不知道目的地的情況下預訂航班。在開始創建意圖之前，我們需要考慮這一點。

Finally, the following code is how the API’s response should appear for a resolved intent:

最后，以下代碼是API響應如何顯示以解決問題的意圖：

The most important part of the JSON is the “result” object with the “action” and “parameters” properties discussed above. The confidence for the resolved query (in the range of 0 to 1) is indicated with “score”. If “score” is zero, our query hasn’t been understood.

JSON最重要的部分是具有上述“action”和“parameters”屬性的“result”對象。已解決查詢的置信度(介于0到1之間)用“score”表示。如果“score”為零，則說明我們的查詢不正確。

It’s worth noting that the “context” array contains information about unresolved intents that may need a follow-up response. For example, if a user says, “I want to book a flight,” we’d process the book_flight” action (the context). But to get the required “destination” , we may respond with, “Ok, where would you like to go?” and process the “destination” within the following request.

值得注意的是， “context”數組包含有關未解決的意圖的信息，這些信息可能需要后續響應。例如，如果用戶說“我想預訂航班”，我們將處理book_flight”動作(上下文)。但是要獲得所需的“destination” ，我們可能會回答：“好，您想去哪里？” 并在以下請求中處理“destination” 。

后端 (The back end)

We are building a chat app. The communication between the client and the server will go through WebSockets. For that purpose, we’ll use a Node.js WebSocket library on the server. Our WebSockets module looks like this:

我們正在構建一個聊天應用程序。客戶端和服務器之間的通信將通過WebSockets進行。為此，我們將在服務器上使用Node.js WebSocket庫。我們的WebSockets模塊如下所示：

The format of the WebSockets messages is a string encoded JSON with “type” and “msg” properties.

WebSockets消息的格式是具有“type”和“msg”屬性的字符串編碼的JSON。

The string “type” refers to one of the following:

字符串“type”是指以下之一：

“bot”, which answers to the user.

“bot” ，它回答用戶。

“user”, which the user asks the bot.

“user” ，用戶向機器人詢問。

“sessionId”, which issues a unique session ID.

“sessionId” ，發出唯一的會話ID。

Our chatbot’s answer is contained in “msg”. It is sent back to the user, the question of the user, or the sessionId.

我們的聊天機器人的答案包含在“msg” 。它被發送回用戶，用戶問題或sessionId。

The processRequest(msg) represents the core of our server’s functionality. It first makes a request to the API:

processRequest(msg)代表我們服務器功能的核心。它首先向API發出請求：

Then, it executes withdoIntent() — the specific action for the user’s intent, based on the response from the API:

然后，它根據API的響應，使用doIntent() (針對用戶意圖的特定操作doIntent()執行：

doIntent() checks to see if there is a function to handle the action in the response. It then calls that function with the parameters of the response. If there is no function for the action, or the response is not resolved, it checks for a fallback from the API. Or it calls handleUnknownAnswer().

doIntent()檢查是否有函數來處理響應中的動作。然后，它使用響應的參數調用該函數。如果該操作沒有功能，或者響應沒有解決，它將檢查API的后備狀態。或調用handleUnknownAnswer() 。

The action handlers are in our intents module:

動作處理程序在我們的意圖模塊中：

To each handler function, we pass the parameters from the API response. We also pass the user’s time zone that we receive from the client side. Because we are dealing with the date and time, it turns out that the time zone plays an important role in our logic. It has nothing to do with the API, or NLU in general, but only with our specific business logic.

對于每個處理程序函數，我們將從API響應中傳遞參數。我們還會傳遞從客戶端收到的用戶時區。因為我們正在處理日期和時間，所以事實證明時區在我們的邏輯中起著重要作用。它與API或通常與NLU無關，而僅與我們特定的業務邏輯有關。

For example, if a user in London on Friday at 8:50 pm asks our bot, “What day is it today?” the answer should be, “It’s Friday.”

例如，如果星期五晚上8:50在倫敦的用戶問我們的機器人，“今天是星期幾？” 答案應該是“今天是星期五”。

But if that same user asks, “What day is it in Sydney?” the answer should be, “It’s Saturday in Sydney.”

但是，如果那個用戶問：“悉尼今天是星期幾？” 答案應該是“今天是悉尼的星期六”。

Location is important to our business logic too. We want to detect where the question is coming from (in the case of Sydney), so that we can get the time zone for its location. We would combine Google Maps Geocoding API and Time Zone API for that.

位置對我們的業務邏輯也很重要。我們想要檢測問題的來源(例如悉尼)，以便我們可以獲取問題所在的時區。為此，我們將結合使用Google Maps Geocoding API和時區API 。

前端 (The front end)

Our app is a single Angular component. The most important functionality is within the ngOnInit() method of the component:

我們的應用程序是單個Angular組件。最重要的功能是在組件的ngOnInit()方法中：

We first create the WebSocket (WS) connection to our server with a WS Observable. We then subscribe a couple of observers to it.

我們首先使用WS Observable創建到服務器的WebSocket(WS)連接。然后，我們訂閱幾個觀察者。

The first observer gets the sessionId when it connects to the WebSocket server. Immediately, the take(1) operator is unsubscribed:

第一個觀察者在連接到WebSocket服務器時獲得sessionId 。立即取消take(1)運算符：

The second subscription is the fun one:

第二個訂閱很有趣：

this.ws$.takeUntil(this.ngUnsubscribe$)  .filter(r => r.type === 'bot')  .retryWhen(err$ =>    Observable.zip(err$, Observable.range(1, 3), (e, n) => n)      .mergeMap(retryCount => Observable.timer(1000 * retryCount))  )  .delayWhen(inp => Observable.interval(100 + inp.msg.length * 10))  .subscribe(    (msg) => this.pushMsg(msg)  );

Here we want to take out the messages only from the bot, hence the filter(r => r.type === ‘bot’) operator. The retryWhen(err$ =&gt; …) operator automatically re-connects to the WebSocket after it has been disconnected.

在這里，我們只想從漫游器中取出消息，因此filter(r => r.type === 'bo t')運算符。 he retryWhen(err$ =& gt;…)運算符在斷開連接后會自動重新連接到WebSocket。

The purpose of the delayWhen() operator is to achieve “the bot is typing” effect that the messengers use. To do this, we delay the data for 100 + MSG_CHARACTERS_LENGTH * 10 milliseconds.

delayWhen()運算符的目的是實現Messenger使用的“機器人正在鍵入”效果。為此，我們將數據延遲100 + MSG_CHARACTERS_LENGTH * 10毫秒。

When the message gets through all the operators, we push it into our array of messages (msg) => this.pushMsg(msg).

當消息通過所有運算符時，我們將其推入消息數組(msg) => this.pushMsg(m sg)。

We use the component’s private pushMsg() method to add a message and to show it in the chat:

我們使用組件的私有pushMsg()方法添加消息并將其顯示在聊天中：

If the message is from the user (the clearUserMsg flag), we clear the input box. We use this.botIsTyping to control “the bot is typing” effect. So here we set it to false.

如果消息是來自用戶的( clearUserMsg標志)，則清除輸入框。我們使用this.botIsTyping來控制“機器人正在鍵入”效果。因此，這里我們將其設置為false 。

We handle the user input with the onSubmit() method when the user hits Enter:

當用戶按下Enter鍵時，我們使用onSubmit()方法處理用戶輸入：

Along with the user’s message, we send the user’s sessionId and time zone. These are indicated in this.ws$.next(JSON.stringify(input)). To show the bot is typing effect, we also set this.botIsTyping to true.

連同用戶的消息，我們發送用戶的sessionId和時區。這些在this.ws$.next(JSON.stringify(input))中指示。為了顯示機器人正在鍵入效果，我們還將this.botIsTyping設置為true 。

The Angular’s component template we use as the UI of our app, consists of the following code:

我們用作應用程序UI的Angular組件模板由以下代碼組成：

This is all we need for our app on the front end.

這就是我們前端應用程序所需要的。

It’s amazing to see how elegant and clean this code turned out. Thanks to RxJS. When using WebSockets, things tend to get complicated. Here we’ve done it with a single line of code.

看到這段代碼多么優雅和簡潔，真是太神奇了。感謝RxJS。使用WebSockets時，事情往往會變得復雜。在這里，我們用一行代碼完成了它。

And having features like auto re-connecting — well, that’s a story on its own. But with RxJS, we handled that in a simple manner.

并且具有自動重新連接等功能-嗯，這本身就是一個故事。但是，使用RxJS，我們可以以一種簡單的方式來處理它。

To conclude, I hope you understandable why I said, “It doesn’t take much” to answer the question, “What does it take to build a chatbot?”

總而言之，我希望您能理解為什么我說“不需要很多”來回答“構建聊天機器人需要什么？”這一問題。

This doesn’t mean that building a chatbot is an easy task. These NLU services, as intelligent as they are, won’t solve all our problems. We still need to take care of our own business logic.

這并不意味著構建聊天機器人是一件容易的事。這些NLU服務雖然非常智能，但是并不能解決我們所有的問題。我們仍然需要照顧自己的業務邏輯。

A couple of years ago, it was impossible for me to build something similar to this. But services like API.AI now makes that power available to everyone.

幾年前，我不可能建立類似的東西。但是，API.AI之類的服務現在使所有人都可以使用該功能。

API.AI also provides integrations with Facebook Messenger, Twitter, Viber, and Slack. But for this article, I thought it would be best to use their API to better understand how everything works.

API.AI還提供與Facebook Messenger，Twitter，Viber和Slack的集成。但是對于本文，我認為最好使用他們的API更好地了解一切。

I hope you’ve enjoyed this article and find it helpful to build your own chatbot.

我希望您喜歡這篇文章，并發現對構建自己的聊天機器人有幫助。