2018年7月13日 星期五

開放申請免費的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囉。

2018年7月11日 星期三

為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即可:

2018年6月13日 星期三

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

先前我們介紹過了LINE LIFF App,你大概已經知道了它是一個便於開發類似  FB WebView或是微信小程序的機制。

LINE推出了這個機制是一個很重要的更新,這一篇我們要來看看如何撰寫一個LIFF App。

在這之前你必須知道:

  1. LIFF App可以使用HTML和javascript撰寫
  2. 最好是寫成RWD網頁,這樣崁入在LINE裡面看起來比較順眼
  3. 你可以透過js API做底下這些事情,諸如:
    1. 取得用戶User id
    2. 取得用戶身分資訊
    3. 以用戶的身分發送訊息給Line bot
  4. 此外,你可以透過底下幾種方式喚起LIFF App
    1. 送出一個網址(類似 line://app/1111111111-OxoxoxoxOx ) 讓用戶點
    2. 在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中,就包含了UserId:


除此之外,我們也可以透過js很輕鬆的取得User Profile:

抓取profile.displayName之後顯示在textbox中,如下圖:

有趣的是居然可以用alert(…)是出乎我意料之外的。

你也可以在LIFF中,透過SendMessages以用戶身分傳送訊息給Line Bot:

執行結果如下:

你會發現透過js可以幫用戶傳送訊息(其實不只文字,貼圖、圖片、或其他訊息當然也行),到對談視窗中。

這些功能雖然基本,但已經可以完成不少行動裝置上的應用了。

整個頁面都是透過pure html和js撰寫,完整的程式碼可以參考:
https://github.com/isdaviddong/testLIFF/blob/master/WebApplication3/default.html

注意,其中用到了LIFF的sdk.js:

把該頁面佈署到支援https的站台,然後透過先前介紹過的方式,把網址註冊到你的Line bot中,就成為一個LIFF App了。

如果你懶的寫html和js想測試一下,你可以試試看直接註冊底下這個我寫好的測試LIFF App,網址如下(但隨時可能會刪除唷,僅供測試):
https://testliff.azurewebsites.net/default.html 
只需要透過先前介紹過的方式註冊到你的Line bot上即可。

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專頁。若這篇文章對您有所幫助,請幫我們分享出去,謝謝您的支持。

2018年6月11日 星期一

在Node.js中使用LUIS

我們沒事好好的幹嘛去弄Node.js呢? 還會為了誰? 當然就是LUIS。

還記得它吧,我們在很多地方介紹過LUIS,因為它是我們玩chatbot時候做自然語言語意分析(NLP)的要角,如果你忘記了,可以參考…

使用LUIS,讓你的bot理解用戶輸入文字的意義
建立LUIS服務處裡自然語言辨識
使用C#開發Linebot(20) - 不寫一行code完成Linebot的LUIS串接

OK,chat bot寫著寫著,開始有各種不同語言的需求,所以Node.js中使用LUIS也是剛好而已。(後面還有Python在等著)

前面我們介紹過如何使用VS Code開發Node.js,其實重點是為了這一篇如何在node.js中呼叫LUIS服務,其實也很簡單,我們可以參考這篇裡面的程式碼:

我稍微改了一下,主要是LUIS的app id與Key要換成你自己的(原本程式碼裡面採用.env環境變數,為了說明方便,這邊就先寫死了):

上圖中的App id和Key我換成了一個我訓練好的點餐服務LUIS App,所以我把 q 打成『我要大亨堡』,別忘了,這段程式碼要能運行,你還得用npm裝幾個套件:

完成後,試著按下F5在VS Code中執行app.js,結果如下:

成功的呼叫LUIS服務取得最可能的Intent囉…

2018年6月10日 星期日

使用VS Code開發Node.js

最近由於在AI課程中有愈來愈需要支援(不是系統,是我)其他語言的趨勢,因此VS Code在毫無疑義的狀況下,成為.net環境以外的開發工具。

所以,相關的筆記,也稍微整理一下,以備不時之需。這一篇,就是。

其實要用VS Code開發Node.js超簡單,從一台空的PC開始。

  1. https://code.visualstudio.com/下載安裝好VS Code
  2. 習慣性的順便安裝 Git 反正早晚會用到 https://git-scm.com/downloads
  3. 然後從這邊 https://nodejs.org/en/download/ 安裝 Node.js ,我選 .msi 64-bit,他會順便裝npm(it’s package manager for JavaScript),以後會常用。

裝完之後可以參考 https://code.visualstudio.com/docs/nodejs/nodejs-tutorial 開始你的第一支Node.js,用慣VS的人可能會覺得底下這樣很妙,你要建立一個node.js專案,可以在cmd line先建立一個空的folder:

然後下『code  .   』這個指令。

啥意思,就是在目前的目錄下開啟VS Code,出現後,在資料夾底下建立一個 app.js:

然後輸入畫面上這樣的code。

var msg = 'Hello World';
console.log(msg);

如果沒問題,按下F5試試看:

出現執行結果了,其實還挺方便的。有沒有原始一點的執行方式? 當然有:

回到cmd line底下,執行node app.js,也可以得到一樣的結果。

使用express

寫node.js當然要做Web App,所以,立馬安裝一下 express

安裝完成之後,執行 express expAp:
(其中的expAp是你想建立的資料夾名稱)

接著使用npm install安裝相關套件後,以npm start開啟Node.js web server:

成功執行的話,你就可以在 localhost:3000 找到你的node.js頁面囉。

VS Code的字體大小

身為.net developer,這年頭是什麼code都得要會寫的年代。

而雖然我的NB還沒從Windows淪陷為Mac OS,但寫Node.js和Python免不了要用VS Code,這是一種愛的表現。

但歲月不饒人,盡管微臣非常熱於配合,但VS Code預設字體的大小在我還沒錢買大尺寸螢幕的狀況下,實在讓老臣難以適應。當下的第一個反應是什麼?

當然是 Ctrl+滑鼠滾輪往上推…哇靠,沒用。看…這設計…恩,千錯萬錯一定是我的錯。

只好從選單 file –> Preferences –> Settings:

在出來的視窗中,你可以看到 editor.fontsize:

沒錯,改它就行了。改不動? 喔,不好意思,我沒仔細看說明,要copy到右邊是吧,沒問題,copy->paste->modify->Save…搞定。

好簡單啊…連ctrl+(mouse scroll up)都用不到了呢…

咦?這是一篇抱怨文嗎?
沒有,誰說的? 免費的tool我們還有什麼好抱怨的呢…要感恩啦。

啊….對了,如果你還是堅持要使用 Ctrl+滑鼠滾輪,請找關鍵字…

"editor.mouseWheelZoom" Smile

Related Posts Plugin for WordPress, Blogger...

熱門文章