Best way to load external JSON files

[luka-ve]

Hi, I'm trying to figure out the best way to load trial information from an external JSON file.
Currently I'm using synchronous AJAX calls to load in an array JSON object:

$.ajax({
    url: 'trial_info.json',
    dataType: 'json',
    type: 'get',
    cache: true,
    async: false,
    success: function (data) {
        test_stimuli = data;
    }
});

This works, but is synchronous and apparently deprecated in the current jQuery version This is fine for my experiment, because the JSON file is very small. How would I use the async callback function to delay the construction of the trials until the file is loaded?

[jodeleeuw]

You can wrap the construction of your experiment in a function and then call that function from the async callback:

function build_timeline(){
  var trial = { ... } // etc..

  jsPsych.init({ ... }) // etc..
}

$.ajax({
  success: function(data) {
    test_stimuli = data;
    build_timeline();
  }
});

[jodeleeuw]

Another option, which doesn't quite answer your question but would solve the same problem, is to take your JSON file and convert it to JS with a single modification

Here's the JSON

[{"property": "value"}]

To make JS:

var my_json = [{"property": "value"}]

If the file is JS instead of JSON, you can just load it via a <script> tag and it will load synchronously at the start of the experiment, avoiding the need for AJAX.