Forum PHP.pl > [jQuery] problem z wczytaniem danych za pomocą Ajax ze skryptu w subdomenie w IE9

czaru

12.04.2013, 14:09:50

Witam.

Mam ogromny problem z którym nie mogę sobie poradzić. Przeszukałem zakamarki internetu, znalazlem wiele solucji, ale żadna dla mnie nie zadziałała.
Mam nadzieję, że tu znajdę odpowiedź.

Sprawa polega na wczytaniu przy pomocy AJAX danych z pliku w innej subdomenie. Pod wszystkimi przeglądarkami działa. Nawet w IE10 działa. Problem natomiast jest z przeglądarką IE9.
Poniżej zamieszczam wgląd w pliki:

Plik który próbuje odebrać dane. http://sub1.mydomain.pl/testAjax.php

Kod

<html>
<head>
<script src="public/js/jquery.js" type="text/javascript"></script>
<script>
$(document).ready(function(){

    $.support.cors = true;

    vars = {done:"My data"}

    $.ajax({
        type: "POST",
        url: 'http://sub2.mydomain.pl/test.php',
        cache: false,
        dataType : 'html',
        data : vars,
        crossDomain: true
    }).done(function(data) {
        $('#result').append('Response from server: <br />' + data + '<br />');
    }).fail(function(jqXHR, errorText){
         $('#result').append('readyState: ' + jqXHR.readyState + '<br />');
         $('#result').append('responseText: ' + jqXHR.responseText + '<br />');
         $('#result').append('status: ' + jqXHR.status + '<br />');
         $('#result').append('textStatus: ' + errorText + '<br />');
    });
});
</script>
</head>
<body>

<div id="result"></div>

</body>
</html>

Plik który AJAX odpytuje. http://sub2.mydomain.pl/test.php

Kod

<?php

header("Access-Control-Allow-Origin: *");

echo "Connection: Works!<br />";
echo "Data sent: ".$_POST['done'];

?>

Jak pisałem wyżej. Wszystko działa wszędzie jak trzeba orpócz IE9.
O to co powinno się wyświetlić:

Response from server:
Connection: Works!
Data sent: My data

A w IE9 dostaje takie dane:

readyState: 0
responseText: undefined
status: 0
textStatus: error

Może ktoś spotkał się z podobnym problemem.

Aha dodam jeszcze, że używam jQuery w wersji 1.9.1

matiit

12.04.2013, 14:16:29

Kod

if ($.browser.msie && window.XDomainRequest) {
// Use Microsoft

R
            var xr = new XDomainRequest();
            xr.open("get", url);
            xr.onload = function() {
                // XDomainRequest doesn't provide responseXml, so if you need it:
                var dom = new ActiveXObject("Microsoft.XMLDOM");
                dom.async = false;
                dom.loadXML(xr.responseText);
            };
            xr.send();
        } else {
            $.ajax({...});
        }

Musisz zrobić coś w ten deseń. Przynajmniej dla IE8 tak było

czaru

12.04.2013, 15:36:37

Cytat(matiit @ 12.04.2013, 15:16:29 )

Kod

if ($.browser.msie && window.XDomainRequest) {
// Use Microsoft

R
            var xr = new XDomainRequest();
            xr.open("get", url);
            xr.onload = function() {
                // XDomainRequest doesn't provide responseXml, so if you need it:
                var dom = new ActiveXObject("Microsoft.XMLDOM");
                dom.async = false;
                dom.loadXML(xr.responseText);
            };
            xr.send();
        } else {
            $.ajax({...});
        }

Musisz zrobić coś w ten deseń. Przynajmniej dla IE8 tak było

Dzięki za odpowiedź.
Troche mi to pomogło gdyż udało mi się ruszyć ze skryptem w IE9.
W jQuery 1.9+ nie ma opcji juz sprawdzania przeglądarki poprzez $.browser. Piszę tak dla przypomnienia

Ok poradziłem sobie ale został mały szkopuł.

Potrzebuję wysłać dane poprzez POST. GET odpada.
Poniżej wklejam zmienioną wersję skryptu.

Kod

<html>
<head>
<script src="public/js/jquery.js" type="text/javascript"></script>
<script>
$(document).ready(function(){

    var url = 'http://sub2.mydomain.pl/test.php';

    if(!$.support.opacity)
    {
        var vars = "done=My_data"

        var xr = new XDomainRequest();
        xr.open("POST", url);
        xr.send(vars);
        xr.onload = function()
        {
            $('#result').append('Response from server: <br />' + xr.responseText + '<br />');
        };
    }
    else
    {
        var vars = {done:"My_data"}

        $.ajax({
            type: "POST",
            url: url,
            cache: false,
            dataType : 'html',
            data : vars,
            crossDomain: true
        }).done(function(data) {
            $('#result').append('Response from server: <br />' + data + '<br />');
        }).fail(function(jqXHR, errorText){
             $('#result').append('readyState: ' + jqXHR.readyState + '<br />');
             $('#result').append('responseText: ' + jqXHR.responseText + '<br />');
             $('#result').append('status: ' + jqXHR.status + '<br />');
             $('#result').append('textStatus: ' + errorText + '<br />');
        });
    }


});
</script>
</head>
<body>

<div id="result"></div>

</body>
</html>

Da się w XDomainRequest wysłać coś postem ?

matiit

12.04.2013, 15:38:46

http://stackoverflow.com/questions/1202516...-xdomainrequest Tu piszą że niby się da.

czaru

12.04.2013, 16:03:57

Super dzięki.

Wszystko gra.
Przetestowane w Chrome, FF, Opera, Safari, IE 7,8,9,10.

Wszędzie śmiga.

Przesyłam działający kod. Może ktoś będzie miał podobny problem.

Plik: http://sub1.mydomain.pl/testAjax.php

Kod

<html>
<head>
<script src="public/js/jquery.js" type="text/javascript"></script>
<script>
$(document).ready(function(){

    var url = 'http://sub2.mydomain.pl/test.php';

    if(!$.support.opacity)
    {
        var vars = "done=My_data"

        var xr = new XDomainRequest();
        xr.open("POST", url);
        xr.send(vars);
        xr.onload = function()
        {
            $('#result').append('Response from server: <br />' + xr.responseText + '<br />');
        };
    }
    else
    {
        var vars = {done:"My_data"}

        $.ajax({
            type: "POST",
            url: url,
            cache: false,
            dataType : 'html',
            data : vars,
            crossDomain: true
        }).done(function(data) {
            $('#result').append('Response from server: <br />' + data + '<br />');
        }).fail(function(jqXHR, errorText){
             $('#result').append('readyState: ' + jqXHR.readyState + '<br />');
             $('#result').append('responseText: ' + jqXHR.responseText + '<br />');
             $('#result').append('status: ' + jqXHR.status + '<br />');
             $('#result').append('textStatus: ' + errorText + '<br />');
        });
    }


});
</script>
</head>
<body>

<div id="result"></div>

</body>
</html>

Plik: http://sub2.mydomain.pl/test.php

Kod

<?php

header("Access-Control-Allow-Origin: *");

if(isset($_POST['done']))
{
    echo "Connection: Works!<br />";
    echo "Data received using jQuery Ajax!<br />";
    echo "Data sent: ".$_POST['done'];
}
else if(isset($HTTP_RAW_POST_DATA) && !empty($HTTP_RAW_POST_DATA))
{
    parse_str($HTTP_RAW_POST_DATA);
    echo "Data received using XDomainRequest!<br />";
    echo "Connection: Works!<br />";
    echo "Data sent: ".$done;
}
else
{
    die('error');
}

?>

Pozdrawiam