Search code examples
javascriptonedrivefilepicker

Upload file to default folder using OneDrive File Picker API


Can we upload a file to any default folder, say Documents or Public folder, in OneDrive using OneDrive's JavaScript File Picker API?

i.e. instead of setting path using

WL.upload({                           
    path: response.data.folders[0].id,                          
    element: "file",
    overwrite: "rename"
});

can we set the path value for a default folder like Documents/Public?


Solution

  • Following the steps on https://msdn.microsoft.com/en-us/library/hh550848.aspx will allow you to accomplish this task.

    On the HTML portion of your code, add the and to call the wl.upload function. Below is my code that will allow the use to select the file and upload it to a default folder on OneDrive. In this case, I used "me/skydrive/my_documents"

    <!DOCTYPE html>
    <html>
        <head>
            <title>JavaScript Code Sample</title>
            <script type="text/javascript" src="//js.live.net/v5.0/wl.js"></script>
        </head>
        <body>
    <div style="padding: 1em">
    
    
            <div id="signin"></div>
            <label id="info"></label>
        <form>
        <input id="file" name="file" type="file" />
    </form>
        <button onclick="uploadFile()">Save file directly (calling WL.upload)</button>
            <script>
                WL.init({
                    client_id: 'Your_Client_ID',
                    redirect_uri: 'Your_Redirect_URL',
                    scope: "wl.signin",
                    response_type: "token"
                });
                WL.ui({
                    name: "signin",
                    element: "signin"
                });
                function uploadFile() {
                    WL.login({
                        scope: "wl.skydrive_update"
                    }).then(
                        function (response) {
                            WL.upload({
                                path: "me/skydrive/my_documents",
                                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> 
        </div>
        </body>
    </html>