Load/Read an local JSON Filme

How-to Discussions
1

Good Morning,

i’ve downloaded the Social Media App Example from fuse.

There is an MyApp.ux file with some Code to fetch json from an url - but i want to change the code to load/read an local json file (assets(myjson) - so i tried

        <JavaScript File="assets/myjson.json" ux:Global="MyJson" />
        <JavaScript>

            var Observable = require("FuseJS/Observable");
            var data = Observable();

            var MyJson = require("MyJson");
            data.value = JSON.parse(MyJson);

            module.exports = {
                data: data
            };

        </JavaScript>

but it is not working

any help?

2

Do module.exports = { json structure... } in myjson.json and just data.value = MyJson;

3

We are working on a new, shiny much simpler way of dealing with local file system from FuseJS. Sorry for the temporary inconvenience!

4

Has this new shiny method came out yet?

5

I haven’t tested if this works but I’m hoping I can use fetch like so:

fetch('data.json').then(function(data) {
  // where data is the parsed json object
});
6

Has this new shiny method came out yet?

Yes! Make sure your files are added to your .unoproj Include bundle:

"*.json:Bundle"

And then:

var Bundle = require("FuseJS/Bundle");

var foo = JSON.parse(Bundle.readSync("foo.json"));

See full docs here: https://www.fusetools.com/learn/fusejs#bundle

7

Wouldn’t it be easier to just use the same api that we already have fetch?

It could work like so:

fetch('data.json').then(function(res) {
  return res.json();
}).then(function(data) {
 // where data is the parsed json object
});

and for text:

fetch('data.txt').then(function(res) {
  return res.text();
}).then(function(data) {
 // where data is text
});

Therefore you won’t have to have the bundle library, and plus when should readSync ever be used? IO should be asynchronous

8

Oh yes. I use fetch to grab the json currently. I thought theere migh tbe something else I missed.

9

sorry @Leon That was for @Anders, I haven’t tested if this works yet, but I’m asking wouldn’t that be easier?

10

fetch() can only fetch from URLs. It cannot fetch bundled files. Note that bundled files are different from the local file system. Bundled files are stored inside the actual app bundle (APK)

11

Can’t you alter the fetch api?

var oldFetch = fetch;

fetch = function fetch(url, options) {
  if(isUrlBundleFile(url)) {
    return new Promise(function(res, rej) {...});
  }
  return oldFetch(url, options);
}

Without all this being exposed, the user would just use it as normal

12

You can add that to fetch yourself, in JS you can override (almost) anything :slight_smile:

13

@Anders I know but wouldn’t it make it easier for you guys not having to maintain another API?

and if I did it myself or anyone else we’d still have to use the Bundle API underneath, which would mean no point

14

The Bundle API will change to something else to give you more features at some point. If we use fetch we are limited to what fetch can provide.