POC-實作Web與Window應用程式互動

  今天同事提到Spotify，有個很酷的登入功能，在桌面應用程式登入後，再到網頁作登入的動作，會自動登入。登出，再登入，也都不用輸入帳號密碼。但若桌面程式關閉後，Web要登入就要輸入帳密。
  雖不知它實作的機制是如何，但停不住好奇心的我們，花了些時間朝著Web與Window互動的方法去尋找類似的作法。找了幾篇後，在CodeProject剛好有篇文章，介紹到使用 HttpListener讓Desktop與Browser溝通，在瞭解相關作法後，實作了一個類似的Spotify的登入機制。
  如下示意圖，使用者電腦的Desktop應用程式，使用HttpListener在本機Host一個port為60999。瀏覽器透過對localhost:60999Request，會取到目前的登入者作登入。

實作Web自動登入

1.撰寫要求登入的Listener

• 依傳入的urlPrefix作監聽(例:localhost:60099/)
• MainWindow.CurrentAccount 取得目前的登入帳號(在MainWindow.cs 會實作)，寫入response
• Header加入Access-Control-Allow-Origin，避免cross-site 無法存取

2.撰寫Desktop 登入程式


登入後，開始HttpLoginListener的監聽

3.撰寫Browser自動登入

• 透過jQuery ajax 向localhost:60999發出request，此時Desktop的HttpLoginListener會收到通知，並回傳目前的Account。
• success callback收到資訊後，顯示Account。ps:這裡可以處理自動登入

測試程式

1.執行DesktopApp登入



2.瀏覽HttpLogin.html，按"Login”取得DesktopApp的登入資訊



範例程式下載

參考來源

http://www.codeproject.com/Articles/36517/Communicating-from-the-Browser-to-a-Desktop-Applic
https://msdn.microsoft.com/zh-tw/library/system.net.httplistener.begingetcontext(v=vs.110).aspx