Posts

第12 屆iT邦幫忙鐵人賽系列文章 (Day16) QnA Maker 是啥 QnA Maker 是微軟提供一個雲端的自然語言處理 (NLP) 處理服務，可輕鬆透過網站後台建立自己的知識庫，並能從使用者所輸入的語句，理解他的意圖，提供可能對應的知識庫答案。QnA Maker提供了免費的方案，但限制就是只能有3份知識庫、每秒只能調用Api 3次，每月50,000筆Request，對於一般使用或技術評估來講很夠用了。要在 Line 串接大概分為以下步驟： 在Azure註冊 QnA Maker 新增一個 knowledge base 增加題目與回答 完成訓練 & 發佈 取得 Endpoint、EndpointKey，來讓程式串接 建立 QnA Maker 照著 https://www.qnamaker.ai/Create Step By Step 步驟，因為QnA Maker是Azure的服務，故您可以需要Azure的訂閱，由此註冊試用 Step 1 在 Azure 新增 QnA Maker 服務 Step 2 選取剛剛建立的QnA Maker服務，並選擇繁體中文 Step 3 knowledge base 名稱 步驟四可以匯入現有的資料集，來源可以是文件或者是線上的網站，這樣就不用重新建檔了，是不是很酷啊 :D Step 4 匯入資料集 (本次先跳過) 開始瘋狂建題目吧！我們來試試建立：“新人怎麼認識的？” 回答我們設定 “我們是在打工餐廳認識的喔，那時的同事 put your hands up ??"，並點選Save And Train...

第12 屆iT邦幫忙鐵人賽系列文章 (Day15) 在上一篇我們介紹如何設定圖文選單，本篇要來介紹如何切換圖文選單，此部分只能用程式來達成，在 Line Business 後台只能設定固定的圖文選單起訖日，有了這功能就可以像網站一樣有網站地圖的概念 今天實作要將 chatbot 隨機切換不同的圖文選單，給使用者不同的體驗，今天的範例圖片在這 https://i.imgur.com/pupYvXr.jpg CreateRichMenuAsync 原本預設的 Rich Menu 是寫在 SetDefaultRichMenuAsync，我們做點重構，讓Rich Menu 的物件是從外部傳入，因為我們現在要設定多個選單 public async Task<Richmenu> CreateRichMenuAsync(CreateRichmenu richmenu) { using (var httpClient = new HttpClient()) { using (var request = new HttpRequestMessage(new HttpMethod("POST"), lineMessageApiBaseUrl)) { request.Headers.TryAddWithoutValidation("Authorization", $"Bearer {accessToken}"); var postJson = JsonConvert.SerializeObject(richmenu, new JsonSerializerSettings { NullValueHandling = NullValueHandling.Ignore, ContractResolver = new DefaultContractResolver { NamingStrategy = new CamelCaseNamingStrategy() } }); request.Content = new StringContent(postJson); request.Content.Headers.ContentType = MediaTypeHeaderValue....

第12 屆iT邦幫忙鐵人賽系列文章 (Day14) 在 Line 的官方帳號可以設定進入時的選單，讓使用者快速點選，設定方式可以從官方帳號後台(有既定的範本可以參考)，或者是用程式自己指定(可以自己控制圖片的座標&設定點選區塊)，以下分別介紹 從官方帳號後台 這應該是最方便的方式了，Line 已經提供了一些範本和設計規範，只要照著範本製作一個圖片，並設定每個區塊要觸發的事件，即可完成一個圖文選單 進入 https://manager.line.biz/ 選擇圖文選單 => 建立 => 設計規範 => 下載範本，(或者直接點此下載)，下載後會是一個壓縮檔，今天來用這個範例做修改 我們用 PhotoShop 改成我們要的圖片 (這就不介紹啦) https://imgur.com/ev4LQzp.jpg 上傳圖片，並設定 A.B.C 所要觸發的文字 這樣就完成了，是不是很方便阿 從程式指定 Rich Menu 程式就沒有用 Business 後台直接上傳圖片來得那麼方便，但程式可以做到極彈性，它可以自訂圖片的座標來設定 click 的範圍，可以針對使用者來動態的切換 Rich Menu 等等…。Rich Menu 所牽扯的 Api 有點多，故先整理今天會實作的 Api 清單如下 Get rich menu list：取得此 chatbot 已註冊的 Rich Menu 清單 Upload rich menu image：設定 Rich Menu 的圖片 Set default rich menu：設定所檢視的 Rich Menu 新增 LineRichMenuUtility.cs 之前 Message API 我們做了 一個 Utility ，Rich Menu 我們也新增一個...

第12 屆iT邦幫忙鐵人賽系列文章 (Day13) Chatbot 有分為兩種類型，一個是任務型導向，另一個是聊天型導向，聊天型導向最典型的就是 Siri，講什麼他都會回答你，這背後所支撐的是海量數據訓練出來的，在我們設計應用 Chatbot 時，多半會偏向任務型導向，使用者用你的 Chatbot 不是要跟你聊天，是要快速的用你這服務達到任務，所以在設計時，如果定位 Chatbot 是 “人” ，是非常可怕的設計，只會降低使用者的觀感。 在設計 Line Chatbot 時，如果使用者在對話過程中迷路了，不妨設計一些快捷鍵引導到他的目標吧，這個在 Line 裡面實作叫 Quick Reply，我們今天將做在無法辨識使用者的意圖時，回傳一些引導的快捷鍵 IntenFactory.cs 之前有設定一個 DefaultIntent.cs 我們將修改這個實作 當聽不懂的時候 回傳三個快捷鍵 public async Task ReplyAsync(string replyToken) { if (!string.IsNullOrEmpty(replyText)) { await lineMessageUtility.ReplyMessageAsync(replyToken, replyText); } else { // 回傳歡迎詞 var unknow = new TextMessage() { Text = $@"不好意思，我不太清楚您的意思，或許你可以用下列快速鍵 (僅支援手機)" }; // Quick Reply unknow.QuickReply = new QuickReply(); unknow.QuickReply.Items.Add(new QuickReplyItem() { action = new MessageAction("電子喜帖"), }); unknow....

第12 屆iT邦幫忙鐵人賽系列文章 (Day12) 這篇要來緩一下，做第一次的重構，寫到現在會發現 LineBotApp.cs 這個 class開始複雜了，程式碼越來越長，在OnMessageAsync.OnPostbackAsync 開始有相同的 Intent 重複定義 我們把取得 Intent 封裝成一個工廠 IIntentFactory.cs 定義一個工廠介面 public interface IIntentFactory { IReplyIntent GetIntent(string intentName, string userId); } IntentFactory.cs 實作這個介面 public class IntentFactory : IIntentFactory { private readonly LineReplyMessageUtility lineMessageUtility; private readonly LineProfileUtility lineProfileUtility; public IntentFactory(LineReplyMessageUtility _lineMessageUtility, LineProfileUtility _lineProfileUtility) { lineMessageUtility = _lineMessageUtility; lineProfileUtility = _lineProfileUtility; } public IReplyIntent GetIntent(string intentName, string userId) { var intents = new Dictionary<string, IReplyIntent>() { { "Welcome" , new Welcome(lineMessageUtility,lineProfileUtility,userId)}, { "電子喜帖" , new WeddingInvitationFromImage(lineMessageUtility,lineProfileUtility)}, { "電子喜帖(FlexMsg)" , new WeddingInvitation(lineMessageUtility,lineProfileUtility)}, { "前導影片" , new WeddingTrailer(lineMessageUtility,lineProfileUtility)}, { "婚宴地點" , new WeddingLocation(lineMessageUtility,lineProfileUtility)}, { "婚紗輪播" , new PhotoCarousel(lineMessageUtility,lineProfileUtility)}, { "交通資訊" , new Directions(lineMessageUtility,lineProfileUtility)}, { "從高鐵" , new DefaultIntent(lineMessageUtility,lineProfileUtility,"至 北門站 搭乘松山新店線至 南京復興站 步行7分鐘")}, { "從捷運" , new DefaultIntent(lineMessageUtility,lineProfileUtility,"捷運台北小巨蛋站6分鐘/南京復興站只需7分鐘")}, { "從機場" , new DefaultIntent(lineMessageUtility,lineProfileUtility,"酒店距離松山國際機場僅 5 分鐘車程")}, { "停車資訊" , new DefaultIntent(lineMessageUtility,lineProfileUtility,"酒店的停車場為室內停車場，位於B5及B6")}, { "開車提醒" , new DefaultIntent(lineMessageUtility,lineProfileUtility,"?...