Downloading and uploading files (Windows Runtime apps using JavaScript and HTML)

Article
04/13/2015

Allow users to download and upload files on Microsoft OneDrive, from your Windows Runtime app using JavaScript and HTML.

In this article
Prerequisites
Download a file
Upload a file
Update a file
Summary

Prerequisites

We assume that the user has already signed in and consented to the wl.skydrive scope for reading file or folder properties. If you have not added user sign-in to your Windows Runtime apps, see Signing users in.

Download a file

To get the contents of a file, photo, video, or audio file, use code like you see in these steps. The wl.skydrive scope is required. You must ensure that the user has consented to the required scope; for details, see the first step under Upload a file.

Download files. After the user has granted permission to access his or her OneDrive, create a download function and, in that function, call the WL.createBackgroundDownload function to start a download operation.

function download()
{
        ...
    WL.createBackgroundDownload({
        path: fileID + "/content"
    }).then(
        function (result) {
            var op = result;
            return op.start();
        },
        function (result) {
            showError(result);
        }
    ).then(
        function (result) {
            showSuccess(result);
        },
        function (result) {
            showError(result);
        },
        function (result) {
            showProgress(result);
        });
    ...
}

Handle pending downloads when the app restarts. Call the WL.getCurrentBackgroundDownloads to get a list of pending downloads, and attach the current download to the list.

When the app starts, the WL.getCurrentBackgroundDownloads function checks for and receives pending downloads. Call attach() to receive the result for each pending download. This step is necessary in case the app is terminated before the downloads are complete. If the app does not receive the result for a download, that download remains in the background service.
```
WL.getCurrentBackgroundDownloads().then(
    function (result) {
        for (var op in result) {
            op.attach().then(
                function (result) {
                    showSuccess(result);
                },
                function (result) {
                    showError(result);
                },
                function (result) {
                    showProgress(result);
                }
            );
        }
    }); 
```

Upload a file

To upload a file, photo, video, or audio file, use code like what you see in these steps. You can upload file sizes up to 100 megabytes.

Note

Before uploading a file, have your app check that there is enough available OneDrive storage space by making a WL.apiGET method call to USER_ID/skydrive/quota. For example, your app could get the size of the file in bytes and then compare it to the number of available storage bytes returned in the OneDrive quota call. For more info, see the Get a user's total and remaining OneDrive storage quota section in File and folder properties on OneDrive (REST) .

Make sure that the user has consented to the required scope. The runUpload function implements the flow to ensure that the user has consented to the wl.skydrive_update scope before it invokes upload calls.

function runUpload() {
    WL.login({
        scope: ["wl.skydrive_update"]
    }).then(
        upload,
        function(loginResult)                
        {
            show("consent failure", loginResult);
        });
}

Upload files. After the user has granted permission to access his or her OneDrive, create and start an upload by calling the WL.createBackgroundUpload function. This example calls the WL.createBackgroundUpload function with the destination path, file data, file name, and whether or not to overwrite a file, if a file of the same name already exists.

function upload()
{
    ...
    WL.createBackgroundUpload({
        path: uploadFolderPath,
        stream_input: stream,
        file_name: fileName,
        overwrite: true
        }).then(
            function (result) {
                var op = result;
                return op.start();                              
            },
            function (result) {
                showError(result);
            }
        ).then(
            function (result) {
                showSuccess(result);
            },
            function (result) {
                showError(result);
            },
            function (progress) {
                showProgress(progress);
            });
    ...
}

Handle pending uploads when the app restarts. When the app starts, call the WL.getCurrentBackgroundUploads function to check for and receive pending uploads, and then call attach() to receive the result for each upload. This step is necessary in case the app is terminated before the uploads are complete. If the app does not receive the result for an upload, that upload remains in the background service.

WL.getCurrentBackgroundUploads().then(
    function (result) {
        for (var op in result) {
            op.attach().then(
                function (result) {
                    showSuccess(result);
                },
                function (result) {
                    showError(result);
                },
                function (result) {
                    showProgress(result);
                });
        });

Update a file

To change the contents of an existing file, photo, video, or audio, use the code in Upload a file but set the overwrite parameter to true on the call to WL.createBackgroundUpload.

Summary

In this tutorial, you learned how to download and upload files to OneDrive. Next, we suggest you read Move, copy, create, or delete a file or folder to continue your learning.

Share via