Re: [nodejs] node.js can't receive ajax post data which made by ie9 or 8

[Tiger Nassau Inc]

You may have cors (cross origin) problems - its kind if tricky but you probsbly need a header to allow - search on this

Sent from my LG Mobile

bige...@gmail.com wrote:

>hello
>
>if we use chrome or firefox we can't successfully get the jquery ajax post
>data,
>
>but we found if we use ie9 or ie8 to send POST data by jquery ajax ,
>node.js just receive empty body {}
>
>even we change the header like content-type to application/json or
>text/plain and Accept value it still didn't work
>
>so is here anyone have the same problem or have any solution , please help
>me thanks a lot
>
>i paste my code below
>
>-------------------------------------------
>
>if(jQuery.browser.msie && window.XDomainRequest) {
>
> //var data=JSON.stringify({'property_id':'50da64f65d396b1e48000001','name':'222','start_date':'2012/11/11'});
> var data='property_id=50da64f65d396b1e48000001&id=222';
>
> var xdr = new XDomainRequest();
> xdr.contentType= 'text/plain';
>
> xdr.onload = function (e) {
> var data = $.parseJSON(xdr.responseText);
> if (data == null || typeof (data) == 'undefined') {
> alert(data)
> }
> //success
> };
> xdr.onerror = function (e) {
> //alert(e);
> }
>
> xdr.open("POST", url);
> xdr.send(data);
>
> }
> else
> {
> $.post(url,{'property_id':'111','name':'222','start_date':'2012/11/11'}, function(data) {
> alert(data)
> });
> }
>
>
>---------------------------------------------------
>
>
>$.ajax({
> beforeSend: function(xhrObj){
> xhrObj.setRequestHeader("Content-Type","application/json");
> xhrObj.setRequestHeader("Accept","application/json");
> }
> url: url,
> type: "POST",
> data: JSON.stringify({'property_id' : 'test'}),
> headers : {
> 'Accept' : 'application/json',
> 'Content-Type' : 'application/x-www-form-urlencoded'
> },
> dataType: "json",
> success: function(data){
> alert(data);
> }
>});
>
>--
>Job Board: http://jobs.nodejs.org/
>Posting guidelines: https://github.com/joyent/node/wiki/Mailing-List-Posting-Guidelines
>You received this message because you are subscribed to the Google
>Groups "nodejs" group.
>To post to this group, send email to nod...@googlegroups.com
>To unsubscribe from this group, send email to
>nodejs+un...@googlegroups.com
>For more options, visit this group at
>http://groups.google.com/group/nodejs?hl=en?hl=en

[Jacob Groundwater]

When doing a cross domain POST, the browser usually send two HTTP requests. The first with HTTP method OPTIONS before sending the actual request. Your server has to flag the request as okay before the browser proceeds.

Your server might be receiving the options request only, which would have no body.

[bige...@gmail.com]

sorry about my wrong description about the ajax which from different browsers

my chrome and firefox can successfully use ajax to  post data to node.js

but ie9 and ie8 can't  and server will receive empty body like {}

this is my response header

app.all('*', function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "X-Requested-With");
    res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
    res.header("X-Powered-By",' 3.2.1')
    res.header("Content-Type", "application/json;charset=utf-8");
    if(req.method==='OPTIONS')
      res.send(200);
    else
      next();
});


and we sure we have no cross origin problem

so is there any possible ajax wrong or node.js setting needed to adjust?

and thanks a lot john~

John於 2013年1月4日星期五UTC+8上午12時03分12秒寫道：

[bige...@gmail.com]

Hello Jacob

we have setting the response header like this

app.all('*', function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "X-Requested-With");
    res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
    res.header("X-Powered-By",' 3.2.1')
    res.header("Content-Type", "application/json;charset=utf-8");
    if(req.method==='OPTIONS')
      res.send(200);
    else
      next();
});

so is there anything we have to setting on node.js server?

and how could i check the second request can be received successfully? 

or did you have any ie ajax success sample can show me?  because it is really strange 

thanks a lot Jacob~

Jacob於 2013年1月4日星期五UTC+8上午1時51分14秒寫道：

[Jacob Groundwater]

From what I remember, that looks right. You could try adding console.log to print each request as it comes in.

I eventually abandoned X-Domain requests in favor of window.postMessage, which I think is a better solution. The postMessage function works across domains between iframes. You load a hidden iFrame in the target domain, then route all requests through there. No need to mess around with headers etc.

I don't know what support is like for postMessage in IE however.

[曾漢煒]

Hello Crenshinibon

I try to rewrite the node.js to use the less module than i found my ajax can work on ie9 

but no I found another problem is the module named "AXON" the message-oriented socket library

our team use this to push and pull the data, I think maybe this is the problem because i just use express module it can work successfully

so do you have use the AXON module and should i setting anything to make sure the socket can get the ajax post data from ie9 ?

Crenshinibon於 2013年1月4日星期五UTC+8下午7時59分01秒寫道：

Hello,

I actually had/have the same problem. It is not node.js at the backend, but getting the f***** IE 8 to send an ajax request to a different target is a mess, regardless of the receiver.

Your response looks good, quite similar to mine. My jQuery.ajax looks like this:

jQuery.ajax({

      url: planview_bridge_host + 'order_number',

      dataType: 'json',

      data: "{\"code\": \"" + id + "\", \"order_number\": \"" + order + "\"}",

      headers: {

        x_auth_user: 'dirk',

        x_auth_password: 'password',

        x_method: 'DELETE'

      },

      contentType: 'application/json; charset=UTF-8',

      type: 'POST',

      success: function(data) {

        if (data) {

          setToNein();

          return updateOrderNumber('undef');

        } else {

            return alert('Falsche Daten empfangen: ' + JSON.stringify(data));

        }

      },

      error: function(jqXHR, textStatus, e) {
          alert(JSON.stringify(jqXHR));
          setToJa();

          return alert('Verbindungsproblem: ' + JSON.stringify(e));
      }
    });

(The JSON object is not present in IE8 by default, I added the json2.js by Crockford to the page)

Actually I added: "jQuery.support.cors = true" in my client script. And read somewhere that some browsers are unable to send requests with methods other than POST and GET. So I reverted to POST everything and send the method really meant as a custom header field ("x_method").

It works despite the fact that when a user for the first time tries to send a request, he is asked if he truly want to send data to a different host.

Hope it helps a little.

Regards

Dirk

[曾漢煒]

Hello jacob 

thanks a lot   

I have rewrite the node.js and just use express module , then i found my ajax can successfully post data from ie9 to node.js server

so I found our team member use a module called "AXON" to push and pull the socket which is using for data transfering

now I think maybe this is the problem ,because when i use this , I am not sure it can recognize ie9 ajax post data and header 

so did you have ever use the AXON module and where to set the socket setting can get the post data from ie9?

thanks a lot~

Jacob於 2013年1月5日星期六UTC+8上午1時04分27秒寫道：

[Crenshinibon]

Hi,

never heard of the AXON module. Like I said, the example above is from a current project which contacts a Java (actually: Xtend) backend. There, I use the "simpleframework" as a "server". No node.js. And I think it has nothing to do with it.

I did the same with node.js and can't remember doing anything very special with it. To get cross site scripting working with IE8 (our corporate default web server, by the way) you have to stick to the following things, I am not sure if all are mandatory, though:

• The server has to always respond with the ACCESS_CONTROL_ALLOW_HEADERS / ORIGIN / METHODS headers properly defined. The IE8 doesn't send a OPTIONS preliminary request.
• Much depends on the dataType of the request. If you use "script" or "jsonp" you get through without any complaint. But jQuery always uses GET in this cases.
• If you want or must use POST, DELETE, PUT, etc. methods. You have to set the dataType to "json". But than you have to define: "jQuery.support.cors=true" somewhere. And your clients get the annoying message I mentioned above. But only once per web page.

Here is some working server code, using proper HTTP methods and the datatype "json":

https://gist.github.com/4476236

and the client:

https://gist.github.com/4476269

and the HTML file pulling everything together:

https://gist.github.com/4476305

(IE8, jQuery 1.8.3, json2.js)

Regards

Dirk

[Crenshinibon]

I remember one additional thing. IE8 tends to fall apart if it is unable to understand the charset defined in the Content-Type. Make sure you define a valid one, e.g. "utf-8".

Regards,

Dirk

[Crenshinibon]

And one more thing. If you define "contentType" in your ajax request you have to add "Content-Type" to the responses "ACCESS_CONTROL_ALLOW_HEADERS".

I think I did this in the example.

regards

Dirk

[bige...@gmail.com]

Hello Crenshinibon

Thanks for your response, now I had solved the problem

it's really because the ie request is different from chrome or ff like you said , it's because ie didn't send the option request first

so now i use a buffer to receive all the data by the request even "data" , now i can get all the post data~

thanks a lot~~~

Crenshinibon於 2013年1月8日星期二UTC+8下午5時00分38秒寫道：

[Crenshinibon]

Glad I could help.

Regards

Dirk