WinJS loading local json file

Question

I am banging my head on this one.

I cannot find a way to open a simple json file from a subfolder in my WinJS App.

I have tried Ajax and WinJS.xhr, both to no avail.

I have also looked into opening the file the "old fashioned" way with something like File.Open in .NET, but I couldn't find anything besides WinJS.Application.local.readText, which I tried with both an absolute and a relative path.

I'm at the end of my rope here, does anyone have a working snippet that you can share?

Bedroom

Answer 1

You can refer to files in the app package using URLs in the form:

ms-appx:///data/data.json

(Notice that there are three / characters - if you miss the third one out, you'll have problems)

To read and parse a file that contains a JSON object, you can use the objects in the Windows.Storage namespace. There are three steps - to get a StorageFile object that points to the file, read the contents of the file and then parse the JSON data. Here is the code that I used to do this:

var url = new Windows.Foundation.Uri("ms-appx:///data/data.json");
Windows.Storage.StorageFile.getFileFromApplicationUriAsync(url).then(function (file) {
    Windows.Storage.FileIO.readTextAsync(file).then(function (text) {
        var parsedObject = JSON.parse(text);
        // do something with object
    });
});

There are lots of ways of reading the data from the file, but I find the FileIO object the most convenient. The code above assumes there is one JSON object description in the file. If you have a file that contains one object per line, then you'll need this:

var url = new Windows.Foundation.Uri("ms-appx:///data/data.json");
Windows.Storage.StorageFile.getFileFromApplicationUriAsync(url).then(function (file) {
    Windows.Storage.FileIO.readLinesAsync(file).then(function (lines) {
        lines.forEach(function (line) {
            var parsedObject = JSON.parse(line);
            // do something with object
        });
    });
});

This is a slight variation that uses the FileIO.readLinesAsync method to create an array of strings, each of which is parsed as a JSON object.

Heterogenous

Thank you, very descriptive! Using the ms-appx:// "protocol", this now also works with jQuery. – Bedroom

Thanks, worked a treat. Just a stylistic note, but you might want to chain promises rather than nest them, so in your code they go one after each other, instead of indenting deeper and deeper. Example here: #13710239 – Eliseoelish

Answer 2

If the data is part of your project, and you have marked the project type as Content, then

WinJS.xhr({ url: "data/mydata.txt" }).then(...)

works for me. Assumes in this example that mydata.txt is in a folder inside your project named data

Pagurian

Hm that is weird, I do not have any Properties on my file to change. – Bedroom

I created a new file with the same extension and it has Properties, then I renamed it (no file type change) to my previous file name and the Properties disappeared again. This is weird. – Bedroom

WinJS.xhr({ url: "data/mydata.txt" }).then(function(response) { var content = response.responseText; /* ... */}); – Choanocyte