ExtJS Ajax POST 与代理 POST

Posted 2023-02-26

【中文标题】ExtJS Ajax POST 与代理 POST

【英文标题】：ExtJS Ajax POST vs Proxy POST

【发布时间】：2012-08-07 12:31:25

【问题描述】：

我正在尝试使用 ExtJS 4.1 创建一个网格面板。它使用 AJAX 代理从服务器获取数据：

var store = Ext.create('Ext.data.Store', 
    model: 'myModel',
    pageSize: pageSize,
    proxy: 
        type: 'ajax',
        url: "../search",
        actionMethods:  
            create: "POST",
            read: "POST",
            update: "POST",
            destroy: "POST"
        ,
        headers: 
            'Content-Type': 'application/json'
        ,
        limitParam: false,
        startParam: false,
        pageParam: false,
        extraParams: JSON.stringify(
            rows: pageSize,
            role: "Admin",
            index: myIndex,
            question: searchPhrase
        ),
        reader: 
            type: 'json',
            root: 'results.results',
            totalProperty: 'numFound',
            model: 'myModel'
        
    
);

store.loadPage(1);

但它似乎不起作用。

我收到一条错误消息，指出无法读取 JSON。更重要的是，在 Firebug 中，发送的参数是不可读的。

当我尝试使用相同的参数进行 Ajax 调用时，一切似乎都正常：

Ext.Ajax.request(
    url:"../search",
    method: "POST",
    params: JSON.stringify(
        rows: pageSize,
        role: "Admin",
        index: myIndex,
        question: searchPhrase
    ),
    success: function()
        console.log("ok");
    ,
    failure: function(response, opts)
        console.log("failed");
    ,
    headers: 
        'Content-Type': 'application/json'
    
);

即使在 Firebug 中，请求中的每个参数看起来都很好。

框架在使用代理时有何不同？

【问题讨论】：

您的第一个代码可以检查一些事情：1）我会尝试从extraParams 中删除JSON.stringify - 它对我来说很好，只需发送一个对象。 2) 为了安全起见，请尝试包含代理配置writer: 'json'。 3) 评论headers 配置。

服务器响应也可能存在问题，因此如果您还包括服务器返回的 JSON 将是有益的。

@Izhaki 如果我删除JSON.stringify，那么我会得到另一个错误（我在互联网上的某个地方找到了这种方法来避免它）。如果我评论 headers 配置，则设置了错误的 content-type（同样，一个问题）。关于响应，我不认为存在问题，因为我得到 302 状态并且错误（Could not read JSON）来自服务器。还有其他建议吗？

嗯，这很奇怪，看看这个（稍作修改）JsFiddle version of your code - 控制台向服务器显示了一个完美的请求。如果我保留JSON.stringify，您会收到一个非常奇怪的请求，其中充满了转义字符 (%XX)。很抱歉，但我认为问题出在服务器端，而不是 ExtJS。

@Izhaki 在我看来，这正是我的问题：在简单的 Ajax 调用上使用 JSON.stringify 效果很好（请求看起来应该如此），但与商店一起使用时看起来很糟糕。为什么？删除 JSON.stringify 不是一种选择。

【参考方案1】：

我为商店使用以下代理配置（ExtJS v6.5.2）：

proxy: 
    url: 'api/search',
    paramsAsJson: true,
    actionMethods: 
        read: 'POST'
    ,
    type: 'ajax',
    reader: type: 'json'
,

将参数作为 JSON 发送：

"page":1,"start":0,"limit":25

【参考方案2】：

看来又是一个 ExtJS 问题。

我在这里找到了一个修复：

http://www.sencha.com/forum/showthread.php?196194-Ajax-Store-Send-Params-as-JSON-Body