AE Panel: Send obj from JS to JSX

Question

I'm writing a panel for After Effects and am trying to send an Object from my main.js to my jsx file. From what samples I can find they say that I can't send an object but have to stringify() the obj and pass that instead.

I've tried sending both an object and a string of the stringify'd object - neither are working for me.

main.js

var profileUI = {
     script: '',
     data: {
          csv:    $('#csv')[0].checked,
          feed:   $('#json')[0].checked,
          gs:     $('#googleSheets')[0].checked
     },
}
var csInterface = new CSInterface();
csInterface.evalScript('$._ext_SB.batch("' + JSON.stringify(profileUI) + '"")' );

myFunctions.jsx

$._ext_SB={
    batch : function(profileUI) {

        var str = "";
        for (prop in profileUI) {
          str += prop + " [" + typeof profileUI[prop] + "]: " + profileUI[prop] + ".\n";
        }
        alert(str);
    },
};

I'm getting an error: Unable to run script at line 1. Expected: )

It doesn't seem to be getting an actual string and like I mentioned above , trying to pass an object doesn't work either (that would be preferable).

Answer 1

There are three issues here. See:

Syntax Error in JavaScript

You have an extra double quote (") character in your call to evalScript. This:

csInterface.evalScript('$._ext_SB.batch("' + JSON.stringify(profileUI) + '"")' );

should be this (note the removal of one of the two final " characters):

csInterface.evalScript('$._ext_SB.batch("' + JSON.stringify(profileUI) + '")' );

JSON Needs To Be Escaped

As you pointed out in another answer, you need to escape the " characters in the JSON string such that it is properly un-escaped when processed by evalScript(). This results in:

csInterface.evalScript('$._ext_SB.batch("' + JSON.stringify(profileUI).replace(/"/g,'\\"') + '")' );

For clarity, the escaping is accomplished using .replace(/"/g,'\\"').

evalScript Does Not Auto-Parse JSON

You will need to call JSON.parse() on your profileUI parameter to get the object version back. See:

$._ext_SB={
    batch : function(_profileUI) {
        // Convert the input string back into an object.
        var profileUI = JSON.parse(_profileUI);

        // Everything else should work okay...
        var str = "";
        // ...
    }
}

Some notes:

1. The object you get back from JSON.parse() will be a simple Object - it will contain the same properties as the object you called JSON.stringify() on but it will not have any associated functions.
2. ExtendScript does not automatically provide JSON support. If it exists in the application when you start your panel, that is because all panels (including Adobe-built ones) share a single ExtendScript context. Some Adobe panels already include a JSON library and you can usually get away with using that. If you are not able to use JSON, however, you will need to include a compatible JSON library yourself. Some are mentioned here.