Personal computing discussed

Moderators: renee, SecretSquirrel, just brew it!

 
steelcity_ballin
Gerbilus Supremus
Topic Author
Posts: 12072
Joined: Mon May 26, 2003 5:55 am
Location: Pittsburgh PA

CORS and jquery/ajax JSON call to ASMX

Tue Mar 18, 2014 9:53 am

Howdy devs!

I'm filling in the gaps for a project that is using an older method of doing a web service via an ASMX. The ASMX works fine, but due to the nature of the solution I'm working in, local debug via VS2010 has the ASMX on a localhost port that is different than the localhost of the simple test I am running against it. Now I know the ASMX works because if I invoke it directly I get the results I expect. The existing calls are all made on the same domain in the live environment so we have no problems. However, in my dev environment, because the localhost port is different for the ASMX vs the Test case, we have a Same-Origin-Policy problem from javascript.

Now, if it were my project, I'd simply convert the asmx to a WCF, install the Cors Lib and the Web API which relax those policies and be done with it. However it's not, so here we are. I am nearly positive but I wanted to ask anyone that might know for sure: It is my understanding that Cross-Domain requests via Ajax with JSON are not possible. I have research the crap out of this and not a single stack overflow or blog site has said otherwise, though many, MANY of those sites claim that simply setting the headers to accept content-type, setting the domain origin to allow access etc all work - but specifically the issue is with the json call. When you send across a json call, it preflights the request which sends the OPTIONS header first, and every modern browser that supports CORS will then strip any headers you add at this point. Stripping those headers obviously causes your request to fail with a http 500 error. I have inspected this very closely with fiddler and found this to be the case.

So if anyone could confirm that, great. Further, if anyone has a work around (besides JSONP, which only permits GET requests, and this MUST be a POST) I'd be ever so grateful. The only work around I know of is using a proxy domain to trick it into believing the origin is the same as the request destination, which is really really overkill and just not worth it IMO. Here's a sample of the call I need to make from local deployment to my other local deployment.

//replaced sensitive data below for posting online
function localtestProductionservice() {
        var dataToSend = { testData: $("#testJob").val() };
        $.ajax({
            crossDomain: true,
            type: "POST",
            url: "http://localhost:8080/LiveWorkingService.asmx/DoWork",
            data: JSON.stringify(dataToSend),
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (response) {
                alert("Test Complete:");
            },
            error: function (xhRequest, ErrorText, thrownError) {
                alert("Test Error: " + xhRequest.responseText);
            }
        });
    }


So it's a very nuanced reason why it doesn't work cross-domain whereby other folks online have had theirs work - but again I believe it has to do with how the headers are stripped of their added values which the service expects to handshake in a sense, but because the contentType is not one of a few default "safer" types the service might expect, the request is preflighted by the browser to see if this contentType is even permitted, headers stripped, then it fails to make the request due to missing headers. It's also inconsistent due to a bug in Chrome where the request is sent even if the preflight fails. So I've been using FireFox to inspect various results.
 
morphine
TR Staff
Posts: 11600
Joined: Fri Dec 27, 2002 8:51 pm
Location: Portugal (that's next to Spain)

Re: CORS and jquery/ajax JSON call to ASMX

Tue Mar 18, 2014 10:04 am

You have essentially two solutions:

1) Change the remote webserver configuration to allow for cross-domain POST requests. Not always an option.

Reference 1
Reference 2
Reference 3

2) Create a script on your local server that you can call, that simply passes on the request to the remote server. For example, a very simple PHP script using cURL can do this.

I.e. $.ajax( { url: 'http://yourserver.com/webservice.php', type: 'POST', ....} );
There is a fixed amount of intelligence on the planet, and the population keeps growing :(
 
Redocbew
Minister of Gerbil Affairs
Posts: 2495
Joined: Sat Mar 15, 2014 11:44 am

Re: CORS and jquery/ajax JSON call to ASMX

Tue Mar 18, 2014 5:42 pm

#2 is usually what I end up doing when I run into a cross-domain problem. Javascript won't have any idea of the final endpoint if you proxy your request through some other script, so it won't consider it being cross-domain.
Do not meddle in the affairs of archers, for they are subtle and you won't hear them coming.
 
steelcity_ballin
Gerbilus Supremus
Topic Author
Posts: 12072
Joined: Mon May 26, 2003 5:55 am
Location: Pittsburgh PA

Re: CORS and jquery/ajax JSON call to ASMX

Wed Mar 19, 2014 8:06 am

Thanks for the replies - I'll re-read those docs in case I missed something. The only difference I noticed between some of those attempts and various of my own is that in one of the examples they are not passing ''content-type" as part of the ajax call. I'll try it without but I thought it was required.
 
morphine
TR Staff
Posts: 11600
Joined: Fri Dec 27, 2002 8:51 pm
Location: Portugal (that's next to Spain)

Re: CORS and jquery/ajax JSON call to ASMX

Wed Mar 19, 2014 9:57 am

steelcity_ballin wrote:
Thanks for the replies - I'll re-read those docs in case I missed something. The only difference I noticed between some of those attempts and various of my own is that in one of the examples they are not passing ''content-type" as part of the ajax call. I'll try it without but I thought it was required.

Perhaps we weren't clear. You're not going to solve this from your end, and it's not a JQuery issue, or one with your code :)

Cross-domain POST requests aren't allowed unless you either change the destination server's configuration to specifically allow that (idea #1 above), or do a request to a local script that you create, which will then use cURL or something similar to do the POST request and hand the data back to your client (idea #2).

Example:

yourfile.js -> POST to local something.php -> POST again to the remote server, return data as JSON.
There is a fixed amount of intelligence on the planet, and the population keeps growing :(
 
Glorious
Gerbilus Supremus
Posts: 12343
Joined: Tue Aug 27, 2002 6:35 pm

Re: CORS and jquery/ajax JSON call to ASMX

Wed Mar 19, 2014 1:33 pm

Of course, if you are really evil and have control of the server-side...

...GET is certainly supposed to be idempotent, but it doesn't actually have to be. :evil:

Seriously, though. Don't do that. I'd like to retro-actively fire the people who did it where I work...
 
steelcity_ballin
Gerbilus Supremus
Topic Author
Posts: 12072
Joined: Mon May 26, 2003 5:55 am
Location: Pittsburgh PA

Re: CORS and jquery/ajax JSON call to ASMX

Wed Mar 19, 2014 3:19 pm

Maybe I didn't specify, but I have control over the server, the service, and everything in between. When I test, I launch 2 instances of the debugger. One for the "server" asmx(localhost:12345) and one for the test (localhost:67890) for argument's sake. I've modified the web.config file on the server to be as lax and insecure as possible just to get it to run. It won't even do that. Here's what my web.config on the "server" asxm project looks like:

     <httpProtocol>
        <customHeaders>
          <add name="Access-Control-Allow-Methods" value="GET, PUT, POST, DELETE, OPTIONS" />
          <add name="Access-Control-Allow-Origin" value="*"/>
          <add name="Access-Control-Allow-Headers" value="Content-Type, Authorization, X-Requested-With"/>     
          <!-- needed for CORS request for cross-domain testing of ASMX services -->
        </customHeaders>
      </httpProtocol>


And here's what I get back via Fiddler2 using FireFox: You can see it's preflighting the request via OPTIONS but then from there it seems to error. I understand that I can simply POST to another page, grab the data, then do an HTTP POST and return the response but the underlying issue is that I really just need to be able to test this locally because it's not my project and I cannot change the "flow" of things beyond modifying the server's web.config, as well as my "client" call to this service. I have done a million variations of this without issue but I've always written my tests to be within the same project to avoid this nuanced annoyance of two different local servers, but I cannot change that now.

What's irking me most is right now the image below shows the content type as text. If you reference my first post, that is clearly not what I am sending. Why it showing that instead of what I actually sent? I believe it's failing the OPTIONS preflight and never sending the actual POST, but I don't know why considering I have my request seemingly correct, and the server has the relaxed web.config settings. Please keep in mind my original call was using junk data so the port numbers in my screen shot are the actual stuff, I think I removed any identifying data... Thanks!

http://i.imgur.com/DzmKBKK.png
 
morphine
TR Staff
Posts: 11600
Joined: Fri Dec 27, 2002 8:51 pm
Location: Portugal (that's next to Spain)

Re: CORS and jquery/ajax JSON call to ASMX

Wed Mar 19, 2014 3:29 pm

Have you tried doing the request/response in JSONP? I think that's what you should be doing, as little of a standard that is. Also, as a test, instead of doing JSON.stringify(), put your data in an HTML form then do serialize().
There is a fixed amount of intelligence on the planet, and the population keeps growing :(
 
morphine
TR Staff
Posts: 11600
Joined: Fri Dec 27, 2002 8:51 pm
Location: Portugal (that's next to Spain)

Re: CORS and jquery/ajax JSON call to ASMX

Wed Mar 19, 2014 3:30 pm

One thing you really have to try is doing your request on the command line using cURL, instead of doing it via a browser with jQuery, etc.

If you use cURL and it works, you know the problem is with the JS code. If it doesn't, you know it's with the webserver.
There is a fixed amount of intelligence on the planet, and the population keeps growing :(
 
eitje
Gerbil Elite
Posts: 661
Joined: Fri Mar 07, 2003 11:28 am

Re: CORS and jquery/ajax JSON call to ASMX

Wed Mar 19, 2014 3:34 pm

Are you using Visual Studio 2010 or newer? If so... can you configure the projects to use IIS Express instead of the built-in VS development server? I'm assuming that's the server being used by the circumstances (i.e. - different port numbers) that you're describing.

Also, awesome that a programming question made it into the "hot topics" on the front page. :)
Your ideas intrigue me; I would like to purchase stock in your company.
 
steelcity_ballin
Gerbilus Supremus
Topic Author
Posts: 12072
Joined: Mon May 26, 2003 5:55 am
Location: Pittsburgh PA

Re: CORS and jquery/ajax JSON call to ASMX

Thu Mar 20, 2014 8:36 am

morphine wrote:
Have you tried doing the request/response in JSONP? I think that's what you should be doing, as little of a standard that is. Also, as a test, instead of doing JSON.stringify(), put your data in an HTML form then do serialize().


I thought JSONP only works with GET requests? This has to be a POST. I'm still tinkering and looking for a reason why it doesn't work despite the headers and web.config set appropriately (as far as I can tell).
 
morphine
TR Staff
Posts: 11600
Joined: Fri Dec 27, 2002 8:51 pm
Location: Portugal (that's next to Spain)

Re: CORS and jquery/ajax JSON call to ASMX

Thu Mar 20, 2014 9:44 am

Oh, doh, you're right, didn't even think when typing that.

I'd still give it a try via curl.exe directly. It's the only way you'll be able to know for sure on what side the problem lies.
There is a fixed amount of intelligence on the planet, and the population keeps growing :(

Who is online

Users browsing this forum: No registered users and 1 guest
GZIP: On