Pourquoi cet exemple XMLHttpRequest de Mozilla ne fonctionne pas dans Firefox 3?

Question

J'essaie d'obtenir l'exemple de code de Mozilla qui consomme un service Web REST pour fonctionner sous Firefox 3.0.10. Le code suivant ne fonctionne pas dans Firefox mais dans IE 8!

1. Pourquoi cela ne fonctionne-t-il pas?
2. IE 8 prend-il en charge XMLHttpRequest? La plupart des exemples que j'ai vus utilisent l'allocation ActiveX . Que devrais-je faire? XMLHttpRequest semble plus standardisé.

Exemple:

var req = new XMLHttpRequest(); 
req.open('GET', 'http://localhost/myRESTfulService/resource', false); // throws 'undefined' exception 
req.send(null); 
if(req.status == 0) 
    dump(req.responseText); 

La déclaration ouverte est de lancer une exception avec la description 'non défini'. C'est étrange car j'alloue l'objet req, je l'exécute dans Firefox, et je vérifie qu'il est défini avant d'appeler open (qu'il dit être de type 'object').

J'ai également essayé la version asynchrone de cela sans succès.

EDIT 2: Voici mon code le plus récent:

function createRequestObject() { 
    if(window.XMLHttpRequest) { 
     return new XMLHttpRequest(); 
    } 
    else if(window.ActiveXObject) { 
     return new ActiveXObject("Microsoft.XMLHTTP"); 
    } 

    return null; 
} 

function handleResponse(req) { 
    document.writeln("Handling response..."); // NEVER GETS CALLED 
    if(req.readyState == 0) { 
     document.writeln("UNITIALIZED"); 
    } 
    else if(req.readyState == 1) { 
     document.writeln("LOADING"); 
    } 
    else if(req.readyState == 2) { 
     document.writeln("LOADED"); 
    } 
    else if(req.readyState == 3) { 
     document.writeln("INTERACTIVE"); 
    } 
    else if(req.readyState == 4) { 
     document.writeln("COMPLETE"); 
     if(req.status == 200) { 
      document.writeln("SUCCESS"); 
     } 
    } 
} 

document.writeln(""); 
var req = createRequestObject(); 

try { 
    document.writeln("Opening service..."); 
    req.onreadystatechange = function() { handleResponse(req); }; 
    req.open('POST', 'http://localhost/test/test2.txt', true); // WORKS IN IE8 & NOT FIREFOX 


    document.writeln("Sending service request..."); 
    req.send(''); 

    document.writeln("Done"); 
} 
catch(err) { 
    document.writeln("ERROR: " + err.description); 
} 

EDIT 3: D'accord, j'ai retravaillé cette jQuery. jQuery fonctionne très bien dans IE mais il lance 'Undefined' lorsqu'il est lancé depuis Firefox. J'ai coché et "Activer JavaScript" est activé dans Firefox - semble bien fonctionner dans toutes les autres pages Web. Voici le code jQuery:

function handleResponse(resp) { 
    alert("Name: " + resp.Name); 
    alert("URL: " + resp.URL); 
} 

$(document).ready(function() { 
    $("a").click(function(event) { 

     try { 
      $.get("http://localhost/services/ezekielservices/configservice/ezekielservices.svc/test", 
        "{}", 
        function(data) { handleResponse(data); }, 
        "json"); 
     } 
     catch(err) { 
      alert("'$.get' threw an exception: " + err.description); 
     } 

     event.preventDefault(); 
    }); 
}); // End 'ready' check 

Résumé de la solution:

D'accord, leçon web 101. Mon problème était en effet interdomaine. Je regardais mon site non publié (juste sur le système de fichiers) qui frappait un service publié. Lorsque j'ai publié mon site sous le même domaine, cela a fonctionné.

Ce qui soulève également une distinction importante entre IE et Firefox. Lorsque IE rencontre ce scénario, il invite l'utilisateur à accepter ou non l'appel inter-domaine. Firefox lève une exception. Bien que je sois d'accord avec une exception, une plus descriptive aurait été utile.

Merci à tous ceux qui m'ont aidé.

Answer 1

moins « http://www.mozilla.org/ » est le domaine à partir duquel cette demande provient, cela ne marchera pas à cause de même politique d'origine

modifier: Ok, un bon état est de 200, et non 0.

voir http://dogself.com/telluriumTest/ et cliquez sur "test stackoverflow". C'est en utilisant votre code et en travaillant.

spécifiquement ce code:

function test(){ 
    var req = new XMLHttpRequest(); 
    req.open('GET', 'index2.htm', false);  
    req.send(null); 
    if(req.status == 200) 
    alert("got some stuff back:"+req.responseText); 
} 

Answer 2

Je recommande fortement la manière asynchrone pour le faire, une fonction lance la demande et une autre fonction gère la réponse.Ceci est le format de base pour les appels ajax que nous utilisons où je travaille, cela devrait fonctionner de la même manière pour Firefox, IE et Safari.

Note au côté: avez-vous un firebug? C'est une excellente ressource pour le dépannage de javascript.

EDIT: Essayez ce code à la place:

<html> 
<head> 
<script> 
function out(outStr) // cheap and dirty output function 
{ 
    document.getElementById("out").innerHTML += "<br>" + outStr; 
} 

function handleResponse(req) { 
    if(req.readyState == 0) { 
     out("UNITIALIZED"); 
    } 
    else if(req.readyState == 1) { 
     out("LOADING"); 
    } 
    else if(req.readyState == 2) { 
     out("LOADED"); 
    } 
    else if(req.readyState == 3) { 
     out("INTERACTIVE"); 
    } 
    else if(req.readyState == 4) { 
     out("COMPLETE"); 
     if(req.status == 200) { 
      out(req.responseText); 
     } 
    } 
} 

function createRequestObject() { 
    var req = null 
    if(window.XMLHttpRequest) { 
     req = new XMLHttpRequest(); 
    } else if(window.ActiveXObject) { 
     req = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    return req; 
} 

function makeRequest() 
{ 
    var req = createRequestObject(); 

    try { 
     out("Opening service..."); 
     req.onreadystatechange = function() { handleResponse(req); }; 
     req.open('POST', 'http://localhost/test/test2.txt', true); // WORKS IN IE8 & NOT FIREFOX 


     out("Sending service request..."); 
     req.send(''); 

     out("Done"); 
    } 
    catch(err) { 
     out("ERROR: " + err.description); 
    } 
} 
</script> 
</head> 
<body> 
<div onclick="makeRequest();">test<br></div> 
<div id="out">Output Here</div> 
</body> 
</html> 

Point

: http://localhost/test/test2.txt à un fichier existant sur votre serveur.

Vous ne savez pas exactement ce qui ne va pas avec votre code, mais il écrit directement sur le document qui semble arroser tout le code déjà écrit à cet endroit. Dans cette version, j'écris à la place à la place.

Answer 3

ne sais pas ce qui se passe ici non plus, mais je voulais juste que vous sachiez que quelqu'un de la documentation de Mozilla regarde ceci pour être prêt à tordre les docs si cela s'avère nécessaire une fois que cela est compris.

Answer 4

n'utilisez pas onreadystatechange lors de l'envoi d'une requête synchrone ('false'), placez le gestionnaire juste après la fonction send(). Il semble que FF n'exécute pas la fonction onreadystatechange si la requête est synchrone.

http://support.mozilla.com/tiki-view_forum_thread.php?locale=ca&comments_parentId=124952&forumId=1

Answer 5

Même j'avais même problème et il était stupide erreur que nous ne mettons pas l'accent sur le code fonctionnait très bien dans IE, mais a eu des problèmes dans Chrome et Firefox

Initilly nous avons utilisé Type="submit" au lieu de type="button" si le nous n'avions pas de problèmes de fonctionnalité comme la mise à jour des tables, mais nous obtenions HTTP: error 0 dans la boîte d'alerte quand j'ai alerté req.responseText En utilisant le code ci-dessous a résolu mon problème

input type="button" name="btnEdit5" id="btnEdit5" value="Confirm" onClick="show_confirm()" 

Answer 6

Outre toutes les erreurs évidentes du côté client, la principale raison à cela est que le moteur gecko recherche Access-Control-Allow-Origin dans l'en-tête du servlet. S'il ne le trouve pas, il annulera la communication et vous obtiendrez un status = 0 et statusText = null. En outre, moz-nullprincipal en erreur d'analyse XML. Tout cela est très trompeur. Tout ce que vous devez résoudre ce problème est:

response.setHeader("Access-Control-Allow-Origin","*"); 

Dans le code de servlet et la vie sera bonne :-)

Answer 7

Remplacez la ligne

req.open('POST', 'http://localhost/test/test2.txt', true); // WORKS IN IE8 & NOT FIREFOX 

avec

req.open('GET', 'http://localhost/test/test2.txt', true); // WORKS IN IE8 & NOT FIREFOX 

Answer 8

J'ai rencontré le même problème. La raison pour laquelle IE fonctionne et aucun autre navigateur est parce que IE vous permet d'ouvrir le fichier avec une URL comme "C: \ xampp \ htdocs \ project3 \ project3.html" D'autres navigateurs vont changer cela en une URL comme "file: /// C: /xampp/htdocs/project3/project3.html ". Depuis le domaine du fichier PHP doit être le même que le domaine du fichier javascript IE fonctionne, mais pas les autres navigateurs. Assurez-vous que vous utilisez une URL comme "http: //localhost/project3/project3.html". S'il vous plaît noter l'utilisation de localhost. Assurez-vous également que dans votre appel javascript, vous appelez le fichier PHP via localhost.