CORS (Cross-Origin-Resource-Sharing) - ExtJS 4.1.1 - Ext.Ajax-request

[jsalisbury]

Does anyone have a working example of an Ext.Ajax.request that has to use CORS to receive some JSON ?
I'd be particularly interested in one on the public internet so that I can see and believe!

I'm running with PHP on port 80 (Apache http) and ExtJS 4.1.1 and I'd like to make Ajax calls to port 8080 where a 3rd party REST service is serving up JSON.

I've added the required headers to my HTML via PHP header directive:
<?php header("Access-Control-Allow-Origin: http://localhost:8080")

I've set Ext.Ajax.defaultHeaders as recommended:
'Access-Control-Allow-Origin': 'http://localhost:8080',
'Access-Control-Allow-Headers': 'x-requested-with'

I've turned off defaultHeaders with:
Ext.Ajax.useDefaultXhrHeader = false;

I've set Ext.Ajax.cors = true.

No joy. All I ever see is chrome is:
1. 500 (Internal Server Error)
2. XMLHttpRequest cannot load <url>. Origin http://localhost is not allowed by Access-Control-Allow-Origin.

PS Please, please do NOT suggest I use JSONP as I can't and won't!

[jsalisbury]

Its all very well doing a header on your index.php for CORS but the each REST JSON response needs the CORS header(s) too.

In this case its not practical to modify the REST service to produce extra headers.

In this instance I can move my app inside the REST server so it gets delivered on the same port, so I'm in luck.

[mankz]

This BBC sample uses CORS and Ext 4.1.

http://bryntum.com/examples/schedule...s/bbc/bbc.html

[jsalisbury]

really neat

....now I'm a believer!

many thanks
J.