错误报告 ExtJS 7.4.0 Ext.data.reader.Json

Posted 2023-03-28

【中文标题】错误报告 ExtJS 7.4.0 Ext.data.reader.Json

【英文标题】：Bug report ExtJS 7.4.0 Ext.data.reader.Json

【发布时间】：2021-10-13 08:06:42

【问题描述】：

第一次在这个帐户上发帖，多么令人兴奋。可悲的是，内容不那么令人兴奋。我在reader.json 函数getResponseData 中发现了一个非常简单的错误。

我想在我的应用程序中进行适当的错误处理，但意外地，我正在查询的服务器没有为我提供有效的 JSON。对于这个问题，读者有一个异常事件。但是，reader.json 将 XHR 上的 responseType 设置为 "json"。

正如详细的here，这会在XHR 上的response.response 中产生null 值：

当将 responseType 设置为特定值时，作者应确保服务器实际上正在发送与该格式兼容的响应。如果服务器返回的数据与设置的 responseType 不兼容，则 response 的值为 null。

getResponseData 想要避免工作，因此如果这是一个对象，则会返回 responseJson：

if (typeof response.responseJson === 'object') 
    return response.responseJson;

但是，在我使用的 Chrome 版本中，typeof null 的计算结果为 "object"。

我通过覆盖函数并将上面的第一行替换为if (Ext.isObject(response.responseJson)) 在我的应用程序中修复了这个问题，但我认为这应该在框架代码中修复。

我并不是真的在寻找答案，但对煎茶有某种反应会很好。

这个贴在这里，因为我浏览了https://***.blog/2019/10/30/why-sencha-is-moving-its-support-forums-to-stack-overflow/

版本信息

ExtJS 发布版本 7.4.0 Google Chrome 版本 92.0.4515.131（64 位）

编辑： 看来我的文字对我的问题不够明确，所以我将在此处添加一个示例。我有一家看起来类似这样的商店：

Ext.define('myCoolStore', 
    extend: 'Ext.data.Store',
    
    constructor: function(cfg) 
        var me = this;
        cfg = cfg || ;
        me.callParent([Ext.Object.merge(
            proxy: 
                type: 'ajax',
                withCredentials: true,
                reader: 
                    type: 'json',
                    rootProperty: 'results'
                ,
                listeners: 
                    exception: 
                        fn: me.onAjaxException,
                        scope: me
                    
                
            
        , cfg)]);
    ,

    onAjaxException: function(proxy, response, operation, eOpts) 
        // ..
    
);

现在，如果我使用myCoolStore.load()，我希望得到这样的服务器响应：

    "success": true,
    "deprecated": false,
    "results": [
        "id": "11730",
        "bericht_id": "167",
        "projekt_id": "1429",
        "lastedit": "2021-08-10 16:01:20",
        "lastedit_mitarbeiter_id": "182"
    ],
    "errors": [],
    "messages": [],
    "total": 1,
    "metaData": null

但是，服务器可能会出现错误并返回其他内容，即无效的 JSON。为了简单起见，假设有人忘记在他的 php ini 中打开 display_errors，答案看起来像这样

[..date..] [php7:notice] [pid ..pid..] [client ..ip..] PHP Notice:  Trying to get property 'myCoolProperty' of non-object in file.class.php on line 80, referer: ..myCoolSite..

    "success": true,
    "deprecated": false,
    "results": [
        "id": "11730",
        "bericht_id": "167",
        "projekt_id": "1429",
        "lastedit": "2021-08-10 16:01:20",
        "lastedit_mitarbeiter_id": "182"
    ],
    "errors": [],
    "messages": [],
    "total": 1,
    "metaData": null

reader.json的默认行为在这里不会设置异常，因为XHR将无法解析这个，导致reponseJson变成null，这将通过typeof-check。

【参考方案1】：

根据RFC7159 规范，null 是一个有效的 JSON 值：

JSON 值必须是对象、数组、数字或字符串，或其中之一 以下三个字面名称：

假空真

所以我认为这是预期的行为，而不是错误。如果您想自定义处理响应的方式，可以尝试以下两种方法之一。

1.定义全局请求异常处理程序

在您的Application.js 中执行类似的操作：

Ext.define('MyApp.Application', 
    extend: 'Ext.app.Application',
    name: 'MyApp',
    launch: function () 
        const me = this;
        Ext.Ajax.on('requestexception', me.onRequestException);
    ,
    onRequestException: function (conn, response, options, eOpts) 
        // this will run on every error during request (timeout, abort, 4xx, 5xx etc.)
        // for example Ext.isEmpty(response.responseJson) will result true on null value
        // add a breakpoint here and look what is in the variables in your case
    
);

2。创建自定义阅读器以拦截响应的转换方式

这样定义阅读器：

Ext.define('MyApp.data.reader.RestJson', 
    extend: 'Ext.data.reader.Json',
    alias: 'reader.myreader',
    getResponseData: function (response) 
        // evalutate here with debugger what you have in
        // response and do the conversion you'd like
        return something;
    
);

并在需要时使用此阅读器：

Ext.create('Ext.data.Store', 
    model: 'MyModel',
    proxy: 
        type: 'rest',
        url : 'myurl',
        reader: 
            type: 'myreader'
        
    
);

【讨论】：

感谢您的回复，但您在此处略有遗漏。为了更明确，我在帖子中添加了一个示例。 null 可能是有效的 JSON，但我担心实际上无效的 JSON，XHR 将评估为 null。 reader.json 忽略此错误状态，因为它会尝试保存工作。

@FrankMetis 我创建了一个测试。我从 API 端点返回 (((())，这是对 ExtJS 的无效 JSON。正如我在答案中所写，我添加了一个自定义阅读器。在getResponseData 函数中，response.responseJson 仍然是(((())，因为它还没有被解码。所以你可以在try-catch块中使用Ext.decode(response.responseJson)，然后你可以拦截无效的JSON，并在有效时返回解码。