Sencha - Syncing store to MySQL Database with JSONP?

Question

I'm attempting to both display a list from data in an external MySQL database and to insert records to the same database from a Sencha Touch App. After much confusion I was able to read and display the records using:

Ext.define("App.store.Share", {
extend: "Ext.data.Store",
required: "App.model.Share",
config: {
    model: "App.model.Share",
    proxy: {
        type: 'jsonp',
        api: {
            create: "http://127.0.0.1/submit.php?action=create",
            read: "http://127.0.0.1/submit.php?action=read",
            update: "http://127.0.0.1/submit.php?action=update",
            destroy: "http://127.0.0.1/submit.php?action=delete",
        },
        reader: {
            type: 'json',
            root: "ideas",
            totalProperty: "total"
        },
        writer: {
            type: 'json',
            writeAllFields: true
        }
    },
    pageSize: 3,
    autoLoad: true,
    autoSync: true
}
});

However, when I try to add a record to the database I get the error:

Uncaught Error: [ERROR][Ext.data.proxy.Server#create] JsonP proxies can only be used to read data.

I was originally using an ajax proxy but I can't use that either because of the whole cross-domain shenanigans. So if I can't use JsonP to write, and I can't use ajax, what can I do?

Thanks for any help!

score 1 · Accepted Answer · answered Sep 17 '12 at 02:00

1

You can use AJAX, but you have to enable cross-domain calls on your server. To achieve this you have to add the Access-Control-Allow-Origin HTML header to your response, e.g:

Enable all domains:

Access-Control-Allow-Origin: *

Enable a list of domains:

Access-Control-Allow-Origin: http://mydomain.com:8080 http://foo.otherdomain.com

You can find examples how to configure the different web servers here.

answered Sep 17 '12 at 02:00

tpolyak

1,234
1
9
15

Thanks! I can now run a query that inserts dummy data into the database. Now I am just trying to retrieve the sent values. The example I was following used Request Payload, but that is not being sent in the request. I'm also receiving the error: Request header field Content-Type is not allowed by Access-Control-Allow-Headers – JoshTFS Sep 17 '12 at 03:02
Try adding this to your HTML header, too: Access-Control-Allow-Headers: Content-Type – tpolyak Sep 17 '12 at 03:16

Sencha - Syncing store to MySQL Database with JSONP?

1 Answers1