JavaScript Ajax Anfrage vs jQuery $ .ajax

HINWEIS: Ich habe mehr Code als nur die Ajax-Aufrufe eingefügt, und zwar mit der Wahrscheinlichkeit, dass der Code (ein Teil) der Ursache des Problems ist. Ich glaube jedoch nicht, deshalb sollten Sie sich besser auf das konzentrierenajax undjAjax funktioniert etwas weiter unten.
Beachten Sie auch, dass ich, da es zu dieser Frage einen Kommentar gibt (mit Gegenstimme), der besagt, dass mein Code schwer zu entschlüsseln ist, gerne klären würde, was geklärt werden muss, wenn sich dies als der Schlüssel zum Auffinden des Problems herausstellen könnte.
Vielen Dank.

Hier ist das Ding. Ich versuche, jQuery loszuwerden, da ich nur das verwende$.ajax() Methode, und mit einer ganzen Bibliothek wie jQuery für nur 1 Feature ist IMO verrückt. Ich brauche nicht einmal die volle Funktionalität des$.ajax Methode sowieso, daher habe ich meine eigene geschriebenajax Funktion.

Das Problem ist: Es funktioniert nicht und ich kann nicht herausfinden, warum. Ich versuche Objekte an den Server zu senden (speziell: ajaxAction im Controller - mit Zend FW). Unten ist der Javascript-Code und eine Zusammenfassung dessen, was mir die Firebug-Konsole sagt.

<code>if (!String.prototype.trim)
{
    String.prototype.trim = function()
    {
        "use strict";
        return this.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
    };
}

function getUrl(action,controller)
{
    var base,uri;
    base = window.location.href.replace('http://'+window.location.host,'');
    if (base.length > 1)
    {
        base = base.substring(1,base.length).split('/');
        controller = controller || base[0];
        base[0] = controller || base[0];
        base[1] = action || base[1];
        return '/'+base.join('/');
    }
    controller = controller || 'index';
    action = action || 'ajax';
    return base+controller+'/'+action;
}

function formalizeObject(obj,recursion)
{
    recursion = recursion || false;
    if (typeof obj !== 'object')
    {
        throw new Error('no object provided');
    }
    var ret = '';
    for (var i in obj)
    {
        if (!obj.hasOwnProperty(i) || typeof obj[i] === 'function')
        {
            continue;
        }
        if (recursion)
        {
            ret +='['+i+']';
        }
        else
        {
            ret += (ret.length > 0 ? '&' : '') + i.toString(); 
        }
        if (typeof obj[i] === 'object')
        {
            ret += formalizeObject(obj[i],true);
            continue;
        }
        ret += '='+obj[i].toString();
    }
    if (recursion)
    {
        return ret;
    }
    return encodeURI(ret);
}

function success()
{
    if (this.readyState===4 && this.status===200)
    {
        console.log(this.responseText);
    }
}

function ajax(str,url,method,json)
{
    var ret;
    json = json || false;
    str = str || {};
    method = method || 'POST';
    url = url || getUrl();
    str = 
    str = (typeof str === 'object' ? str : {data:str});
    try
    {
        ret = new XMLHttpRequest();
    }
    catch (error)
    {
        try
        {
            ret= new ActiveXObject('Msxml2.XMLHTTP');
        }
        catch(error)
        {
            try
            {
                ret= new ActiveXObject('Microsoft.XMLHTTP');
            }
            catch(error)
            {
                throw new Error('no Ajax support?');
            }
        }
    }
    if (typeof ret !== 'object')
    {
        throw new Error('No Ajax, FFS');
    }
    ret.open(method, url, true);
    ret.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
    ret.setRequestHeader('Content-type', (json ? 'application/json' : 'application/x-www-form-urlencode'));
    ret.onreadystatechange = success;
    ret.send((json ? JSON.stringify(str) : formalizeObject(str)));
    return true;
}

function jAjax(str,url)
{
    $.ajax(
    {
        url : url,
        data: str,
        type: 'POST',
        success: function(res)
        {
            console.log(res);
        }
    });
}
</code>

Vier Möglichkeiten, wie ich versucht habe, die Ajax-Anfrage zu stellen:

<code>jAjax({data:{foo:'bar'}},getUrl());//1
jAjax({data:{foo:'bar'}},getUrl(),true);//2
ajax({data:{foo:'bar'}},getUrl());//3
ajax({data:{foo:'bar'}},getUrl(),true);//4
</code>

jAjax({data:{foo:'bar'}},getUrl());: Das funktioniert gut:

[] {"ajax": true, "controller": "index", "action": "ajax", "module": "default", "identity": {}, "data": {"foo": " Bar "}} Parameter: data [foo] 'bar' und Quelle: data% 5Bfoo% 5D = Bar (von der Registerkarte POST in der FB-Konsole) Header: application / x-www-form-urlencoded; Zeichensatz = UTF-8
All dies wurde an die folgende URL gesendet:http://www.foo.bar/index/ajax?data%5Bfoo%5D=bar

Dies funktioniert jedoch nicht:

[] {"ajax": true, "controller": "index", "action": "ajax", "module": "default", "identity": {}} ist die Registerkarte "response POST" in FB: JSON-Daten : {foo: 'Bar'} Quelle: {"data": {"Foo": "Bar"}} (aber die gleiche URL ist Fall 1) Header: json; Zeichensatz = UTF-8

Das ist der Große: Die vollständige Anforderungs-URL ist identisch mit der URL aus Fall 1, ebenso wie die Header, ABER wenn ich auf die Registerkarte POST in der FB-Konsole schaue (die Anforderung überprüfen). Dies ist der einzige Unterschied, den ich feststellen kann:

Fall 1: Parameter: data [foo] 'bar' Quelle: data% 5Bfoo% 5D = Bar
In diesem Fall wird nur der Abschnitt "Parameter" nicht angezeigt: Quelle: Daten% 5Bfoo% 5D = Balken

Identisch mit case2, bis auf die URL, die ich vergessen zu haben glaubeencodeURI. Dieser Fall ist vorerst weniger wichtig. Ich denke / hoffe, dass ich das zum Laufen bringen werde, sobald ich herausgefunden habe, was mit Fall 3 nicht stimmt.

In allen 4 Fällen wird die Anfrage gesendet und empfangen. Die Controller-Aktion ist wie folgt:

<code>public function ajaxAction()
{
    $this->_helper->layout->disableLayout();
    $this->getHelper('viewRenderer')->setNoRender();
    $this->_helper->getHelper('AjaxContext')->addActionContext( 'ajax' , 'json' )
                                            ->initContext('json');
    if($this->getRequest()->isPost() && $this->getRequest()->isXmlHttpRequest())
    {
        echo json_encode(array_merge(array('ajax'=>true),$this->_getAllParams()));
    }
    else
    {
        throw new Exception('no ajax call made??');
    }
}
</code>

Da ich eine JSON-Zeichenfolge erhalte, bin ich sicher, dass die Anforderung veröffentlicht wurde und die richtige enthältXMLHttpRequest Header. Warum kann ich dann keine JSON-Objekte veröffentlichen? Noch mehr auf den Punkt: Warum funktioniert Fall 3 nicht? Was macht jQuery, das mir nicht bewusst ist? Was bewirkt, dass Fall 1 funktioniert, Fall 3 jedoch nicht?

PS: Es mag irrelevant sein, aber in einem Moment des Wahnsinns habe ich versucht, Folgendes hinzuzufügen:ret.setRequestHeader('Connection','close'); zumajax Funktion, aber ich bemerkte, dass in der Kopfzeile, die gesendet wurde,Connection sollte trotzdem am Leben bleiben. Vielleicht gibt das jemandem einen Hinweis darauf, was schief gelaufen ist?

Danke im Voraus

Antworten auf die Frage(1)

Ihre Antwort auf die Frage