Eval Security Issue in Adobe AIR 1.5.3/ExtJS 3.1.1

[sara_762001]

Trying to use Adobe AIR 1.5.3,EXTJS 3.1.1 and Ajax, but im getting the following exception when I try to use the following method to decode JSON string

Ext.util.JSON.decode(result.responseText);//decode using eval() to construct json object.

Error: Adobe AIR runtime security violation for JavaScript code in the application security sandbox (eval)

I have included ext-air.js also but still facing the issue. Got the code from following forum and tried to load the grid panel.

http://www.extjs.com/forum/showthread.php?t=91695

The following are the JS files included.
<script type="text/javascript" src="/references/air/AIRAliases.js"></script>
<script type="text/javascript" src="/references/air/AIRIntrospector.js"></script>
<script type="text/javascript" src="/references/extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="/references/extjs/ext-all.js"></script>
<script type="text/javascript" src="/adapter/build/ext-air.js"></script>

Here is the sample code to load grid panel via Ajax Request,

var options = {
url: 'url'
method: "POST",
headers: {
'Content-Type': 'application/json; charset=utf-8'
},
success: function(result, request) {
var gridSettings = Ext.util.JSON.decode(result.responseText);
},
failure: function(result, request) {
alert('Failure'+result.responseText);
}
};

Ext.Ajax.request(options);

Here is sample resonse json string.
[
[{id:'id',header:'ID',width:144,sortable:false,hidden:false,hideable:true,dataIndex:'id'},{id:'name',header:'name',width:144,sortable:false,hidden:false,hideable:true,dataIndex:'name'}], [{name:'id',mapping:'col1'},{name:'name',mapping:'col2'}], [{"col1":"1","col2":"saravanan"},{"col1":"2","col2":"ana"}]
]

Any one kindly help on avoiding eval issue in using ExtJS 3.1.1 and Adobe AIR 1.5.3.

[makana]

How do you want to load a gridpanel from that JSON? Looks little messed. Never got issues with JSON encoding/decoding.... Make sure you receive a correct JSON string.

[sara_762001]

Hi,
I used the following code to create grid dynamically.
var gridSettings = Ext.util.JSON.decode(result.responseText);
var totlalSummaryDataCols = gridSettings[0];
var totlalSummaryDataFields = gridSettings[1];
var totlalSummaryData= gridSettings[2];
var totlalSummaryDataStore = new Ext.data.SimpleStore({
fields:totlalSummaryDataFields
});
totlalSummaryDataStore.loadData(totlalSummaryData);
var totlalSummaryGrid = new Ext.grid.GridPanel({
store : totlalSummaryDataStore,
id:'totlalSummaryGrid',
cm : new Ext.grid.ColumnModel({
columns : totlalSummaryDataCols
}),
stripeRows : true,
height : 658,
loadMask : true,
selectOnFocus : true,
cls : 'x-toolbar-clear',
view: new Ext.grid.GridView({
forceFit: true,
scrollOffset : 0,
emptyText: '<table><tr><td height="500">NO DATA</td></table>'
}),
tbar : ['<font color=#2a5ea9><b>Person Details</b></font>']
});

[sara_762001]

Hi Makana,

I found that issue. If i remove renderer:HyperLinkLeftGridOrg from my JSON, it's work fine. But if put renderer:HyperLinkLeftGridOrg it's throws eval security error. Is there any way to use renderer in JSON?. How can i add renderer in my JSON without eval security error?

Can you anybody help me on this?

Kind Regards
S.Saravanan

[makana]

First of all, don't post the same question/topic in several threads. (The other remains without any answer for my part by now).

To your problem. Building a grid out of json is little strange I think. But, if you really want to do it, make sure, you have correct JSON!

{renderer:HyperLinkLeftGridOrg}

isn't correct.

String values have to be quoted. Use

{renderer:"HyperLinkLeftGridOrg"}

instead. Then access the renderer function by its scope, window in default case.

renderer: window[myDecodedJsonObject.renderer]

or something like this, because it is a string and you cannot use eval.

[sara_762001]

Hi Makana,

In the JSON string I have changed renderer as below.
{renderer:"HyperLinkLeftGridOrg"}

The JSON decoded well and able to get the JSON. But getting the following error.
HTML ERROR: Unmatched </head> encountered. Ignoring tag.

HTML ERROR: Extra <body> encountered. Migrating attributes back to the original <body> element and ignoring the tag.

Kind Regards
S.Saravanan

[makana]

Don't know what your JSON contains.... but seems like you try to add some redundant html markup....

[sara_762001]

This is the HTML code we using. If I remove the renderer in json string its working fine, so i assume there is no issue in HTML structure.Please help on this

 
<html>
 
<head>
 
<title>Sample</title>
<linkrel="stylesheet" type="text/css" href="../extjs/resources/css/ext-all.css" />
<linkrel="stylesheet" type="text/css" href="../extjs/air/css/ext-air.css" />
<scripttype="text/javascript" src="../air/AIRAliases.js"></script>
<scripttype="text/javascript" src="../air/AIRIntrospector.js"></script>
 
<!-- Debug Versions
<script type="text/javascript" src="../extjs/adapter/ext/ext-base-debug.js"></script>
<script type="text/javascript" src="../extjs/ext-all-debug.js"></script>
<script type="text/javascript" src="../extjs/ext-air-debug.js"></script>
-->
 
<scripttype="text/javascript" src="../extjs/adapter/ext/ext-base-debug.js"></script>
<scripttype="text/javascript" src="../extjs/ext-all-debug.js"></script>
<scripttype="text/javascript" src="../extjs/ext-air-debug.js"></script>
<scripttype="text/javascript">
function showHyperLinkLeftGridOrg(){
       alert ("showHyperLinkLeftGridOrg");
}
Ext.onReady(function(){
      var gridSettings = Ext.util.JSON.decode ('[[{id:"name",renderer:"showHyperLinkLeftGridOrg",header:"Name",width:144,sortable:false,hidden:false,hideable:true,dataIndex:"name"},{id:"Count",renderer:"showHyperLinkLeftGridOrg",header:"Count",width:144,sortable:false,hidden:false,hideable:true,dataIndex:"Count"}],[{name:"Name",mapping:"col1"},{name:"Count",mapping:"col2"}],[{"col1":"Org","col2":"90525"},{"col1":"Org2","col2":"86748"}]]');
 
var totlalSummaryDataCols = gridSettings[0];
var totlalSummaryDataFields = gridSettings[1];
var totlalSummaryData= gridSettings[2];
var totlalSummaryDataStore=new Ext.data.SimpleStore({fields:totlalSummaryDataFields});
 
totlalSummaryDataStore.loadData(totlalSummaryData);
 
var totlalSummaryGrid =new Ext.grid.GridPanel({
   renderTo : Ext.getBody(),
   store : totlalSummaryDataStore,
   columns : totlalSummaryDataCols
});
});
</script>
</head>
<body>
</body>
 </html>

[makana]

Please use CODE-tags to post code!!!

Don't wrap html tags, other problems not visible.... Don't know how to help you with this....

What about debugging using e.g. Aptana Studio?

[sara_762001]

Hi Makana,

Now the HTML tag error resolved & data loaded into grid panel but if we use the renderer method with "" encoded then renderer function not getting called.

{renderer:"showHyperLinkLeftGridOrg"}

How do we use renderer in columns? Please help on this.

Kind Regards
S.Saravanan