Community Forum: Cross domain post

Print Page | Close Window

Cross domain post

Printed From: IdeaBlade
Category: Breeze
Forum Name: Community Forum
Forum Discription: Build rich JavaScript apps using techniques you already know
URL: http://www.ideablade.com/forum/forum_posts.asp?TID=3788
Printed Date: 27-Apr-2025 at 12:02pm

Topic: Cross domain post

Posted By: Marcel
Subject: Cross domain post
Date Posted: 10-Nov-2012 at 1:37am

Hello,

quick explanation:

I have a small mvc project with a controller where (atm) i post json data to, which is hosted on my own domain.

Now i wanted to create the possibility for my customers to post data from their website (other domain) to my controller,

but after trying and trying to get this done with jquery (ajax) i came to the conclusion it's such a pain due to
cross-domain posting. IE 8 for example is the biggest problem here.

My customers would link in a javascript file (and neccesary dependencies) from my website, initialize my javascript objects and implement a form by given specs.

Now i have been playing with breeze a lot and ofcourse i could check it myself eventually, but a quick question here
would save me the time.

So the question:

Does breezejs support cross-domain crud operations (or even only get and post) ?

Thanks in advance.

Replies:

Posted By: jtraband
Date Posted: 13-Nov-2012 at 10:32am

We haven't spent much time looking at Cross-Origin Resource Sharing (CORS) with Breeze yet but with the recent release of Breeze 0.70.1 we now support for the ability to completely customize or replace any ajax communication between the breeze client and the web service on the server. This obviously includes the ability to specify CORS headers in any Ajax request. So assuming that you are going thru the ASP.NET Web API provider and that your service is configured to support CORS, breeze should be able to talk to it.

Unfortunately, we haven't seen much from Microsoft regarding how to configure ASP.NET Web Api to support CORS, but we assume that it is possible.

Again, we have not yet gotten around to testing this, so please let us know of your progress in this direction.

The Breeze documentation on our Ajax support is still in progress, but hopefully the following will get you started.

To control the headers on every ajax request that breeze makes you can execute the following code when your app first starts up.

   var ajaxImpl = breeze.core.config.getAdapterInstance("ajax");
   ajaxImpl.defaultSettings = {
     headers: {
               // any CORS or other headers that you want to specify.
               "X-Test-Header": "foo2"
           },
};

Alternatively, you can intercept the individual ajax calls and add your headers selectively based on the request.

   var ajaxImpl = breeze.core.config.getAdapterInstance("ajax");
   ajaxImpl.defaultSettings = {
       beforeSend: function(jqXHR, settings) {
                  // examine the jqXHR or settings and customize the headers accordingly.
                  jqXHR.setRequestHeader("X-Test-Before-Send-Header", "foo2");
           }
     };

Posted By: Marcel
Date Posted: 15-Nov-2012 at 1:18am

First of all thank you very much for the clear answer.

In the meantime i've done a lot of testing to get this working with jQuery, and eventually managed to get it working through jsonp.
Although jsonp can't be used to do a POST to a controller, a GET with the json as a parameter worked like a charm.

CORS can be enabled even through the web.config by adding the appropriate custom headers.

The only problem left is browser incompatibility to read request headers through jQuery.
So that makes it nearly impossible to maintain session state on the server, which i needed for a Captcha check.

Eventually i solved the problem by letting my customers embed our web-form through an iframe so i didn't have to worry about CORS.

The project i'm working on is at the moment still an MVC 3 project, but i will probably upgrade it to MVC 4 and use breeze.js (since the asp.net team abbandoned upshot.js and are a bit slow with alternatives).

Thanks again.

Posted By: Nucleotic
Date Posted: 16-Nov-2012 at 11:52am

Hi Marcel,

We also had various cross-domain posting issues where we separated our WebAPI service layer into a separate assembly and I used a mix of a C# delegating handler (to intercept the HTTP request/response pipeline - think HTTPModule-like) to implement the JSONP standard along with a JSONMediaTypeformatter to interpret the HTTP-headers format in our case.

Then we just extended the ajax request on the client side to override certain header properties before popping request off to the server via the EntityManager. This is did via a bug-fix in the Breeze.js scripts in the 3 SaveChanges functions (to enable OPTIONS / POST on JSONP).

I have this solution working like a charm now, with a complex entity set. I am happy to share and solution with you and the bug fixes with the Breeze team.

Therefore this requires minimal custom ajax calls and forms part of the core Breeze API (in our case) to minimize the need for further custom jQuery / XHttpRequest / html iframe hacks. BTW, I tried various CORS options via config in ASP.NET, but browser support seems lacking on the client side. JSONP is fully supported.

Regards,

Posted By: jtraband
Date Posted: 16-Nov-2012 at 11:57am

Anything you have to share in this area would be greatly appreciated, as well as any recommendations to changes to "Breeze" to make this whole process easier.

Print Page | Close Window