CODEWITHSUNDEEP
c#ajaxrestjquery
kk1076
kk1076

Reputation: 1748

jQuery AJAX beforeSend fails in Firefox browser

I used beforeSend in AJAX jQuery to pass the header value in the REST service. The header values are passed well in Internet Explorer 8. But the header values are not passed in Firefox and the service is not called.

Here is my code : 

var postCall = function () {
$.support.cors = true;
var HFAssociateRefId = document.getElementById('MainContent_HFAssociateRefId').value;
var Input = {
     AssociateRefId: HFAssociateRefId
 };       
 alert(JSON.stringify(Input));
 var url = document.URL;
 var currentdate = new Date();
 var datetime = (currentdate.getMonth() + 1) + "/"
 + currentdate.getDate() + "/"
 + currentdate.getFullYear() + " "
 + currentdate.getHours() + ":"
 + currentdate.getMinutes() + ":"
 + currentdate.getSeconds();
 $.ajax({
       type: "POST",
       headers: { Accept: "text/plain; charset=utf-8", "Content-Type": "text/plain; charset=utf-8"
                },
       beforeSend: function (xhr, settings) {
       xhr.setRequestHeader("Date", datetime);
       xhr.setRequestHeader("URL", url);
                },
       url: "http://localhost:40680/LinkService.svc/TokenInsertion",
       data: JSON.stringify(Input),
       contentType: "application/json",
       dataType: "json",
       success: function (response) {
       alert(response);
                },
       error: function (xhr, status, error) {           
       alert(status);
                },              
});

I also tried by calling the xhr as new XMLHttpRequest as specified in this link. But it doesnt work in Firefox. ??
Thanks in advance.

Upvotes: 1

Views: 911

Answers (3)

kk1076
kk1076

Reputation: 1748

Refer the link. Firefox and Chrome never accepts new custom headers to be added as it violates the browser security rule.

Upvotes: 0

Arun P Johny
Arun P Johny

Reputation: 388316

It looks like Firefox is not respecting the header Date. It is sending the header URL. I'm not able to find any resource to explain this behaviour.

As a solution you can rename the header Date to something else.

Chrome also shows the same behaviour.

On further investigation, it looks like the standard behaviour as per the standard. Look under the section titled Terminate these steps if header is a case-insensitive match for one of the following headers:

The same was asked in this question.

Upvotes: 1

Kart Michel
Kart Michel

Reputation: 1

the fist problem this is:

type: "post",
data: JSON.stringify(Input), <=== this is fail
correct is: data:{data:JSON.stringify(Input)}, 
recuest to $_POST['data']; is better if using arrays...

I recommend you try with jquery ... this example is very easy.

Basic sample!

Page 1 to Html or PHP not is very important this name...

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Prueba Array 1</title>
**<!-- important download JQUERY 1.3 or late... -->**
    <script type="text/javascript" src="js/jquery-1.3.min.js"></script>
    <script>
    $(document).ready(function(){
    function toSend(d) {
        $.ajax({  
            type: "get", **// this is posible chain by "post"**
            url: 'test.php', 
            data: {datos:JSON.stringify(d)},  
            dataType: "json",
            success: function(test) { 
                //console.log("visualizacion del registro Name[1]: "+ test.names[1])
                console.info("Array Send");

                $.each( test, function( key, value ) {
                      console.log( key + ": " + value );
                      });
            }
        });


    }

    // send Submit
            $(":send").live('click',function(){
                                    console.log("preparing to send! ");              
                            // lista de entradas en un ID
                            var data    =   $('#form_1 input').serializeArray();
                        // Serializacion de las entradas input
    //                  // Acciones
                    toSend(data);

                    });


    });
    </script>
    </head>

    <body>
    <div id="ie">
    <form id="form_1" action="#" >
    <input name="Nombre" type="text" value="Petronila">
    <input name="Apellido" type="text" value="Sinforosa">
    <input name="Telefono" type="text" value="phone">
    <input name="Ciudad" type="text" value="Living in Caracas">
    <input type="submit" value="Send">
    </form>

    </div>

    </body>
    </html>

to the next, Copy this code and then save it as test.php! and run

<?php 
if(isset($_GET['datos'])){
$names  = array('john doe', 'JANE doe');
$ids    = array('123', $datos);

$data['names'] = $names;
$data['ids'] = $ids;


    echo json_encode($data);
}else{
    $error  =   array('error','No se recibieron metodos');
    $error  =   array('messeng','Method need chain test to Get');
    echo json_encode($error);
}
?>

ok is very, very important to check the results in the browser console F12 to check any of these, you need to activate the console firefox sometimes im test and is ok!

Upvotes: 0

Related Questions