Warum funktioniert dieses XMLHttpRequest-Beispiel von Mozilla in Firefox 3 nicht?

Question

Ich versuche, den Beispielcode von Mozilla zu erhalten, der einen REST-Webdienst benötigt, um unter Firefox 3.0.10 zu arbeiten. Der folgende Code funktioniert NICHT in Firefox, sondern in IE 8!

1. Warum funktioniert das nicht?
2. Hat IE 8 Unterstützung für XMLHttpRequest? Die meisten Beispiele, die ich gesehen habe, verwenden die ActiveX Zuordnung. Was soll ich tun? XMLHttpRequest scheint standardisierter zu sein.

Probe:

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); 

Die Open-Anweisung mit der Beschreibung eine Ausnahme wirft 'undefiniert'. Das ist seltsam, da ich das req -Objekt zuteile, es in Firefox laufe und überprüfe, ob es vor dem Aufruf von open definiert ist (was besagt, dass es vom Typ 'object' ist).

Ich habe auch die asynchrone Version von diesem ohne Glück versucht.

EDIT 2: Unter meinem letzten Code ist:

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: Okay, überarbeitet ich dies in jQuery. jQuery funktioniert gut in IE, aber es wirft 'Undefined', wenn es von Firefox läuft. Ich habe es überprüft und "JavaScript aktivieren" ist in Firefox aktiviert - scheint auf allen anderen Webseiten gut zu funktionieren. Unten ist die jQuery-Code:

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 

Zusammenfassung der Lösung:

Okay, Weblektion 101. Mein Problem war in der Tat Cross-Domain. Ich habe meine Website nicht veröffentlicht (nur auf dem Dateisystem), die einen veröffentlichten Dienst getroffen hat. Als ich meine Website unter derselben Domain veröffentlichte, funktionierte sie.

Was auch eine wichtige Unterscheidung zwischen IE und Firefox ergibt. Wenn IE dieses Szenario erfährt, wird der Benutzer gefragt, ob er den domänenübergreifenden Aufruf akzeptiert. Firefox löst eine Ausnahme aus. Während mir eine Ausnahme gutging, wäre eine aussagekräftigere hilfreich gewesen.

Danke für alle die mir geholfen haben.

Answer 1

es sei denn, 'http://www.mozilla.org/' ist die Domäne, aus der diese Anforderung stammt, diese wird nicht funktionieren, weil der Same Origin Policy

edit: Ok, ein guter Zustand 200 ist, nicht 0

sehen http://dogself.com/telluriumTest/ und klicken Sie auf "Stackoverflow Test". Es nutzt Ihren Code und funktioniert.

speziell dieser 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

ich die asynchrone Art und Weise sehr empfehlen, es zu tun, tritt eine Funktion die Anforderung und eine andere Funktion übernimmt die Reaktion ab.

function makeRequest() 
{ 
    var httpRequest; 
    if (window.XMLHttpRequest) // firefox etc 
    { 
     httpRequest = new XMLHttpRequest(); 
    } else if (window.ActiveXObject) { // ie 
     httpRequest = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    httpRequest.onreadystatechange = function(){handleResponse(httpRequest)}; 
    httpRequest.open('POST','http://localhost/test/test2.txt',true); 
    httpRequest.send(''); 
} 


function handleResponse(request) 
{ 
    if(request.readyState == 4) { 
     if(request.status == 200) { 
     // handling code here 
      // request.responseText is the string returned 
     } 
    } 
} 

Dies ist das grundlegende Format für Ajax-Aufrufe wir, wo ich arbeiten, sollte dies auch für Firefox, IE und Safari arbeiten.

Seitennotiz: haben Sie Firebug? es ist eine großartige Ressource für die Fehlerbehebung von Javascript.

EDIT: diesen Code Versuchen Sie stattdessen:

<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> 

Punkt: http://localhost/test/test2.txt an eine vorhandene Datei auf dem Server.

Nicht sicher, was genau mit Ihrem Code falsch ist, aber es schreibt direkt in das Dokument, das den gesamten Code, der bereits dort geschrieben wurde, zu verschleiern scheint. In dieser Version schreibe ich stattdessen an ein div.

Answer 3

nicht sicher, was hier auch vorgeht, aber wollte nur, dass Sie alle wissen, dass jemand aus der Mozilla-Dokumentation dies zu sehen, um die Dokumente zu optimieren, wenn es sich herausstellt, sobald dies herausgefunden wird.

Answer 4

Verwenden Sie onreadystatechange nicht beim Senden synchrone Anfrage ('false'), setzen Sie den Handler direkt nach der send() -Funktion. Es scheint, dass FF die Funktion onreadystatechange nicht ausführt, wenn die Anfrage synchron ist.

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

Answer 5

Auch hatte ich gleiches Problem und es war dumme Fehler, die wir nicht konzentrieren auf dem Code in IE funktioniert gut, hatte aber Probleme in Chrome und Firefox

Initilly haben wir Type="submit" statt type="button" obwohl wir hatten keine Funktionsprobleme wie das Aktualisieren der Tabellen, aber wir erhielten HTTP: error 0 in der Alarmbox, wenn ich alarmierte req.responseText Mit dem untenstehenden Code löste mein Problem

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

Answer 6

Abgesehen von all den offensichtlichen Fehlern auf der Clientseite ist der Hauptgrund dafür, dass die Gecko-Engine in der Kopfzeile des Servlets nach dem Access-Control-Allow-Origin sucht. Wenn es nicht gefunden wird, wird die Kommunikation abgebrochen und Sie erhalten einen Status = 0 und statusText = null. Auch das moz-nullprincipal in XML Parsing-Fehler. All dieses Zeug ist sehr irreführend. Alles, was Sie dieses Problem lösen müssen, ist:

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

Im Servlet-Code und das Leben wird

Answer 7

gut :-) sein Ersetzen Sie die Zeile

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

mit

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

Answer 8

Ich stieß auf das gleiche Problem. Der Grund, dass IE funktioniert und kein anderer Browser ist, weil der IE die Datei mit einer URL wie "C: \ xampp \ htdocs \ project3 \ project3.html" öffnen kann. Andere Browser ändern dies in eine URL wie "file: /// C: /xampp/htdocs/project3/project3.html ". Da die Domäne der PHP-Datei dieselbe sein muss wie die Domäne der JavaScript-Datei IE, funktionieren andere Browser nicht. Stellen Sie sicher, dass Sie eine URL wie "http: //localhost/project3/project3.html" verwenden. Bitte beachten Sie die Verwendung von localhost. Stellen Sie außerdem sicher, dass Sie in Ihrem Javascript-Aufruf die PHP-Datei über localhost aufrufen.