Sencha Touch - Cross Domain (CORS) Issue

Question

I am attempting to load datapoints from a cross domain URL. Unfortunately I can't get this to work. I have set up my Apache Linux server to support CORS as far as I can tell. I added the following to the header of the configuration file:

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Methods "GET,POST"
Header set Access-Control-Allow-Headers "X-Requested-With"

This is the current setup of my store:

    var myStore = Ext.create('Ext.data.Store',
    {
            fields: [{name: 'xTime', type: 'int'}, {name: 'yData', type: 'float'}, {name: 'target', type: 'string'}],
            proxy:
            {
                type: 'ajax',
                url: 'http://test.com/datapoints.json',
                useDefaultXhrHeader: false,
                reader: 'points'
            },
            autoLoad: true
    });

I'm just trying to find what am I missing here? I'm testing it using Safari and so far, I'm still getting the "Access-Control-Allow-Origin" error.

Any help would be greatly appreciated!

Answer 1

Can you set up a packet sniffer such as WireShark to see the actual HTTP request being sent to the server. Or alternatively, configure your server to log the request/response headers. My guess is either that the request doesn't include the Origin header, or the request includes some other request header that isn't included in the Access-Control-Allow-Headers method. One thought, try adding Content-Type to the Access-Control-Allow-Headers method; this is a common one that is needed when requesting JSON data.