How to create a Blob object from image url? RRS feed

  • Question

  • I am using Winjs(javascript for windows 8 app). what i want is to create a simmple blob object from a specific url of my static image by giving the path . what is the solution?

    Any help will be appreciated.

    Tuesday, April 9, 2013 2:16 PM


  • You'll need to first get a StorageFile for the image, using Windows.Storage.StorageFile.getFileFromApplicationUriAsync or Windows.Storage.StorageFile.getFileFromPathAsync. Both of these are static methods in the namespace so you just call them directly with the fully qualified name.

    Then pass the StorageFile object to MSApp.createFileFromStorageFile, the result of which is an W3C/HTML5 File object, which is also a blob. (The documentation has this backwards, by the way, as it suggests that the function converts a W3C File object into a StorageFile, but it's the other way around.

    Here's a code snippet that loads up an image in the app package:

    var uri = new Windows.Foundation.Uri("ms-appx:///images/splashscreen.png");
    Windows.Storage.StorageFile.getFileFromApplicationUriAsync(uri).done(function (file) {
        var blob = MSApp.createFileFromStorageFile(file);
        console.log("Blob type = " + blob.type + ", size = " + blob.size);


    Author, Programming Windows 8 Apps with HTML, CSS, and JavaScript, a free ebook from Microsoft Press

    Tuesday, April 9, 2013 4:47 PM