發表文章

使用C#開發Linebot(27) - 在發送的訊息中加上Quick Reply

圖片
LINE在2018/7月底推出了Quick Reply機制,他可以讓使用者可以更輕鬆的回覆Line bot所發送的問題,官方細節你可以參可底下連結: https://developers.line.me/en/news/2018/07/31 過去,我們要讓用戶回答Line bot的某個問題,除了透過自然語言(讓用戶隨意打)的方式,就是透過 Template Message ,讓line bot跳出一整塊大面積的選單訊息,像是: 但這樣的Tempalte Message佔用了很大一塊版面,每塊卻又只能最多放四個選項,有些時候顯得大而無當。特別是若你其實只是要用戶選擇一個簡單的答案時,根本不需要像上面這樣的Template Message又是大圖又是標題的。 這時,你可以採用底下這樣的QuickReply來解決: Quick Reply 就是上圖Menu上方的小小選項(Action),最多可以出現13個Action,並且支援postback, message, datetime picker, camera, camera roll等各種action。 要實現這樣的功能很簡單,請參考底下這樣的程式碼: 過去我們在發送訊息的時候,也是採用PushMessage,而為了支援QuickReply的功能,我們額外建立了一個TextMessage類別(第2行),你可以直接建立該物件,並指定要顯示的訊息。 接著,透過該物件的quickReply屬性,你可以在items集合中以Add方法加入想要新增的QuickReply item。 在上面例子中,我們新增了三個都是一般的QuickReplyMessageAction,該action的行為如同先前介紹過在TemplateMessage中的MessageAction一般,就是顯示一個標題,執行結果如下: 圖示則是第三個參數 new Uri(…)所指定的,別忘了必須是https並且為.png格式。 如此一來,用戶就可以直接點選上面的『特休』、『事假』、『病假』其中之一。點選時的行為就等同於用戶說了『特休』、『事假』、『病假』這幾個字一般,這就是QuickReplyMessageAction所呈現的功能。 而更精彩的是,除了QuickReplyMessageAction之外,前面提到過,還有可以讓用戶直接選擇時間日期的QuickReplyD...

使用C#開發Linebot(26) - 利用ngrok讓你的Line bot可以使用localhost作為WebHook

圖片
過去,我們大多是建議開發人員直接將asp.net WebApi所撰寫的WebHook佈署到IIS或Azure Web Site站台上去測試,勤快一點寫寫Log和try…catch,大致上基本的除錯也都能處理,但碰到真的需要設定中斷點單步執行或除錯的時候,也只能使用『遠端偵錯』這個殺手鐧了。 但無奈遠端偵錯的速度實在不快,碰到比較複雜的程式碼,跑起來需要不少的初始時間。沒有其他的辦法嗎? 其實是有的,坊間有一個可以把localhost轉成網際網路上特定endpoint的工具,稱為ngrok。 你只要從底下網址下載這個工具即可: https://ngrok.com/download 下載回來解壓縮後,其實只有一個小小的.exe檔案: 它是一個命令列工具,你只需要將你透過Visual Studio開發好的asp.net web API運行起來,然後執行底下這樣的指令: ngrok http 31217 -host-header="localhost:31217" 畫面上會出現類似底下的內容: 這表示,ngrok已經幫你把 http://c5bfcbb9.ngrok.io 這個位址的所有往來封包轉向到你的 localhost:31217 這個位置,如此一來,我們只需要在Line bot後台輸入WebHook的地方,將底下這樣的url作為WebHook位置即可: http://c5bfcbb9.ngrok.io/api/ {你的route} 你會發現,Line bot所接收到的所有訊息,如今會轉傳到你的localhost:31217的應用程式中,你可以大方的在本機電腦上測試WebHook,甚至設置中斷點了。 不錯吧? ngrok是一個好用的測試工具,但如果長時間使用可能不很適合,同時間它也有免費使用的限制,具體的費用可以參考: https://ngrok.com/pricing 但不管如何,它對於我們的Line bot WebHook測試來說,確實提升了不小的便利性,大夥不妨可以試試看。 ----------- 線上課程: https://www.udemy.com/line-bot/ 電子書: http://studyhost.blogspot.tw/2017/12/line-bot.html LineBotSDK: https://www.nuget...

使用C#開發Linebot(25) - 動態 re-issue short-lived channel access token

圖片
這是最近關於Line bot開發人員的一個很重要的議題。 在過去,我們進行Line bot開發的時候,使用到的Channel Access Token大部分都是透過Line的後台所產生的long-lived token。 (大部分? 不是全部嗎? 難道還有其他方法???) 其實是有的,Long-lived token是一個方便的做法,但它是不會過期的,除非你重新issue一個新的Long-lived token。 這雖然方便,但相對不安全。只要知道Token的任何人,都可以透過這個token成為你的bot的控制者,來發送push message訊息。 所以? 因此,LINE預計要在2018/11月終止Long-lived token,相關的公告請參考底下連結: https://developers.line.me/en/news/2018/08/13/ 這意味著,以後你 可能 (細節我還不確定,但LINE應該會有後續的相關公告與說明)就無法使用Long-lived token了。 好,那重點來了,如果不能使用Long-lived token,替代的方式是什麼呢? 是short-lived token,相關資訊可以參考底下連結: https://developers.line.me/en/reference/messaging-api/#issue-channel-access-token 從官方的說明中可以看到 short-lived token是有使用期限的,它只有30天的壽命,且,你最多只能同時擁有30個short-lived token。如果你issue超過30個short-lived token,則前面issue的token將會失效。 如何Issue一個short-lived token呢? 具體做法是透過 http post: 你可以針對 https://api.line.me/v2/oauth/accessToken 送出一個post,並且帶上grant_type, client_id, client_secret這幾個參數。而client_id, client_secret就是你在LINE Messanging API後台中的Channel Id和Channel Secret: 如果你用LineBotSDK則更簡單,只需要透過底下這樣的C#程式碼: 其...

the DevOps journey – 什麼? VSTS支援Public專案了!?

圖片
今天想要建立VSTS專案的時候發現了這個選項: 心想,MS買了Github之後果然霸氣,連VSTS都順便支援Public專案了! 咦?灰色的不能點? 看了說明原來Site Admin得先到Policy這個地方設定為開啟: 設定之後,你就可以建立Public Project了。 從此之後,在VSTS Project中你也可以讓匿名用戶檢視程式碼,commits、分支、pull requests,也可以檢視工作項、Wiki…等資訊… 咦?那我上課share code不就不需要用Github了嗎? (MS真是頗令人費解啊…) 更多資訊在… https://docs.microsoft.com/zh-tw/vsts/organizations/public/about-public-projects?view=vsts https://blogs.msdn.microsoft.com/devops/2018/04/27/vsts-public-projects-limited-preview/ ------------------------------ 本系列文章索引位於 http://studyhost.blogspot.tw/2017/02/the-devops-journey-index.html 相關教育訓練: http://www.studyhost.tw/NewCourses/ALM 若這篇文章對您有所幫助,請點選 這裡 加入FaceBook專頁按讚並追蹤,也歡迎您幫我們分享出去,謝謝您的支持。

使用C#開發Linebot(24) - 建立LINE Liff App

圖片
先前我們介紹過了Liff App這個機制 之後,我們的SDK也跟著進行升級,現在,你可以透過底下這樣的語法輕鬆地建立Liff: 第二行的AddLiffApp這個API,就可以建立一個Liff App,其中的參數ChannelAccessToken不需要解釋,而LiffURL是具體連結到你自己開發的Web應用程式,注意該網址必須是https。 第三個參數是Liff App的高度,你可以透過isRock.LIFF.ViewType來選擇tall, full… 使用前別忘記將LineBotSDK升級到至少 0.7.6-beta2的版本: 上述程式碼執行過後,你會發現line bot顯示了該Liff App的URL: 如果你點選它,會發現果然以指定的方式開啟了該WebApp: 透過這樣的方式你可以輕易地建立一個Liff App,如果要列出所有的Liff App,也可以透過底下這樣的Method: 其中foreach所列出的是登記在該ChannelAccessToken名下的所有Liff Apps,呈現結果如下: 建立與列出Liff App的範例程式碼在 https://github.com/isdaviddong/CreateAndListLiffApp   have fun~ ----------- 線上課程: https://www.udemy.com/line-bot/ 電子書: http://studyhost.blogspot.tw/2017/12/line-bot.html LineBotSDK: https://www.nuget.org/packages/LineBotSDK 如果需要即時取得更多相關訊息,可按 這裡 加入FB專頁。若這篇文章對您有所幫助,請幫我們分享出去,謝謝您的支持。

幫你的Teams加上一隻對談機器人(Teams Chat Bot)

圖片
前幾天我們介紹過了 如何申請免費 的Teams,但你知道嗎? 免費的Teams 其實也可以擁有對談機器人喔。只需要三分鐘就可以搞定… 上圖就是我們跟這個剛用三分鐘做好的機器人對談的畫面。 他現在只會Echo,啥都不會,但你幾乎不用寫任何程式碼就可以完成,這樣的對談機器人有何用途呢? 用途大了,未來只需要稍加擴充,他就可以成為您在組織或企業內的小幫手,小從幫你查詢某人的分機、或是查詢你的今年度請假時數,大到自動幫你跑流程建立訂單或其他申請單,都是可以輕易實現的。 我們先來看如何建立一支這樣的bot。 使用bot service 要建立一支bot,你可以透過微軟Azure上的bot Service,建立時,目前有三種可以選擇: 請選擇最簡單的Web App bot,然後在出現的畫面中逐一填入相關資訊: 上圖1的機器人名稱當然就填寫你想要的名稱,而2,3,5預設會用同樣的名稱,我會建議你別改,且最好建立一個獨立的資源群組,這樣比較好管理。因為這個Web App Bot,會一口氣幫你建立Web App、Azure Storage、然後又可能有App Service Plan,如果你沒把所有東西放在一個獨立的資源群組裡,未來刪除的時候可能會漏東漏西。 上圖4程式碼的部分我們選擇C#,6的部分我們選擇自動建立。 按下『建立』鈕會跑一陣子,完成後,會出現類似底下這樣的畫面(如果沒有,請自行搜尋到該服務): 接著,請點選『頻道』,我們要讓這個bot可以被加入Teams中,請在頻道中把teams家進去,完成後類似底下這樣: 其實這樣該bot已經可以在Teams中使用了,但先別急,我們來看看這個bot目前是怎麼被設計的: 請在選單『組建』當中,找到開啟『線上代碼編輯器』: 點選後會出現底下這個Web畫面,基本上你可以在這個畫面中改你這隻Bot的程式碼,我們找到EchoDialog.cs: 然後把程式碼稍微改一下變成上面這樣: 完成後,請點選左側選單中的Open Console,然後下指令 build.cmd : 完成後,你修改的程式碼就生效了!!!!! 這時候先別急,我們回到azure管理站台,找到MS App Id,這個ID很重要,是我們待會測試bot所需的關鍵資訊: 找到之後,來到您的teams畫面,請在聊天選單中,點選下圖像是筆的那個圖示,在出現的『收件者』欄位中,輸入剛才你看到...

開放申請免費的Teams帳戶

圖片
既然微軟都免費提供Teams給大家用了,我們再客氣就有點顯得作做了,直接申請吧。 建議你先準備好Microsoft Account,也就是一般熟悉的Hotmail.com, Outlook.com之類的帳號。如果沒有,你可以從 這邊 申請一個。 其實從底下的申請頁面,你用哪一種帳號都可以,即使你用gmail他都會引導你去建立一個Microsoft Account,只是,為了避免你日後自己搞混帳號,建議你用一個已經申請好的Microsoft Account比較容易區隔。 直接到底下網址:  https://products.office.com/zh-tw/microsoft-teams/free 進入後會看到底下畫面: 填入你的帳號後,按下免費註冊鈕。 接著會出現: 按下設定帳戶後,會出現登入畫面: 正確的輸入密碼之後,就可以繼續申請步驟了: 你無須勾選底下幾個checkbox,上面的個人資料依照真實狀況填寫即可。接著系統會跑一下設定帳號: 完成後會出現底下畫面,不用猶豫,按下開始使用: 接著會進入系統,這時你會發現如果用Windows環境的話,它會叫你下載App,如果暫時不想下載也行,可以直接用Web模式亦可: 第一次進入,系統會讓你設定自己的顯示名稱: 接著你可以邀請你的同事或團隊進入Teams: 就這樣,你就有自己的teams站台了: 在Teams中做的事情非常多,從小組線上討論、視訊會議、檔案分享、行事曆、工作項目管理、以及外部系統(像是Trello、Evernote、Zendesk、Office…)的整合,且同時支援Android與iOS的手機和平板,你可以迅速讓整個團隊有一個共享的看板及線上工作區。 聽說這次大手筆開放了… - 人數上限 300 - 無限訊息記錄搜尋 (Slack 1 萬) - 10GB 團隊及 2GB 個人容量 (Slack 5GB) - 整合O365線上應用程式如Word、Excel...等 - 視訊與通話可多人 (Slack 限一對一) - 140 個第三方串接上限 (Slack 10 個) 看起來頗有搞頭,後續有機會再跟大家介紹一下怎麼使用teams囉。

為QnA Service的Knowledge Base加上共同管理者

圖片
QnA Maker正式版(GA)之後,在建立與權限維護上改變了不少,總的來說,就是改以Azure作為管理的核心,因此你會發現,你不再能夠直接從QnA Maker的管理站台( https://www.qnamaker.ai )去設定共同管理者,取而代之的,你必須從Azure Portal來設定。 當你要為某一個共同管理者設定權限時,你必須先在Azure Portal找到該QnA Maker的Cognitive Services服務,然後選取存取控制(IAM): 接著點選『新增』來加入新的用戶,並且在角色選擇『參與者』,在底下的『選取』文字方塊中直接輸入其 Microsoft Account,然後將其加入即可。 但請留意,這不會立刻生效,被加入的用戶會先收到一封mail,被邀請加入該目錄(Directory),收到Mail後該用戶要底選Get Started: 這會讓該用戶加入此目錄,然後才能夠存取該服務。 同樣的,這個作法也會讓該用戶在QnA Maker的管理站台( https://www.qnamaker.ai )中可以自由建立新的Knowledge Base,而帳就會算在你剛才授權的那個QnA Service與其所屬的訂閱(Azure Subscription)頭上: 此外該用戶也會被加入所屬的Azure AAD目錄中,如果要移除權限的時候也別忘記了唷。

建立QnA Maker時的小陷阱

圖片
先前介紹過,可以輕鬆實現自然語言客服的 QnA Maker 已經正式GA,因此,建立該服務需要到Azure站台上。我們知道Azure站台上的服務都有免費的選項可以用,QnA也不例外,因此你建立QnA Maker時候,可以很大膽的選擇底下的F0方案,而底下的Search Pricing tier也可以選擇F方案,大多Azure上免費的方案都是F開頭: 這樣就高枕無憂了嗎? 理論上是的,但有學員反應他的Azure被收了大錢,Why?不是F嗎? ㄟ…部分是的。 請看上圖的英文字部分,QnA Maker需要一個Azure Web Site,而建立QnA Maker時候,系統預設幫你開了一個S1(Standard)等級的Web Site,這S1等級的web App可是2000多台幣每個月啊… 這故事告訴我們,千萬別忽略網頁上不起眼的訊息,特別是英文的。 如何解決呢? 請找出該自動建立的WebApp(你設定他名字的,所以你應該找的到),將其改為(降級)為F1或D1即可:

開發Linebot(23) - LINE LIFF App初嘗試

圖片
先前 我們介紹過了LINE LIFF App,你大概已經知道了它是一個便於開發類似  FB WebView或是微信小程序的機制。 LINE推出了這個機制是一個很重要的更新,這一篇我們要來看看如何撰寫一個LIFF App。 在這之前你必須知道: LIFF App可以使用HTML和javascript撰寫 最好是寫成RWD網頁,這樣崁入在LINE裡面看起來比較順眼 你可以透過js API做底下這些事情,諸如: 取得用戶User id 取得用戶身分資訊 以用戶的身分發送訊息給Line bot … 此外,你可以透過底下幾種方式喚起LIFF App 送出一個網址(類似 line://app/1111111111-OxoxoxoxOx ) 讓用戶點 在Rich Menu當中做一個Url Button讓用戶點 我們在 上一篇 介紹過如何建立與在LINE bot中整合LINE LIFF,這篇來介紹撰寫LIFF的時候可以有哪些基本功能。 從下圖中你可以看到,我們在Rich Menu中建立了兩種按鈕,一個直接開啟url的button,一個是顯示文字(該url)的Button,這兩種方式都可以讓用戶觸發開啟LIFF。 用戶可以從Ruch Menu喚出LIFF App: 此外,不管是LINE bot說出這個網址,或是用戶自己說出這個網址,只要有LIFF的url,用戶就可以點,點了就可以開啟LIFF。我們再看底下這個有趣的例子: 請特別注意一個有趣的地方,LIFF的url長像是 line://app/1111111111-OxoxoxoxOx  這樣,但你居然可以在該url後面加上 QueryString,像是: line://app/1111111111-OxoxoxoxOx?a=123 它會自動pass給你的網站,例如你看到上面的 a=123在我們進入WebApp中,可以透過抓取QueryString的方式抓到參數,並顯示到TextBox中(執行結果在上圖): 這個機制有助於我們只需要撰寫單一一個LIFF,就可以依照不同的用戶或需求(以QueryString區分),執行不同的功能。 此外,在LIFF中抓取User Id也是基本功能。 底下的程式碼在document ready之後,透過liff.init(…)初始化LIFF,在傳回來的data.context中,就包含了...