alpha 下載 - alpha 原始碼下載

阿爾法

Ai源碼

1.0.0

下載

製作您自己的（完全可自訂的）基於網路的聊天機器人

看看我們的現場演示

作為 Icalia Labs 虛擬銷售助理在現實生活中實施

Alpha 是一個機器人，或者更確切地說是建立您自己的基於網路的聊天機器人的基礎。我們啟動這個專案是因為我們認為聊天機器人非常有幫助且非常有趣，但是目前的情況是大多數聊天機器人僅限於現有的訊息平台，例如 Facebook，這很好，但是如果您希望您的機器人生活在其他地方怎麼辦？

您可以建立自己的機器人並定義自己的視覺樣式和規則，並對自訂和邏輯進行無限控制。已經存在各種解決方案，但它們可能具有局限性、成本高昂且難以實施。

這就是 Alpha 派上用場的地方。該庫旨在讓您以非常簡單的方式建立自己的機器人。你只需要：

下載
插入您自己的問答樹
插入您自己的顏色和圖像

Alpha 負責整個 UI 渲染和應用程式狀態的處理。您實際上不需要了解任何 React （或 Javascript）。但是，如果您了解 React 和 Redux，您可以進一步自訂機器人應用程式的渲染，甚至將其連接到您選擇的任何後端或 AI 引擎。

安裝

Alpha 是為在Docker上運作而建置的。但是，只要您的系統中有NodeJS以及npm或YARN （首選！），您就可以在本地運行它。

發展

要在電腦中安裝並運行，只需在終端機中運行以下命令。您需要安裝 Docker（請參閱下方的說明，以了解沒有 docker 的情況）：

複製此儲存庫： git clone https://github.com/IcaliaLabs/alpha.git
導航到目錄： cd alpha
安裝依賴項： docker-compose run --rm alpha yarn install
然後就可以解除伺服器了： docker-compose up alpha

就是這樣！如果您在瀏覽器中開啟localhost:3000 *，您應該會看到演示機器人在瀏覽器中啟動並執行。

在開發模式下運作時的幾個要點：

機器人應用程式將啟用熱重載，以便您體驗 Webpack + React 的好處。
Redux DevTools預設為啟用，以便您可以即時檢查應用程式的操作/狀態變化。
每個機器人訊息之間的時間設定為 0 。這是為了最大限度地減少開發人員在一次又一次地檢查對話流程時的挫敗感，但是如果您願意，您可以在app/containers/BotContainer/sagas.js中更改此行為。

生產

Heroku：只需運行git push heroku master 。這個機器人已經為 Heroku 做好準備了！
使用 Docker 本地化：如果您可以編譯映像以查看其在生產中的表現，我們也會將建置放在一起。只需運行：

  docker-compose up release

它將建立映像並提升生產伺服器。

沒有 Docker

如果您希望在不使用 Docker 的情況下安裝和執行，則必須直接在目錄中安裝所有依賴項：

對於發展：

複製此儲存庫： git clone https://github.com/IcaliaLabs/alpha.git
導航到目錄： cd alpha
執行npm install或yarn install來安裝依賴項
運行npm start啟動伺服器
在瀏覽器中存取localhost:3000

對於生產：

這個 repo 已準備好 Heroku，只需執行git push heroku master即可
如果您因為某些原因更改了package.json的腳本，請務必在部署到生產伺服器之前考慮這些步驟。
對於 AWS，您可以按照此處列出的相同步驟操作
對於 Azure/Softlayer/其他伺服器，您必須 ssh 到伺服器，拉取儲存庫，使用yarn安裝依賴項，然後執行npm run build才能建立./build資料夾。最後，您可以使用start:prod啟動伺服器。或者，只需運行start:production ，它將按順序一起運行這些步驟以及測試。

自訂對話

機器人所說內容背後的所有邏輯（包括問答邏輯）都位於BotMind內部，該 BotMind 位於app/BotMind/ 。我們將每個單獨的機器人或用戶輸入稱為“氣泡”，因為它們在聊天 UI 中如此呈現。

為了自訂對話，您只需要理解和編輯app/BotMind/_initialBubble.js和app/BotMind/BotMindFlows/index.js 。

機器人思維

BotMind 的主檔案是BotMind.js ，但該檔案僅充當_initialBubble.js 、 _nextBubble.js和_recommendationBubbles.js中函數的收集器和導出器。這三個文件依序根據app/BotMind/BotMindFlows/內的問答樹執行其邏輯。

_initialBubble.js

您可以在此設定機器人在初始化或使用者選擇重新啟動對話時在對話樹中的哪個點啟動。

_nextBubble.js

該文件包含機器人應根據來自機器人或用戶的最後一條訊息跳到哪個氣泡或對話的邏輯。您實際上並不需要更改此文件，除非您希望深入研究更精細的自訂。請自行承擔風險。

_recommendationBubbles.js

當在對話氣泡中傳遞shouldEstimateRecommendation: true時，此檔案執行選擇路徑的邏輯。該文件根據對話期間包系統累積的積分進行操作。您實際上並不需要更改此文件，除非您希望深入研究更精細的自訂。請自行承擔風險。

BotMindFlows 機器人思維流

BotMindFlows 位於app/BotMind/BotMindFlows/ 。預設情況下，您只會找到一個index.js文件，但如果您的對話樹開始變得太大，您可以建立自己的檔案並使用index.js使用擴充運算子將它們組合起來，如下所示。

import greetings from './conversation1';
import designSprint from './conversation2';
import designSprintQuestions from './conversation3';

const questions = {
	...conversation1,
	...conversation2,
	...conversation3,
}

export default questions;

每次 BotMind 分析去哪裡（在_nextBubble.js內）時，它都希望在app/BotMind/BotMindFlows/index.js內找到問題的雜湊。問題由……你猜對了，單獨的問題答案哈希組成。在這裡您可以開始製定對話的邏輯和流程。例如，在我們的演示中，您會發現以下內容：

 const questions = {start:{botPrompt: "你好人類，我的名字是Alpha，我是一個很棒的聊天機器人",answers: [{nextId: "myPurpose"}] },myPurpose:{botPrompt:“我的目標是成為一個簡單的聊天機器人，引導用戶並且能夠做出決策並提出建議。” ,answers: [{nextId : "yourName"}]},yourName:{botPrompt: "那麼，你叫什麼名字？",input: textField(),answers: [ {answer: common_greetings,nextId: "greetings_notAName", } , {answer: common_greetings_negative, catchName: true,nextId: "asYouCanSee", },],},
	...}導出預設問題；

每個問題哈希必須有它自己的唯一 ID 。我們建議您使這些 ID盡可能不言自明，即使這意味著要多寫一點，因為隨著機器人對話庫的增長，記住哪個 ID 做什麼可能會成為 A 中的一個痛苦。以下選項：

botPrompt（[String] 必要）：來自機器人的訊息
答案（[Array] 必要）：機器人可能根據使用者回答的內容做出不同的回應。此陣列由雜湊值組成，每個雜湊值代表一個可能的對話流結果。 [ answers ] 內的雜湊值採用以下選項：

nextId（[String] required） ：確定如果滿足此答案，機器人將導航到哪個對話 ID。在您的機器人發出最後一條訊息時或在您跳到估計推薦之前（見下文） ，您應該傳遞null 。
answer ([String | RegEx]) ：將觸發此雜湊的使用者答案。如果您使用selectField或tagsField為使用者預先定義答案，則可以使用字串，否則您可能需要使用 RegEx（請參閱範例）。
sumToBags ([Array]) ：在這裡您可以開始向BagsSystem添加點，以便進行更高級的流程控制和/或發出建議（如果這是您的機器人的目的）。 sumToBags通常如下圖所示： sumToBags:[{name: "recommendation1", points: 1}, {name: "recommendation2", points: 3}]
catchName ([Boolean]) ：將向 React 發出訊號，將使用者訊息中的使用者名稱儲存到應用程式狀態。
catchCompanyName ([Boolean]) ：與上方相同，但用於公司名稱。
catchMail ([Boolean]) ：與上方相同，但針對電子郵件地址。
catchPhone ([Boolean]) ：與上方相同，但用於電話號碼。
shouldEstimateRecommendation ([Boolean]) ：將通知BotMind打破常規流程並分析推薦包，以推動對話（請參閱範例）。
finishConversation ([Boolean]) ：將通知機器人完成下一個對話的對話。發生這種情況時，用戶輸入將被停用，機器人將“離線”，直到用戶選擇“重新啟動”。
注意 – 如果您的對話部分的 botPrompt 不期望產生後果，您可以像這樣傳遞nextId ：
```
answers: [
	{
		nextId: "hello"
	}
]
```

input ([Object]) ：這決定在此botPrompt期間使用者可以使用什麼類型的輸入（文字欄位、標籤、選擇、停用等）。預設情況下，輸入是禁用的文字欄位。我們建議您使用index.js檔案開頭包含的StateFormatter幫助程式。
type ([String]) ：機器人傳送的訊息類型（「text」、「media」、「link」或「transformedText」）。
varName ([String]) ：如果您選擇「transformedText」作為輸入類型，則可以在botPrompt中寫入@varName ，它將引用此選項。當機器人呈現訊息時，它將尋找儲存在React 狀態中的變數（見下文）並替換@varName為該變數的值。

**向使用者做出「推薦」（根據累積的對話歷史選擇對話路徑）**

如上所述，您可以選擇在 React 狀態中儲存一些值，然後根據這些值計算反應/流程/建議。我們稱之為袋子系統。

袋子系統

袋子系統的概念是我們預先定義一些“袋子”，隨著對話的進行，我們可以用“點”來填充這些“袋子”。最後，當您決定對其中一個問題答案雜湊值呼叫shouldEstimateRecommendation: true時，將呼叫_recommendationBubbles.js來執行操作，根據每個套件累積的積分來決定接下來要顯示的內容。

第一步是在/app/BotMind/recommendationBags.js定義您將使用的套件。如果您沒有定義這些包，機器人將會工作，但在您呼叫addToBags或shouldEstimateRecommendation時不知道要做什麼。袋子看起來像這樣：

const recommendationBags = [
	{
		name: "redWine",
		defaultValue: 0,
		goToBubbleId: "redWine_start",
	},
	{
		name: "whiteWine",
		defaultValue: 0,
		goToBubbleId: "whiteWine_start",
	},
	{
		name: "roseWine",
		defaultValue: 0,
		goToBubbleId: "roseWine_start",
	},
]

export default recommendationBags;

之後，您可以在問答流程中使用addToBags定義何時新增，例如：

question1:{
	botPrompt: "Which of these are you having?",
	input: selectField(["Red Meat", "Sea Food", "Chicken", "Pasta"]),
	answers: [
			...
			{
				answer: "Red Meat",
				nextId: "question2",
				sumToBags:[{name: "redWine", points: 4}, {name: "roseWine", points: 1}]
			},
			...
		]
	}

當你準備好後，只需呼叫shouldEstimateRecommendation如下所示：

question2:{
	botPrompt: "What will you serve for dessert?",
	input: selectField(["Chocolate", ...]),
	answers: [
		...
		{
			answer: "Chocolate",
			shouldEstimateRecommendation: true,
			nextId: null,
			sumToBags:[{name: "redWine", points: 3}, {name: "whiteWine", points: 1}, {name: "roseWine", points: 2}]
		},
		...
	]
},

在此範例中，將呼叫_recommendationBubbles.js ，因此下一個機器人氣泡可能是redWine_start處的氣泡。

自訂使用者介面

我們冒昧地預先定義了一個 UI，以節省您的時間。

Bot 的絕大多數樣式由單一檔案/app/customization/styleVariables.js控制，在這裡您可以更改所有元素使用的幾乎所有顏色以及 UI 的背景。

如果您希望對 UI 進行進一步更改，您可以直接深入研究樣式表檔案。 /app/global-styles.js中有一個全域文件，某些元件或容器在其各自的資料夾中針對特定的模組化元件有自己的styledComponents.js檔案。這些檔案使用Styled-Components ，這是一個非常棒的 React/ES6 函式庫（官方認為它是最佳實踐輔助工具）。這些檔案使用 Javascript 的標記模板文字來用 CSS 插入 JS 變量，但不要驚慌，這些檔案幾乎可以被視為常規 CSS/SCSS。

注意 - 我們的目的是逐步遷移到 100% 獨立、模組化樣式的元件，例如/app/components/UserInput/styledComponents.js中的元件，並刪除/app/global-styles.js中的幾乎所有程式碼

如果僅僅透過擺弄元件的 CSS 無法滿足您的客製化願望，您可以隨意自訂幾乎所有其他內容，但除此之外，您將不得不處理應用程式的 React (+Redux) 端（見下文）。

自訂 React 應用程式

Alpha 的整個 React 方面已經以這個很棒的儲存庫為基礎進行了重構。利用 React 最完善的最佳實踐，即使用：

終極版
不可變JS
重新選擇
Redux-Saga
樣式元件

如果你想擺弄 Alpha 的 React 方面，那麼你最好先看看這些文件。

發送電子郵件（待定）

我們確信您希望向機器人的所有者和最終用戶發送自動電子郵件，回顧他們的對話等，我們正在研究一種方法來提供最靈活且與後端無關的解決方案，將允許幾乎「即插即用」。

現在，您最好的選擇是將其連接到某些 Node 或 Express（或 Rails 5.1.x）伺服器並利用自己的郵件程式解決方案。您可以查看文件/app/BotMind/BotMailer.js ，我們將其用於基於 Rails 的實現，但截至目前，我們已從/app/containers/BotContainer/sagas.js你必須編寫自己的傳奇。