程式碼研究室簡介
1. 總覽
Actions on Google 是一個開發人員平台,可製作軟體來擴充 Google 助理 (Google 的虛擬個人助理) 在超過 10 億個裝置上擴充的功能,包括智慧型揚聲器、手機、汽車、電視、耳罩式耳機等等。使用者可透過 Google 助理參與對話,完成各項工作,例如購買食品雜貨或叫車。(如需可用功能的完整清單,請參閱動作目錄)。開發人員可以透過 Actions on Google 輕鬆建立及管理使用者與第三方服務之間的精彩對話體驗。
這是一個進階程式碼研究室模組,適用於已具備 Google 助理動作功能的讀者。如果您之前從未使用過 Action on Google,我們極力建議您依照我們提供的簡介程式碼研究室 (第 1 級、第 2 級和 3 級) 深入瞭解這個平台。這些進階模組可引導您完成一系列功能,協助您擴充 Action 和拓展觀眾群。
評估 Action 成效的其中一個重要方法,就是使用者互動,或是動作在初次互動後吸引使用者回流的成效。為了簡化過程,您可以在「動作」中導入多項功能,讓使用者能返回對話。
此程式碼研究室涵蓋使用者操作功能,以及 Actions on Google 的最佳做法。
建構項目
讓 Google 運用以下功能強化已建構的功能:
- 傳送每日更新,讓使用者輕觸按鈕即可與您的動作交談
- 傳送連結至動作的「推播通知」
- 建立連結,將使用者從行動瀏覽器帶往你的動作
課程內容
- 使用者參與的原因和重要性對該行動的影響為何?
- 如何修改特定動作來提高使用者參與度
- 適合在各種動作中使用的使用者互動功能
- 如何使用 Actions API 透過 Google 助理傳送通知
軟硬體需求
您必須擁有下列工具:
- 您選擇的 IDE/文字編輯器,例如 WebStorm、Atom 或 Sublime
- 終端機可執行已安裝 Node.js、npm 和 git 的殼層指令
- 網路瀏覽器,例如 Google Chrome
- 使用 Firebase 指令列介面的本機開發環境
- 使用 Google 助理的行動裝置 (Android 或 iOS) (你必須使用建立此專案的 Google 帳戶登入 Google 助理)。
我們強烈建議您熟悉 JavaScript (ES6) 的操作方式 (雖然不是必要步驟),但可以瞭解 Webhook 程式碼。
2. 設定專案
本節說明如何在先前完成的完整動作中加入使用者參與度功能。
瞭解範例
這個程式碼研究室的示範是一個簡單的動作,名為「動作健身房」的虛構健身房。這個動作會提供健身房的相關資訊,包括每天輪播的課程。由於這類類別每天都會提供不同的實用資訊,因此很適合用來為所有使用者互動功能提供實用的資訊。
下圖為 Action Gym 的對話流程範例:
您必須對對話方塊進行小幅修改,以更符合加入的互動功能。不過,對話的一般設計並不大,
下載您的基本檔案
執行下列指令,複製程式碼研究室的 GitHub 存放區:
git clone https://github.com/actions-on-google/user-engagement-codelab-nodejs
設定專案和代理程式
如要設定動作專案和 Dialogflow 代理程式,請完成下列步驟:
- 開啟動作控制台。
- 按一下 [新專案]。
- 輸入專案名稱,例如
engagement-codelab
。 - 按一下 [建立專案]。
- 請向下捲動至「更多選項」部分,然後按一下 [對話] 資訊卡,而不要選擇類別。
- 按一下 [建立動作] 展開選項,然後選取 [新增動作]。
- 按一下 [新增您的第一個動作]。
- 在「Create Action」(建立動作) 對話方塊中,選取 [Custom Intent] (自訂意圖),然後按一下 [Create] (建構),啟動 Dialogflow 主控台。
- 在 Dialogflow 主控台上按一下 [Create] (建立)。
- 按一下左側導覽列中的
(齒輪圖示)。
- 依序按一下 [匯出和匯入] 和 [從 Zip 還原]。
- 從您先前下載的
/user-engagement-codelab-nodejs/start/
目錄中上傳agent.zip
檔案。 - 輸入「
RESTORE
」,然後按一下 [還原]。 - 按一下 [完成]。
部署出貨要求
你的動作專案和 Dialogflow 代理程式已準備就緒,請透過 Firebase Functions CLI 部署本機 index.js
檔案。
在基礎檔案副本的 /user-engagement-codelab-nodejs/start/functions/
目錄中,執行下列指令:
firebase use <PROJECT_ID>
npm install
firebase deploy
幾分鐘後,您應該會看到「部署完成!」表示您已成功將 Webhook 部署到 Firebase。
擷取部署作業網址
您必須向 Dialogflow 提供雲端函式的網址。如要擷取這個網址,請按照下列步驟操作:
- 開啟 Firebase 主控台。
- 從選項清單中選取你的 Action 專案。
- 前往左側導覽列中的 [開發 > 函式]。當系統提示您「選擇資料共用設定」時,只要按一下 [稍後再進行],即可忽略這個選項。
- 您應該會在「Dashboard」(資訊主頁) 標籤下看到「Intt;fulfillment」項目 (含有網址在「Trigger」(觸發條件) 之下)。儲存這個網址;您需在下一節將網址複製到 Dialogflow。
在 Dialogflow 中設定 Webhook 網址
現在您必須更新 Dialogflow 代理程式,以便使用 Webhook 執行要求。如要採用這種方式,請按照下列步驟進行:
- 開啟 Dialogflow 主控台 (您也可以視需要關閉 Firebase 主控台)。
- 按一下左側導覽列的 [執行要求]。
- 啟用 Webhook。
- 貼上從 Firebase 資訊主頁複製的網址 (如果還沒出現)。
- 按一下 [儲存]。
確認專案設定正確
使用者應能針對 Action Gym 叫用動作,包括以營業時間撰寫的硬式編碼文字回應,以及列出一週中每一天課程時間表的文字回應。
如何在動作模擬工具中測試您的操作:
- 在 Dialogflow 主控台左側導覽面板中,依序按一下 [Integrations] (整合) > [Google 助理]。
- 確認 [自動預覽變更] 已啟用,然後按一下 [測試] 以更新動作專案。
- 動作模擬工具會載入你的「動作」專案。如要測試動作,請在 [輸入] 欄位中輸入
Talk to my test app
,然後按下 Enter 鍵。 - 您應該會看到可以打給 Action Gym 的回應。請嘗試按照提示繼續對話,同時確保執行要求包含對每個輸入內容的回應。
3. 新增每日更新訂閱項目
與使用者互動時,最常用的方法就是提供最實用的資訊。具體做法是讓使用者選擇訂閱意圖的每日更新,藉此將 Google 助理通知直接傳送給該意圖的意圖。
在這個步驟中,您將瞭解每日更新項目,並將這些動作新增至動作的課程清單意圖中。執行這些操作後,你的動作會如下所示:
這會如何吸引使用者?
智慧型手機使用者通常已熟悉推播通知,可提供應用程式相關資訊和更新。透過 Google 助理以外的行動裝置,您可以利用每日更新訂閱項目輕鬆取得特定使用者的行動裝置資料。
每日更新是一項實用的互動工具,但不一定能納入每一個動作中。在決定是否要為某個動作新增每日更新訂閱時,請參考下列提示:
- 確保使用者每天看到的更新內容,都會看到不同的實用資訊。如果每次輕觸更新後,系統每次都顯示相同的提示,則使用者可能會在幾天後取消訂閱。
- 請讓使用者在瀏覽您每日的更新項目時,直接使用適當的對話方塊。使用者通常不會從對話開始,因此不會覺得太多內容。
- 先向使用者顯示您的「動作」所帶來的好處,再提示使用者訂閱每日最新動態。使用者應該已選擇「我希望每天看到這項內容」,也就是提供訂閱選項的選項。
- 不要重複向使用者提供訂閱建議。在使用者看過訂閱項目後,立即提供每日更新項目,並避免在其他地方透露這些資料。
- 觸發更新意圖後,請讓對話保持精簡。大部分的每日更新都只能包含單一回應,而無需使用者輸入內容即可關閉。
開啟每日更新
您可以在歡迎對話中加入每日更新訂閱項目,讓使用者在對話開始時進入更明確的意圖,或是更具體的意圖,以便透過深層連結將對話連結至對話中的任一處。在這個程式碼研究室中,Class List 意圖是最適合的,因為對話會每天改變,而使用者覺得有必要提醒自己有哪些課程可以派上用場。
請按照下列步驟,為「課程清單」意圖啟用每日更新:
- 在「動作」控制台中,按一下 [開發] 分頁標籤,然後選擇左側導覽列中的 [動作]。
- 按一下「動作」清單下方的 [課程清單]。
- 在「使用者參與」部分,將 [您想為使用者提供每日更新] 選項切換為開啟狀態。
- 設定描述內容標題的「內容標題」。說明內容為「你希望我每天傳送什麼內容」,因此你必須說出標題,並提供清楚的音效。在這個範例中,請將「Content title」(內容標題) 設為
list of upcoming Action Gym classes
。 - 按一下網頁頂端的 [儲存]。
設定 Dialogflow
在 Dialogflow 主控台中,請按照下列步驟建立每日更新訂閱流程的意圖:
提示使用者進行訂閱
- 設定新的意圖以處理要求訂閱每日更新的使用者。在 Dialogflow 主控台中,按一下左側導覽面板中「Intents」(意圖) 旁邊的 [+] 按鈕即可建立新的意圖。
- 將這個新意圖命名為
Setup Updates
。 - 在「訓練詞組」區段下,新增下列使用者運算式:
Send daily reminders
Reminder
Remind me
Updates
Upcoming classes
- 在「Fulfillment」(執行要求) 區段下,切換「Enable Webhook call for thisIntent」(為這個意圖啟用 Webhook 呼叫) 選項。
- 按一下網頁頂端的 [儲存]。
處理使用者的決定
- 設定新意圖以處理使用者對於每日更新訂閱提示的回應。在左側導覽區中,按一下「Intents」(意圖) 旁邊的 [+] 按鈕即可建立新的意圖。
- 將這個新意圖命名為
Confirm Updates
。 - 在「事件」部分之下新增
actions_intent_REGISTER_UPDATE
。使用者完成每日更新訂閱流程後,就會觸發這個 Dialogflow 事件。 - 在「Fulfillment」(執行要求) 區段下,切換「Enable Webhook call for thisIntent」(為這個意圖啟用 Webhook 呼叫) 選項。
- 按一下網頁頂端的 [儲存]。
實作要求
如要在 Webhook 中導入執行要求,請完成下列步驟:
載入依附元件
在
index.js
檔案中,更新 require()
函式,從 actions-on-google
套件新增 RegisterUpdate
套件,匯入內容如下所示:
index.js
const {
dialogflow,
Suggestions,
RegisterUpdate,
} = require('actions-on-google');
更新建議方塊
在
index.js
檔案中,將 DAILY
項目新增至建議方塊標題清單,因此您的 Suggestion
定義如下所示:
index.js
// Suggestion chip titles
const Suggestion = {
HOURS: 'Ask about hours',
CLASSES: 'Learn about classes',
DAILY: 'Send daily reminders',
};
為新的意圖新增執行要求
當使用者表示想要訂閱時,可呼叫 RegisterUpdate
輔助程式以更新更新的意圖 (類別清單) 和類型 (DAILY
),啟動每日更新訂閱流程。訂閱程序完成後,Google 助理會透過 status
引數觸發 actions_intent_REGISTER_UPDATE
事件,說明訂閱項目是否成功完成。提供後續提示,提醒使用者如何根據訂閱狀態變更。
在
index.js
檔案中,新增下列程式碼:
index.js
// Start opt-in flow for daily updates
app.intent('Setup Updates', (conv) => {
conv.ask(new RegisterUpdate({
intent: 'Class List',
frequency: 'DAILY',
}));
});
// Confirm outcome of opt-in for daily updates
app.intent('Confirm Updates', (conv, params, registered) => {
if (registered && registered.status === 'OK') {
conv.ask(`Gotcha, I'll send you an update everyday with the ` +
'list of classes. Can I help you with anything else?');
} else {
conv.ask(` I won't send you daily reminders. Can I help you with anything else?`);
}
if (conv.screen) {
conv.ask(new Suggestions([Suggestion.HOURS, Suggestion.CLASSES]));
}
});
為使用者提供其他提示
「課程清單」回應的最後會提供每日更新訂閱項目,但這是個問題。使用者輕觸每日更新通知時,也會觸發相同的回應,因此即使他們只收到一則通知,系統也會要求他們訂閱每日最新動態。您該如何避免使用者認為他們需要重新訂閱?
幸好,您的 conv
物件引數包含使用者開始進行對話的位置相關資訊。您可以檢查 conv
引數,確認其中是否包含 UPDATES
部分,指出使用者從每日更新通知已開始對話,並據此變更回應。您也可以在提供類別清單後,使用這個對話分支來立即關閉對話方塊。
在
index.js
檔案中,替換下列程式碼:
index.js
// Class list intent handler
app.intent('Class List', (conv, {day}) => {
if (!day) {
day = DAYS[new Date().getDay()];
}
const classes =
[...new Set(schedule.days[day].map((d) => `${d.name} at ${d.startTime}`))]
.join(', ');
const classesMessage =
`On ${day} we offer the following classes: ${classes}. ` +
`Can I help you with anything else?`;
conv.ask(classesMessage);
if (conv.screen) {
conv.ask(new Suggestions([Suggestion.HOURS]));
}
});
:
index.js
// Class list intent handler
app.intent('Class List', (conv, {day}) => {
if (!day) {
day = DAYS[new Date().getDay()];
}
const classes =
[...new Set(schedule.days[day].map((d) => `${d.name} at ${d.startTime}`))]
.join(', ');
let classesMessage = `On ${day} we offer the following classes: ${classes}. `;
// If the user started the conversation from the context of a daily update,
// the conv's arguments will contain an 'UPDATES' section.
let engagement = conv.arguments.get('UPDATES');
// Check the conv arguments to tailor the conversation based on the context.
if (engagement) {
classesMessage += `Hope to see you soon at Action Gym!`;
conv.close(classesMessage);
} else {
classesMessage += `Would you like me to send you daily reminders of upcoming classes, or can I help you with anything else?`;
conv.ask(classesMessage);
if (conv.screen) {
conv.ask(new Suggestions([Suggestion.DAILY, Suggestion.HOURS]));
};
};
});
測試每日最新消息
在終端機中,執行下列指令以將更新後的 Webhook 程式碼部署至 Firebase:
firebase deploy
如要測試動作模擬工具的自訂自訂功能,請按照下列步驟操作:
- 在動作主控台中,前往 [測試]。
- 在「輸入」欄位中輸入
Talk to my test app
,然後按下 Enter 鍵。 - 輸入
Learn about classes
並按下 Enter 鍵。你的動作回應現在應提供傳送每日提醒的選項。 - 輸入
Send daily reminders
並按下 Enter 鍵。 - 輸入你想要看到更新的時間,然後按下 Enter 鍵。為了進行測試,請嘗試在目前時間的 3 到 5 分鐘後回覆。
在行動裝置上,您應該會收到有關 Google 助理通知,說明您預計將進行更新的時間。請注意,這則通知可能需要幾分鐘的時間才會顯示。只要輕觸通知,即可直接前往 Google 助理的「課程清單」意圖,查看即將進行的課程清單:
4. 新增推播通知
除了與您的動作之外的使用者互動之外,您也可以呼叫 Actions API,藉此傳送推播通知給使用者。這些通知與每日更新不同,Google 助理不會自動排定這些通知,所以您可以隨時間發送通知。
在這個步驟中,您必須新增「課程已取消」意圖,並通知使用者取消課程通知,瞭解如何在「動作」中導入推播通知。您也會設定傳送通知的三個元件:
- Actions API 帳戶 - 您傳送
POST
要求給 API 以通知使用者,因此您必須設定服務帳戶和憑證,才能與這個 API 整合。 - 權限小幫手 - 您必須擁有使用者的存取權限,才能存取傳送推播通知所需的使用者 ID。在此範例中,您將使用用戶端程式庫函式呼叫權限輔助程式,並要求此 ID。
- 儲存空間:如要將推播通知傳送至對話以外的使用者,您必須儲存使用者 ID,方便您隨時回想。在此範例中,您必須建立 Firestore 資料庫來儲存每位使用者的資訊。
按照這些指示進行後,您就會在動作的對話中新增下列對話方塊:
這會如何吸引使用者?
智慧型手機使用者通常已熟悉推播通知,可提供應用程式相關資訊和更新。推播通知可讓使用者靈活地透過 Google 助理以外的行動裝置存取使用者。每日更新的使用者已經知道,他們每天都會收到通知。然而,透過推播通知,使用者並不知道自己是否選擇接收不常的通知,或者每天是否會收到數則通知。
推播通知是很實用的互動工具,但不一定能納入每一個動作中。決定是否要在推播通知中加入推播通知時,請參考下列提示:
- 規劃推播通知的時間表範例。如果您打算每天傳送一則推播通知,建議您改用每日更新。
- 請確保您的推播通知在每次收到時都能提供實用資訊。此外,通知還能透過動作提供深層連結,因此請確保這些意圖對使用者有所幫助。
- 明確告知使用者要訂閱推播通知,他們必須瞭解每則推播通知的注意事項,並大致瞭解通知功能的傳送頻率。
啟用 Actions API
- 開啟 Google Cloud Console,然後在下拉式選單中選取您的 Actions 專案名稱。
- 在導覽選單中 (☰) 中,前往 API 與 Service > 程式庫。
- 搜尋 Actions API,然後按一下 [啟用]。
建立服務帳戶
Actions API 需要驗證,因此你必須建立服務帳戶才能傳送要求。請按照下列步驟建立及安裝 Actions API 的服務帳戶金鑰:
- 在 Google Cloud Console 的導覽選單中 (ridge) 中,前往 APIs & Services > Credentials。
- 按一下 [Create credentials > Service account key]。
- 在「服務帳戶」下拉式選單中,選取 [新增服務帳戶]。
- 填寫下列資訊:
- 服務帳戶名稱:
service-account
- 角色:Project > 擁有者
- 服務帳戶 ID:
service-account
(一律加上 @<project_id>.iam.gserviceaccount.com) - 金鑰類型:JSON
- 按一下 [Create]。
- 將下載的 JSON 檔案移至專案的 /user-engagement-codelab/start/functions/ 目錄。
- 將 JSON 檔案重新命名為
service-account.json
。
啟用 Firestore
為了在對話以外的地方傳送通知,您需要以儲存方式來儲存可從通知碼參照的使用者 ID。在此範例中,我們使用 Firestore 資料庫儲存已訂閱使用者的使用者 ID。
請按照下列步驟為您的動作建立 Firestore 資料庫:
- 在 Firebase 主控台中選取您的動作專案名稱。
- 在左側導覽列中,前往「Dev > Database」,然後按一下 [Create database]。
- 選取 [開始以測試模式啟動]。
- 按一下 [Enable] (啟用)。
設定 Dialogflow
請按照下列步驟在 Dialogflow 主控台中建立推播通知的選擇流程:
提示使用者進行訂閱
- 設定新的意圖來處理使用者要求訂閱取消課程的推播通知。在 Dialogflow 主控台中,按一下左側導覽面板中「Intents」(意圖) 旁邊的 [+] 按鈕即可建立新的意圖。
- 將這個新意圖命名為
Setup Push Notifications
。 - 在「訓練詞組」區段下,新增下列使用者運算式:
Subscribe to notifications
Send notification
Notify me
Send class notifications
Cancelled notifications
- 在「Fulfillment」(執行要求) 區段下,切換「Enable Webhook call for thisIntent」(為這個意圖啟用 Webhook 呼叫) 選項。
- 按一下網頁頂端的 [儲存]。
處理使用者的決定
- 設定新意圖來處理使用者的推播通知通知提示。在左側導覽區中,按一下「Intents」(意圖) 旁邊的 [+] 按鈕即可建立新的意圖。
- 將這個新意圖命名為
Confirm Push Notifications
。 - 在「事件」部分之下新增
actions_intent_PERMISSION
。使用者完成推播通知的訂閱流程後,就會觸發這個 Dialogflow 事件。 - 在「Fulfillment」(執行要求) 區段下,切換「Enable Webhook call for thisIntent」(為這個意圖啟用 Webhook 呼叫) 選項。
- 按一下網頁頂端的 [儲存]。
處理推播通知
您可以將推播通知連結到特定的意圖,讓輕觸推播通知的使用者可直接在「動作」中直接連結到該意圖。在此範例中,新增推播通知的意圖,提供取消課程詳細資料。
請按照下列步驟新增要在使用者輕觸推播通知時觸發的意圖:
- 在 Dialogflow 主控台中,按一下左側導覽面板中「Intents」(意圖) 旁邊的 [+] 按鈕即可建立新的意圖。
- 將這個新意圖命名為
Class Canceled
。 - 在「Training 這項功能」區段下,將
Cancelations
新增為「使用者運算式」。 - 在「Fulfillment」(執行要求) 區段下,切換「Enable Webhook call for thisIntent」(為這個意圖啟用 Webhook 呼叫) 選項。
- 按一下網頁頂端的 [儲存]。
在會議進行時傳送測試通知
在實際工作環境中,您應該有可傳送推播通知的指令碼與動作履行程式碼。在這個範例中,您可以建立一個意圖,讓您可以在叫用動作時叫用推播通知。本意圖僅用於偵錯;在實務上,推播通知不應由出貨程序處理,或是由其他動作觸發。
請按照下列步驟建立推播通知的測試意圖:
- 為了進行測試和偵錯,請設定新的意圖,以便向推播通知使用者傳送推播通知。在 Dialogflow 主控台中,按一下左側導覽面板中「Intents」(意圖) 旁邊的 [+] 按鈕即可建立新的意圖。
- 將這個新意圖命名為
Test Notification
。 - 在「Training 這項功能」區段下,將
Test notification
新增為「使用者運算式」。 - 在「Fulfillment」(執行要求) 區段下,切換「Enable Webhook call for thisIntent」(為這個意圖啟用 Webhook 呼叫) 選項。
- 按一下網頁頂端的 [儲存]。
開啟推播通知功能
如要為「課程已取消」意圖啟用推播通知,請按照下列步驟操作:
- 在 Dialogflow 主控台中,前往導覽列中的 [Integrations] (整合)。
- 按一下「Google 助理」資訊卡上的 [整合設定]。
- 將 ClassCanceled 新增為 隱式叫用意圖。執行這個步驟時,Dialogflow 可辨識出使用者是否可以使用「課程已取消」意圖 (輕觸推播通知) 開始對話。
- 按一下 [Close] (關閉)。
- 在「動作」控制台中,按一下 [開發] 分頁標籤,然後選擇左側導覽列中的 [動作]。
- 按一下「動作」清單下方的 [課程已取消]。
- 在「使用者參與」部分,將 [您想傳送推播通知嗎?] 選項切換成開啟。
- 設定描述推播通知的內容標題。上的內容是「我應該為 \quot 傳送推播通知,這樣可以嗎?因此,在大聲說出廣告標題時,請確保標題正確且聲音正確。在這個範例中,請將「Content title」(內容標題) 設為
class cancelations
。 - 按一下網頁頂端的 [儲存]。
實作要求
如要在 Webhook 中導入執行要求,請完成下列步驟:
載入依附元件
在
index.js
檔案中,更新 require()
函式,從 actions-on-google
套件新增 UpdatePermission
套件,匯入內容如下所示:
index.js
const {
dialogflow,
Suggestions,
RegisterUpdate,
UpdatePermission,
} = require('actions-on-google');
更新建議方塊
在
index.js
檔案中,將 NOTIFICATIONS
項目新增至建議方塊標題清單,因此您的 Suggestion
定義如下所示:
index.js
// Suggestion chip titles
const Suggestion = {
HOURS: 'Ask about hours',
CLASSES: 'Learn about classes',
DAILY: 'Send daily reminders',
NOTIFICATIONS: 'Get notifications',
};
設定新的匯入作業
如要連線至 Firestore 資料庫,請新增 firebase-admin
套件,並為儲存在資料庫中的欄位新增常數。此外,請匯入 google-auth-library
和 request
套件,以便處理 Actions API 的驗證和要求。
在
index.js
檔案中,將以下內容新增至您的匯入項目:
index.js
// Firebase admin import
const admin = require('firebase-admin');
// Initialize Firestore
admin.initializeApp();
const db = admin.firestore();
// Firestore constants
const FirestoreNames = {
INTENT: 'intent',
USER_ID: 'userId',
USERS: 'users',
};
// Actions API authentication imports
const {auth} = require('google-auth-library');
const request = require('request');
設定課程取消通知的選項
在
index.js
檔案中,替換下列程式碼:
index.js
// Class list intent handler
app.intent('Class List', (conv, {day}) => {
if (!day) {
day = DAYS[new Date().getDay()];
}
const classes =
[...new Set(schedule.days[day].map((d) => `${d.name} at ${d.startTime}`))]
.join(', ');
let classesMessage = `On ${day} we offer the following classes: ${classes}. `;
// If the user started the conversation from the context of a daily update,
// the conv's arguments will contain an 'UPDATES' section.
let engagement = conv.arguments.get('UPDATES');
// Check the conv arguments to tailor the conversation based on the context.
if (engagement) {
classesMessage += `Hope to see you soon at Action Gym!`;
conv.close(classesMessage);
} else {
classesMessage += `Would you like me to send you daily reminders of upcoming classes, or can I help you with anything else?`;
conv.ask(classesMessage);
if (conv.screen) {
conv.ask(new Suggestions([Suggestion.DAILY, Suggestion.HOURS]));
};
};
});
:
index.js
// Class list intent handler
app.intent('Class List', (conv, {day}) => {
if (!day) {
day = DAYS[new Date().getDay()];
}
const classes =
[...new Set(schedule.days[day].map((d) => `${d.name} at ${d.startTime}`))]
.join(', ');
let classesMessage = `On ${day} we offer the following classes: ${classes}. `;
// If the user started the conversation from the context of a daily update,
// the conv's arguments will contain an 'UPDATES' section.
let engagement = conv.arguments.get('UPDATES');
// Check the conv arguments to tailor the conversation based on the context.
if (engagement) {
classesMessage += `Hope to see you soon at Action Gym!`;
conv.close(classesMessage);
} else {
classesMessage += `Would you like to receive daily reminders of upcoming classes, subscribe to notifications about cancelations, or can I help you with anything else?`;
conv.ask(classesMessage);
if (conv.screen) {
conv.ask(new Suggestions([Suggestion.DAILY, Suggestion.NOTIFICATIONS,
Suggestion.HOURS]));
};
};
});
為新的意圖新增執行要求
當使用者表示想要訂閱推播通知時,請致電 UpdatePermission
協助者,要求取得使用者權限。如果成功,PERMISSION
引數就會加到 conv
物件的引數中,方便您用來檢查對話內容。
取得使用者的權限後,請從 conv
物件引數中擷取使用者 ID,並將該 ID 儲存在資料庫中。你稍後會將這個使用者 ID 傳送至 Actions API,以便 Google 助理判斷收到通知的對象。
最後,為輕觸的推播通知新增 Class Canceled
意圖的執行要求。在這個例子中,您的回應是預留位置字串,但在這個動作的正式版本中,您的通知指令碼可以提供關於取消課程的動態資訊。
在
index.js
檔案中,新增下列程式碼:
index.js
// Call the User Information helper for permission to send push notifications
app.intent('Setup Push Notifications', (conv) => {
conv.ask('Update permission for setting up push notifications');
conv.ask(new UpdatePermission({intent: 'Class Canceled'}));
});
// Handle opt-in or rejection of push notifications
app.intent('Confirm Push Notifications', (conv) => {
if (conv.arguments.get('PERMISSION')) {
let userId = conv.arguments.get('UPDATES_USER_ID');
if (!userId) {
userId = conv.request.conversation.conversationId;
}
// Add the current conversation ID and the notification's
// target intent to the Firestore database.
return db.collection(FirestoreNames.USERS)
.add({
[FirestoreNames.INTENT]: 'Class Canceled',
[FirestoreNames.USER_ID]: userId,
})
.then(() => {
conv.ask(`Great, I'll notify you whenever there's a class cancelation. ` +
'Can I help you with anything else?');
});
} else {
conv.ask(`Okay, I won't send you notifications about class cancelations. ` +
'Can I help you with anything else?');
}
if (conv.screen) {
conv.ask(new Suggestions([Suggestion.CLASSES, Suggestion.HOURS]));
}
});
// Intent triggered by tapping the push notification
app.intent('Class Canceled', (conv) => {
conv.ask('Classname at classtime has been canceled.');
});
新增測試通知
如要傳送推播通知給使用者,請將 POST
要求傳送至含有 User-ID、通知標題和目標意圖的 Actions API。在此範例中,觸發測試通知的意圖將透過 Firestore 資料庫疊代,並向所有訂閱通知的使用者發送推播通知。
請注意,在這個例子中,您需要在傳送 Webhook 傳送時傳送推播通知的程式碼,並在對話中叫用測試意圖來觸發該程式碼。在您打算發布的動作中,推播通知程式碼必須和指令碼位於不同的指令碼中。
在
index.js
檔案中,新增下列程式碼:
index.js
// Debug intent to trigger a test push notification
app.intent('Test Notification', (conv) => {
// Use the Actions API to send a Google Assistant push notification.
let client = auth.fromJSON(require('./service-account.json'));
client.scopes = ['https://www.googleapis.com/auth/actions.fulfillment.conversation'];
let notification = {
userNotification: {
title: 'Test Notification from Action Gym',
},
target: {},
};
client.authorize((err, tokens) => {
if (err) {
throw new Error(`Auth error: ${err}`);
}
// Iterate through Firestore and send push notifications to every user
// who's currently opted in to canceled class notifications.
db.collection(FirestoreNames.USERS)
.where(FirestoreNames.INTENT, '==', 'Class Canceled')
.get()
.then((querySnapshot) => {
querySnapshot.forEach((user) => {
notification.target = {
userId: user.get(FirestoreNames.USER_ID),
intent: user.get(FirestoreNames.INTENT),
};
request.post('https://actions.googleapis.com/v2/conversations:send', {
'auth': {
'bearer': tokens.access_token,
},
'json': true,
'body': {'customPushMessage': notification, 'isInSandbox': true},
}, (err, httpResponse, body) => {
if (err) {
throw new Error(`API request error: ${err}`);
}
console.log(`${httpResponse.statusCode}: ` +
`${httpResponse.statusMessage}`);
console.log(JSON.stringify(body));
});
});
})
.catch((error) => {
throw new Error(`Firestore query error: ${error}`);
});
});
conv.ask('A notification has been sent to all subscribed users.');
});
測試推播通知
在終端機中,執行下列指令以將更新後的 Webhook 程式碼部署至 Firebase:
firebase deploy
如要測試動作模擬工具的通知,請按照下列步驟操作:
- 在動作主控台中,前往 [測試] 分頁。
- 在「輸入」欄位中輸入
Talk to my test app
,然後按下 Enter 鍵。 - 輸入
Learn about classes
並按下 Enter 鍵。 - 輸入
Get notifications
並按下 Enter 鍵。 - 如果您尚未請動作來傳送推播通知,請輸入
yes
並按下 Enter 鍵。 - 輸入
yes
並按下 Enter 鍵。您的 Google 帳戶應訂閱此動作的推播通知。
- 輸入
no
並按下 Enter 鍵即可結束。 - 輸入「
Talk to my test app
」並按下 Enter 鍵即可開始新的對話。 - 輸入
Test notification
並按下 Enter 鍵。
幾分鐘內,您應該會收到「Action Gym 測試通知」的「Google 助理」推播通知,只要輕觸這則通知,系統就會將您導向「動作取消」的「意圖」意圖。
5. 建立 Google 助理連結
到目前為止,我們已經討論了您可以導入哪些互動功能,好讓使用者持續回流使用你的動作,但這些功能主要是讓使用者發掘並使用您的動作。
你可以建立 Google 助理連結,將行動裝置使用者直接連結至你的「Google 助理」動作。由於「Google 助理」連結是標準超連結,因此您可以將連結加入網站或任何網路行銷資料 (例如網誌或社群媒體訊息) 中。
在這個步驟中,您將瞭解什麼是 Google 助理連結、如何為您的動作建立連結,以及如何將連結新增至簡易網站以進行測試。
這會如何吸引使用者?
第一次將使用者動作加入您的「動作」可能很困難,尤其是必須明確叫用「Google 助理」的「動作」。Google 助理連結可為使用者提供動作的直接連結,簡化操作程序。使用者在支援 Google 助理的裝置上追蹤 Google 助理連結時,系統會直接將使用者導向你的動作。當使用者在非行動裝置或其他不支援 Google 助理的裝置上開啟連結時,系統仍會將他們導向您的「動作目錄」清單 (如果已發布),因此該連結仍可將您的動作行銷給這些使用者。
「Google 助理」連結是很實用的參與度工具,因此如果您計劃透過網站或社交媒體來宣傳「動作」,建議您建立這類連結。在製作並發布「Google 助理」連結之前,請注意以下幾點:
- 動作發布後,Google 助理連結才會運作。專案處於草稿狀態時,這個連結只會在您的裝置上運作。而其他使用者則會在「動作」目錄中顯示 404 錯誤網頁。
- 您可以讓使用者在發布或測試版環境中發布您的操作後,要求他們先發布「Google 助理」連結。請注意,只有參與 Alpha 或 Beta 版測試的使用者可以測試 Google 助理連結。
- 請確保 Google 助理連結中的目的意圖,讓新使用者留下良好的第一印象。「歡迎」是「Google 助理」連結的預設目的地
開啟 Google 助理連結
請按照下列步驟建立歡迎意圖的 Google 助理連結:
- 在「動作」控制台中,按一下 [開發] 分頁標籤,然後選擇左側導覽列中的 [動作]。
- 按一下「動作」清單下方的 [actions.intent.MAIN]。
- 在「連結」部分底下,將 [您要為這項動作啟用網址] 切換選項。
- 設定描述動作的描述性連結標題。使用簡單好記的名稱,以標題形式來說明使用者能採取的動作。在這個範例中,請將「連結標題」設為
learn about Action Gym
。 - 複製本頁底部的 HTML 程式碼片段,然後儲存起來以供日後使用。
- 按一下網頁頂端的 [儲存]。
部署測試網站
如要測試 Google 助理連結,您可以使用 Firebase 工具,在執行要求中部署測試網站。我們已經為這個範例建立了簡單的測試網站,您只需要新增「Google 助理」連結即可。
前往出貨記錄 (/user-engagement-codelab-nodejs/start/public/
) 並在文字編輯器中開啟 index.html
檔案。
在
index.html
檔案中,將 Google 助理連結的 HTML 程式碼片段貼到內文元素。檔案最終會如下所示:
<body>
<p>
<a href="https://assistant.google.com/services/invoke/uid/000000efb5f2fd97">🅖 Ask my test app to learn about Action Gym
</a>
</p>
</body>
測試 Google 助理連結
在終端機中,執行下列指令以將測試網站部署至 Firebase:
firebase deploy
部署指令執行完成後,請記下輸出內容中的「Hosting URL」(代管網址)。
使用行動裝置上的網路瀏覽器前往這個網址,應該就能在測試網站上看到 Google 助理連結。在行動裝置上按一下這個連結,即可前往「Google 助理」的「動作」功能。
此外,您也可以嘗試透過電腦版瀏覽器前往「代管網址」,系統應該會將你導向「Google 助理目錄」的 404 網頁,這是因為「Google 助理」尚未發布你的動作。
6. 後續步驟
恭喜!
現在,你已經瞭解到開發動作時,使用者參與度的重要性,以及平台上提供哪些使用者互動功能,以及如何在「動作」中新增各項功能。
其他學習資源
請瀏覽下列資源,進一步瞭解使用者與你的動作互動的情形:
- 使用者參與 & Google 助理連結文件:有關 Actions on Google 的官方說明文件,其中說明瞭本程式碼研究室中討論的功能以及一般使用者參與。
- 使用者留存率分析:動作主控台的文件,其中顯示已發布動作的使用者留存率資訊。
- 對話設計指南:設計使用者參與度功能的最佳做法與指南。
- Actions on Google GitHub 存放區:程式碼範例和程式庫。
- r/Google AssistantDev:專為 Google 助理開發人員推出的 Reddit 官方社群。
請在 Twitter 上追蹤我們的動態 @ActionsOnGoogle,隨時掌握最新公告,同時將 Tweet 張貼到 #AoGDevs 來分享您製作的精彩內容!
意見回饋問卷調查
離開前,請填寫這份表單,讓我們瞭解你的使用體驗!