extjs4 全局网络异常监听器

Posted

技术标签:

【中文标题】extjs4 全局网络异常监听器【英文标题】:extjs4 global network exception listener 【发布时间】:2012-07-24 07:50:55 【问题描述】:

我想写一个listener 来监听所有网络请求错误,像这样:

Ext.Ajax.on('requestexception', function(conn, response, options) 
    if (response.status === 555) 
        Ext.Msg.alert('test', 'test');
    
);

上面的代码只适用于通过Ext.Ajax.request()的请求,如何重写它以便它也适用于表单提交、url not found 错误等。

在服务器端,我有调度所有请求的 Spring MVC,如果有任何 error,则返回 555 的响应状态。

form.submit(
     url: dispatcher.getUrl('savePlanRequest'),
     //headers: 'Content-Type':'multipart/form-data; accept-charset=utf-8',
     scope: this,
     method: 'GET',
     params: 
         scan: scan_id,
         attachments: attachments_id,
         parcels: parcels_id
     ,
     success: function(form, action) 
         this.fireEvent('plansaved', this);
         Ext.Msg.alert(i18n.getMsg('success'), i18n.getMsg('gsip.view.plans.NewPlanForm.success_info'))
     ,
     failure: function(form, action) 
         console.log('failure');
         //Ext.Msg.alert(i18n.getMsg('failure'), action.result.msg);
     
 );

【问题讨论】:

你可以试试:Ext.override(Ext.data.Connection, onComplete : function(request) console.log( request ); this.callParent ( arguments ); ); 控制台仅记录成功的请求。在我的表单提交中,它进入表单提交失败子句并尝试解码 json。 对不起,我想我把你的问题弄错了。我假设您已经尝试过Ext.Ajax.on( 'requestcomplete', ...),但它没有用?您能否分享一下您如何提交表单的代码? 问题已更新。当会话超时时,每个服务器请求都会返回 555 的响应状态。问题是,如果发生这种情况,响应不是 json 格式的。我想全局捕获响应,然后根据状态重定向到登录页面。 如果我理解正确,你可以试试:Ext.override( Ext.form.action.Submit, handleResponse : function( response ) console.log( response ); this.callParent ( arguments ); ); 【参考方案1】:

这应该可行:

Ext.override( Ext.form.action.Submit,  
    handleResponse : function( response ) 

        var form = this.form,
            errorReader = form.errorReader,
            rs, errors, i, len, records;

        if (errorReader) 
             rs = errorReader.read(response);
             success = rs.success;
             // Do something if success is false
        

        this.callParent ( arguments ); 
    
);

查看the source code,了解我复制上述大部分代码的确切handleResponse() 方法。

【讨论】:

【参考方案2】:

恕我直言,您不需要覆盖任何内容。您可以在 Ext.Ajax 单例上放置一个侦听器,如下所述:

Override Ext.data.Connection - Best Practice

另一种选择是使用 Ext.util.Observable.observe() 函数,如下所述:

http://www.sencha.com/forum/showthread.php?172269-Global-connection-handler-for-500-404-403-response-codes

Ext.util.Observable.observe(Ext.data.Connection);

Ext.data.Connection.on('requestexception', function(conn, response, options, eOpts) 
    //...handle it
);

【讨论】:

以上是关于extjs4 全局网络异常监听器的主要内容,如果未能解决你的问题,请参考以下文章

Vue基础系列(四四)计算属性-监听器-过滤器-混入-插件-网络请求-全局组件

extjs4 在按钮单击而不是鼠标悬停时显示工具提示

EXTJS 4.1,网格行体 tpl 上的事件监听器

Extjs4.1 Grid-如何在 itemdblclick 函数中获取 cellIndex

前端监听服务端状态并返回状态怎么实现

如何在全局侦听器中实现小吃吧?