3

注意:我粘贴了更多的代码,而不仅仅是 ajax 调用,因为代码是(部分)导致问题的原因。但是,我不认为是这样,因此您最好将注意力集中在ajaxandjAjax功能上。
另请注意,由于对此问题有评论(带有赞成票)说我的代码很难破译,我很乐意澄清需要澄清的内容,如果这可以证明是找到问题的关键。
谢谢。


事情就是这样。我正在尝试抛弃 jQuery,因为我唯一使用的是$.ajax()方法,并且包含一个像 jQuery 这样的整个库仅用于 1 个功能是 IMO 疯狂的。无论如何,我什至不需要该$.ajax方法的全部功能,因此我编写了自己的ajax函数。

问题是:它不起作用,我似乎无法弄清楚为什么。我正在尝试将对象发送到服务器(特别是:控制器中的 ajaxAction - 使用 Zend FW)。下面是 javascript 代码,以及 firebug 控制台告诉我的摘要。

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

我尝试发出 Ajax 请求的四种方式:

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
  1. jAjax({data:{foo:'bar'}},getUrl());:这工作得很好:

    []{"ajax":true,"controller":"index","action":"ajax","module":"default","identity":{},"data":{"foo":" Bar"}} 参数:data[foo] 'bar' 和来源:data%5Bfoo%5D=Bar(来自 FB 控制台中的 POST 选项卡)标题:application/x-www-form-urlencoded; charset=UTF-8
    所有这些都发送到以下网址:http ://www.foo.bar/index/ajax?data%5Bfoo%5D=bar

  2. 但是,这不起作用:

    []{"ajax":true,"controller":"index","action":"ajax","module":"default","identity":{}} 是 FB 中的响应 POST 选项卡:JSON 数据: {foo:'Bar'} source: {"data":{"Foo":"Bar"}} (但相同的 url 是 case 1) Header: json; 字符集=UTF-8

  3. 这是一个大问题:完整的请求 url 与案例 1 中的 url 相同,但是当我查看 FB 控制台中的 POST 选项卡(检查请求)时,标题也是如此(检查请求)这是我能找到的唯一区别:

    案例1:参数:data[foo] 'bar' 来源:data%5Bfoo%5D=Bar
    在这种情况下,我看不到参数部分,只有: 来源:data%5Bfoo%5D=Bar

  4. 与case2相同,除了url,我想我忘记通过了encodeURI。这个案子现在不那么重要了。我想/希望在我弄清楚案例 3 有什么问题的那一刻,我就能解决这个问题。

在所有 4 种情况下,请求都被发送和接收。控制器动作如下:

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??');
    }
}

由于我收到一个 JSON 字符串,我确定请求已发布,并且具有正确的XMLHttpRequest标头。那么,为什么我不能发布 JSON 对象?更重要的是:为什么案例 3 不起作用?jQuery 做了什么我不知道的事情?是什么让案例 1 起作用,但不是案例 3?

PS:这可能无关紧要,但在疯狂的时刻,我尝试将这个:添加ret.setRequestHeader('Connection','close');ajax函数中,但我注意到,在发出的标头中,Connection设置为保持活动状态。也许这会给某人一个关于出了什么问题的线索?

提前致谢

4

1 回答 1

1

如果有人想知道出了什么问题:

ret.setRequestHeader('Content-type', 'application/x-www-form-urlencode');

应该是“x-www-form-urlencoded”,最后是“d”:

ret.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

发送一个形式化的对象现在可以工作了,我可以摆脱 jQuery :-)

于 2012-05-11T14:19:00.203 回答