.NET Walker

最近由於一些因緣際會，又得回頭寫一點asp.net WebForm相關的東西，但，時代在這5年中實在有了不少的改變，因此一些過去的做法，最近有了不同的實作方式，其實我也是久久沒用怕忘記，紀錄一下。 我們最近碰到一個需求，非常單純，就是希望在網頁上用非同步的方式上傳檔案。 這需求沒啥好說嘴的，對吧。 但環境是這樣的，我們用的開發工具是asp.net WebForm，頁面需要盡可能保持單純，因為我自己不喜歡任何從伺服器端render html到前端的解決方案，因此一開始就盡可能的少用 web control之類的東西。由於現在有jQuery可用，瀏覽器的支援也比當年好了不知多少倍，因此，asp.net AJAX那種龐然大物自然也被排除在選用範圍之外。 為何不用asp.net MVC? 一則因為網站必須和過去開發環境(人員)相容，另外asp.net MVC中的Razor view也會從伺服器端render html到前端，route的對應方式和過去webForm的路徑作法不同，在一個專案裡面同時出現實在太不直覺，因此也不在考慮範圍內。 但專案中我們會用asp.net WebApi，如果需要的話(這表示我們不用Web/WCF Services了)。 簡單的說，就是這雖然用asp.net WebForm技術，但頁面前端盡可能的只有 html 與 js，而後端用C#，盡量不用任何WebControls。OK，背景交代完畢。 怎麼實現，先看前端要怎麼上傳檔案，很簡單，放一個file upload，和一個上傳button，寫一點js做非同步上傳用: 我覺得大部分的程式碼都不需要解釋，留意31行body之後，雖然該頁面是asp.net webform，但除了預設的form tag之外，其他的control我們都是用html而非asp.net web controls，在button click時候，我們呼叫第6行的UploadFileAsync，裡面透過很標準的post方法把用戶選擇的檔案上傳。 就這樣。 那伺服器端怎麼接這個檔案呢? 也容易: 就上面這區區幾行… ㄟ…我承認，放在Page_Load裡面看起來有點low，但，這是最簡單單純的做法了，整個過程中不需要使用任何第三方套件或工具，頁面也盡可能保持乾淨。 結案，收工。 喔，程式碼在 https://g

讓你的電腦說話早已經不是新鮮事了，早期WP7.x的時代，我們就寫過程式碼讓手機說話，適當的採用語音輸出，對於用戶來說也是個不錯的互動體驗。 透過Cognitive Services中的Speech API讓電腦說話，用起來也相當簡單，它可以直接在雲端為你產生你指定的語音，並且將語音檔案binary傳回用戶端。 整體來說，使用該API的方式可參考底下: Bing Text To Speech API 同樣的，使用時你會用到一組Key，這個Key與先前我們做 語音辨識 的時候使用的Key相同。呼叫 API前，我們需要先透過這組Key取得一個token (底下是postman呼叫畫面): 取得Token時，請用POST呼叫底下URL : https://oxford-speech.cloudapp.net/token/issueToken 傳入的body是 : grant_type=client_credentials&client_id=< Your subscription key >&client_secret=< Your subscription key > &scope=https://speech.platform.bing.com 其中的 Your subscription key 是我們前面說到的 key。 取得後的token應該是類似上圖中一長串的文數字。 接著，請組出底下這樣的XML，這組XML是用來告知Speech API我們要取得什麼語音: <speak version="1.0" xmlns=" http://www.w3.org/2001/10/synthesis" xmlns:mstts=" http://www.w3.org/2001/mstts" xml:lang="zh-TW"> <voice name="Microsoft Server Speech Text to Speech Voice (zh-TW, Yating, Apollo)"> 哈囉，今天天氣不錯啊 </voice> </speak> 這組XML是以body

好不容易透過bot framework建立好了一個bot，要讓用戶和我們的bot chatting，最簡單的方式當然就是透過內建的Web Chat。 你會發現，在後台的管理畫面上，有一個內建的Weh Chat: 要啟動該Web Chat，只需要點選上圖中的Edit，並且產生一個secret key即可: 有了這組secret key，你可以直接透過底下這樣的網址，讓不特定用戶來與你建立好的bot聊天: https://webchat.botframework.com/embed/test20160826?s=x4fT4xmsjNw.cwA.lLc.MfO35JmnXsxKxihkLaMptAlwTqGwOJFP1kLim174nFh8 畫面大致如下，這個Web Chat UI除了可以文字聊天，還可以上傳圖片，其實蠻好用的: 但問題來了，文件上開宗明義地就說，這組secret如果洩漏出去了，那任何人都可以用iframe指令把你的bot embbed在他們家的網頁裡，這或許你不在意，但還有另一個問題。每一個得知這樣的網址連進來的用戶，對談時都是以匿名的方式進來的，如果將來要查詢聊天紀錄，很不方便。 那麼除了用Skype或是FB Messanger來串這個bot，有沒有什麼方式可以解決這個問題呢? 有的，而且還一石二鳥。 首先，你確實不應該用後台產生的這組secret key作為使用WebChat UI的參數，而是該改用一個token。本來的WebChat網址 https://webchat.botframework.com/embed/botName?s=x4fT4xmsjNw.cwA.lLc.MfO35JmnXsxKxihkLaMptAlwTqGwOJFP1kLim174nFh8 應該改為 https://webchat.botframework.com/embed/botName?t=token 這樣的型式。 那這token怎麼來呢，你可以透過底下這個API取得: https://webchat.botframework.com/api/conversations 當你用POST呼叫上面這組API，在headers中傳入Authorization(value是BotConnector 加上你的secret