本篇簡單介紹所需之東西及基本操作，其主旨為整合SkyDrive至自我的站台，可以讓使用者一鍵登入並插入所想要的檔案資料。

1.先去live dev申請APP的拿到其Client_id&登入使用APP的網域

點我註冊

2.由於都是使用JavaScript做處理所以就直接開專案吧

  • 先開一個Callback.html的頁面
  • 在裡面加入 
     1: <head>
     2:     <title></title>
     3:     <script src="http://js.live.net/v5.0/wl.js" type="text/javascript"></script>        
     4: </head>

 

3.接下來參考MS提供的API互動的網頁查詢你要的功能(點我)

我是參考黑暗大的文章(點我)和上述這頁整理出來的

說明一下，關於AutoLogin顯示問題

經惡搞及通靈過後得知

當出現 [WL]WL.login: The 'wl_auth' cookie is not valid.這個JS錯誤時

請勇敢的註解掉

 1: WL.init({
 2:     client_id: "00000000440C5C96 ",
 3:     redirect_uri: "http://test.crm945.com/Contacts/DetailView/callback.html",
 4:     scope: ["wl.signin", "wl.basic", "wl.skydrive"]
 5:     //response_type: "code"
 6: });

原因不明，不過真的就這樣可以了...查了半天也沒寫為什麼，就對照API網站以後忽然想說註解掉會怎樣就給他下去了!!!

4.再來簡單說明我的Code

 1: <script type="text/javascript">
 2:         $(function () {
 3:             $('#logout').hide();
 4:             WL.Event.subscribe("auth.login", function () {
 5:                 var session = WL.getSession();
 6:                 if (session.error)
 7:                     alert("Error:" + session.error);
 8:                 else {
 9:                     var token = session != null ? session.access_token : null;
 10:                     if (token != null) {
 11:                         var url = "https://apis.live.net/v5.0/me/picture?access_token="
 12:                     + escape(token);
 13:                         WL.api({ path: "me", method: "get" }, function (response) {
 14:                             if (!response.error) {
 15:                                 $("#meName").html(response.name);
 16:                             }
 17:                         });
 18:                         //取得SkyDrive Id，透過AJAX History方式觸發瀏覽
 19:                         $.bbq.pushState({ f: "" });
 20:                         WL.api({
 21:                             path: "me/skydrive"
 22:                         }, function (prop) {
 23:                             $.bbq.pushState({ f: prop.id });
 24:                         });
 25:  
 26:                     }
 27:                 }
 28:             });
 29:             WL.Event.subscribe("auth.logout", function () {
 30:                 $("#meImg,#meName").html("");
 31:             });
 32:             WL.init({
 33:                 client_id: "00000000440C5C96",    //Client_id
 34:                 redirect_uri: "Your Callback page",
 35:                 scope: ["wl.signin", "wl.basic", "wl.skydrive"]    //你要要求的APP權限
 36:                 //response_type: "code"
 37:             });
 38:         });
 39:  
 40:         function logout() {                    
 41:             WL.logout();
 42:         }
 43:  
 44:         function login() {
 45:             WL.login();
 46:         }
 47:     </script>

因為Auto登入的那個不符合我要的需求，而且很容易卡彈無法登出，所以這邊我走了不一樣的做法走了手動登入&登出的做法。

處理顯示的做法就參考黑暗大的做法就可以了，再依據自己的需求修改成自我想要的模式。

 

後記....真的到現在用起來還是有時候會有點卡彈!!!原因不明...

可是這段又不是偶負責的0.0

MS真的還是個迷阿!!!

 

20120702 補充 :

MS的連結採用動態連結，所以如果使用此功能是用來作為永久使用，則請勿採用這種方法，測試過Google Drive一樣，請採用Dropbox!!!

arrow
arrow
    文章標籤
    skydrive Asp .net
    全站熱搜

    balance 發表在 痞客邦 留言(0) 人氣()

    E-mail轉寄