File not uploading using Skydrive file picker javascript api

Question

I'm using Skydrive file picker javascript api to upload files to Skydrive. But as soon as I click on upload button...it opens the login window and closes instantly. Error log shows that WL.login : The pop up is closed without receiving any consent.

I've hosted my web-app on local domain: apidomain and published my files to IIS @ Default Web Site/onedriveapi folder.

Following is the code:
[HTML]

         <button onclick="uploadFile()">Save file</button>
         <label id="info"></label>

[Javascript]

<script src="//js.live.net/v5.0/wl.js" type="text/javascript"></script>

<script type="text/javascript">
           WL.init({
              client_id: "00000000XXXXXXXX",
              redirect_uri: "http://apidomain.com/onedriveapi/default.html",            
              scope: ["wl.signin", "wl.skydrive", "wl.skydrive_update"],
              response_type: "token"
    });

     function uploadFile() {

        WL.login({
            scope: "wl.skydrive_update"
        }).then(
            function (response) {
                alert(response);
                WL.upload({
                    //path: "folder.a6b2a7e8f2515e5e.A6B2A7E8F2515E5E!170",
                    path: "response.data.folders[0].id",
                    element: "file",
                    overwrite: "rename"
                }).then(
                    function (response) {
                        document.getElementById("info").innerText =
                            "File uploaded.";
                    },
                    function (responseFailed) {
                        document.getElementById("info").innerText =
                            "Error uploading file: " + responseFailed.error.message;
                    }
                );
            },
            function (responseFailed) {
                document.getElementById("info").innerText =
                    "Error signing in: " + responseFailed.error.message;
            }
        );
    }

</script>

Redirect_URL in app settings is also same as mentioned above. I've also created callback.html as mentioned in few places, and replaced my redirect_url with

  redirect_uri: "http://apidomain.com/onedriveapi/callback.html",

in page as well as appsettings of https://account.live.com/developers/applications/apisettings.

I also want to save the token received and location of the file uploaded into my db.Please anybody help to fix this issue as I'm struggling with this from last few days.

Thanks

It shows following error in browser console: [WL]WL.login: The popup is closed without receiving consent. — Dipti Sheth, Jan 19 '15 at 09:10
function (responseFailed) : this function shows responseFailed.error.message as 'Error signing in: undefined' — Dipti Sheth, Jan 19 '15 at 09:11
Not sure without complete code. Can you try changing scope in WL.login() ?? reference : http://stackoverflow.com/a/25819574/1210813 — streak, Jan 19 '15 at 09:24
tried above solution...still not working. I've provided you entire code on the default.html page. — Dipti Sheth, Jan 19 '15 at 09:44
you are saying you are not able to reach the login page, right ?? I just copied your code and corrected url and client id. It is sending to signin page correctly. Try to dig documentation more carefully. — streak, Jan 19 '15 at 10:27
also please move this discussion to chat, in case you need any help ? — streak, Jan 19 '15 at 10:32
Thanks...will re-check everything again and let you know..Thanks — Dipti Sheth, Jan 19 '15 at 11:08

streak · Answer 1 · 2015-01-19T11:30:15.810

FYI. This is the screenshot of the html page.

enter image description here

<html>
    <head>
        <script src="http://js.live.net/v5.0/wl.js" type="text/javascript"></script>

        <script type="text/javascript">
                   WL.init({
                      client_id: "################",
                      redirect_uri: "http://yashlocal.com/skydrive/response",            
                      scope: ["wl.signin", "wl.skydrive", "wl.skydrive_update"],
                      response_type: "token"
            });

             function uploadFile() {

                WL.login({
                    scope: "wl.signin"
                }).then(
                    function (response) {
                        alert(response);
                        WL.upload({
                            //path: "folder.a6b2a7e8f2515e5e.A6B2A7E8F2515E5E!170",
                            path: "response.data.folders[0].id",
                            element: "file",
                            overwrite: "rename"
                        }).then(
                            function (response) {
                                document.getElementById("info").innerText =
                                    "File uploaded.";
                            },
                            function (responseFailed) {
                                document.getElementById("info").innerText =
                                    "Error uploading file: " + responseFailed.error.message;
                            }
                        );
                    },
                    function (responseFailed) {
                        document.getElementById("info").innerText =
                            "Error signing in: " + responseFailed.error.message;
                    }
                );
            }

        </script>
    </head>

    <body>
        <button onclick="uploadFile()">Save file</button>
        <label id="info"></label>
    </body>
</html>

If I point redirect_uri to default.html page i.e. page containing above code...login page opens and closes instantly. And if I point it to callback.html which is nothing but an empty page, it opens login window and shows error : We're unable to complete your request Microsoft account is experiencing technical problems. Please try again later. — Dipti Sheth, Jan 19 '15 at 11:23
I can't move to chat section..as it requires at least 20 reputation and I've 8 yet. 2ndly...if possible, can you please send your entire code/solution ..so tht I can figure out what I'm doing wrong in redirect_uri...because...I think it is only creating problem. — Dipti Sheth, Jan 19 '15 at 11:25

File not uploading using Skydrive file picker javascript api

1 Answers1