js构建ui的统一异常处理方案(三)

笔者之前分析了如何实现js的责任链异常处理的方法,通过promise这个异步模型,我们能够对同步方法和异步方法的两种情况,均可以实现责任链模式。有了这些武器,我们就可以开始设计ui的统一异常处理方案了。

1.统一异常处理方案

这里所谓统一异常处理方案,其实就是指对那些底层无法处理的,一层层抛到了边界类的异常,在边界类中根据异常的不同类型,做出不同处理方案的处理策略。为了能在边界类中对异常类型做出判断,我们需要将常用的异常类型定义出来,再将原始异常包装为这些系统内部定义的异常类型。所以,整个统一处理方案的需求大致有如下几点:

  1. 异常处理必须是责任链模式,最终将底层不能处理的异常抛到边界类上。
  2. 需要对原始异常包装系统异常,将其封装为我们指定的系统。
  3. 系统异常封装过程需要业务代码解耦,方便以后对其扩展。
  4. 边界类中的统一异常处理能够对与不同的系统异常,需要采用的不同的处理策略。
  5. 系统异常和处理策略是可增加的。
  6. 系统异常必须包含错误的堆栈调用信息,方便调试时找出错误。

这种统一处理异常的方案,我们在服务器端开发经常用到的,客户端往往不需要实现这种复杂的异常处理方案。但是随着前后台完全解耦,尤其是spa应用的但是,前端现在越来越复杂。而系统复杂的同时,出现异常的概率和异常处理的难度也在增加,所以统一异常处理同样适于用客户端,即我们的ui页面。

2.统一的ui异常处理方案

如果后端的异常处理核心是记录日志,那么ui的异常处理核心在于向用户响应。不同的错误给用户的响应也应该是不一样的,我们需要分析出常出现的异常,并为其设计出处理策略,这才是ui异常处理方案的核心。

对于客户端(即ui)来说,通常是采取mvc模式设计的,或者是近来开始流行的mvvm。无论是哪一种,都有controllor的概念,controllor注意需要完成两个任务:

1.初始化ui:这个过程一旦出现异常,整个ui的业务逻辑都无法正常进行。处理起来往往比较棘手,通常是返回之前的ui或者是直接退出系统都有可能。

2.响应视图控件的事件:通常在事件中,通过调用底层提供的service方法,和后台服务器异步请求,或者本身就是完成一个前端交互动作(例如点击按钮,弹出一个对话框)。如果是前端交互动作通常是一个事件衔接另一个事件,一旦一个事件出现异常往往很难难有合适的处理方案。但是,如果把这些事件看成是一个异步方法就衔接起来就简单多了,只在第一个用户事件中视为调用的发起者,后续操作均看成是异步调用。

所以,需要统一做异常处理的地方,就是controllor执行页面初始化的过程,以及controllor对一个用户用例过程中的第一个事件。

同时我们还需分析一下我们需要封装哪些系统异常,因为我们需要根据其类型做出不同策略的异常处理方案的。常见的系统异常应有如下几种:

异常名称 异常描述 处理方案
初始化异常 初始化过程中出现的异常
异常需要告诉系统他的严重级别,因此初始化过程中一旦发生异常,可能并不影响其他模块,可能需要返回上一级页面,可能整个系统都不能再正常运。根据这种异常的严重程度,统一异常处理才能使用不同的处理策略。

用户取消异常
在一个完整的交互用例中,用户取消了继续完成此交互过程而发生的异常


这种异常我们开发时候非常常见,例如用用点击新建“按钮”,跳转到新建页面,填写了若干信息后点击又“取消”按钮,这时后续的一些列业务(如表单校验、提交)都应该终止,同时应该返回之前的页面。所以对于这种异常,处理方案就是返回初始装态,然后什么也不做。

网络异常 在向服务器请求过程中出现的异常 对于这种异常给出一个网络请求错误的提示即可,当然如果是移动的设备,也可以给出跳转打到打开网络设置的界面的连接,让用户重新设置网络配置。
服务器端异常 向服务器请求的时候,服务器端发生错误,不能正常完成相应,也就是500或者404错误 可能需要根据错误码做出不同的错误处理方案。需要注意的是服务器端的错误相应可能会携带错误的提示语句,所以统一异常处理需要能够将这种提示语句提示给用户
表单异常 用户填写表单时候,出现的校验错误 表单校验错误往往是属于视图层的事情,controllor往往不会处理这种错误。但是有一些复杂的校验工作,需要controllor配合完成,如果controllor校验失败,需要将错误传递给视图层,再由视图层去完成表单的错误提示。所以这个错误需要异常统一处理能够让视图可以配置视图自己的提示方案。
... 用据业务或客户端本身需求而设计出的异常 这种异常是开发人员动态扩展的异常,统一异常处理允许用户注册新的处理异常和处理策略

基本上这些异常便可以满足绝大多数客户端的需求。

3.和客户端应用的集成

统一异常处理从他的复杂程度就能看出,只用复杂的应用才需要使用这种方案,因此我们的页面必须是富客户端的应用,最好是spa的应用。spa应用指的是单页 Web 应用 (single-page application) ,即不会因为用户的操作而进行页面的重新加载或跳转,而是利用 JavaScript 动态的变换HTML的内容,从而实现UI与用户的交互。由于避免了页面的重新加载的web页面,这种应用的复杂程度远高于传统web页面。所以这种应用最适合采用统一的异常处理方案。

同时应用也应该是采取mvc(mvvm)的设计模式,能够将视图逻辑和系统业务很好的分离开来。另外系统的业务部分以及和服务器请求的部分尽量从controllor中分离出来,封装成service层,这样可以更加增加维护性并且可以实现复用,相同业务的代码尽量只写一遍。如果没有统一异常处理方案,这种分层的异常处理实现起来是非常困难的,而使用了统一异常处理,每一层只需要考虑他们自己应该做的事情,实现这种前端分层成了可能。

同时因为异步方法的存在,所以我们的service需要是使用promise将其封装的,每个方法最好通过名称就能看出他是异步的还是同步的。当一个方法我们无法确定他是异步还是同步的时候,我们应优先用promise封装,因为同步代码转变为异步比较容易,而异步代码是无法转变为同步代码的。

最后就是具体设计和代码实现了,请见下一章节。

时间: 2024-09-30 07:27:08

js构建ui的统一异常处理方案(三)的相关文章

js构建ui的统一异常处理方案(二)

上一篇文章,我分析了同步代码做异常处理是基于责任链模式,而通过try.catch等语句可以很容易地实现这种责任链模式.但是如果是异步调用,我们无法直接通过try.catch语句实现责任链模式,并且通过一个demo证明使用回调函数的方式去实现去实现异常处理的责任链模式是非常繁琐而且代码难以规范的,适用性不高.有没有什么方式能够使得异步js的责任链模式能够更加简单地实现呢? 对于这个问题,我们还是先回到js异步调用上,随着node和npm的普及,js异步调用也越来越被大家重视,于是乎npm引用了一个

如何构建日均千万PV Web站点 (三) Sharding

     其实国内许多大型网站为了应对日益复杂的业务场景,通过使用分而治之的手段将整个网站业务分成不同的产品线,比如说国内那些大型购物交易网站它们都将自己的网站首页.商铺.订单.买家.卖家等拆分不同的产品线,分归不同的业务团队负责: 集体到技术,也会根据产品线划分,将一个网站拆分成许多不同的应用,每个应用用独立部署维护.应用之间可以通过一个超链接建立关系(在首页上的导航链接每个都指向不同的应用地址),也可以通过消息队列进行数据分发,当然最多的还是通过访问同一个数据库存储系统来构成一个关联的完整系

Android进阶——构建UI布局的多种方式总结

引言 作为Android App,给人第一印象的就是用户界面(UI),简洁友好的UI,自然会给用户优秀的体验,自然很容易就得到用户的认可和赞许,这样App才变得真正的有价值.所以作为开发App的第一步,UI尤为重要,构建UI有很多种方式:xml静态布局.java动态代码.HTML构建(借助WebView)和第三方开源框架等. 一.构成UI的基本元素--View和ViewGroup概述 在Android中绝大部分的UI组件都是存放在android.widget包及其子包.android.view包

Android入门——构建UI布局的多种方式

引言 作为Android App,给人第一印象的就是用户界面(UI),简洁友好的UI,自然会给用户优秀的体验,自然很容易就得到用户的认可和赞许,这样App才变得真正的有价值.所以作为开发App的第一步,UI尤为重要,构建UI有很多种方式:xml静态布局.java动态代码.HTML构建(借助WebView)和第三方开源框架等. 一.构成UI的基本元素--View和ViewGroup概述 在Android中绝大部分的UI组件都是存放在android.widget包及其子包.android.view包

springboot + shiro 权限注解、请求乱码解决、统一异常处理

springboot + shiro 权限注解.请求乱码解决.统一异常处理 前篇 后台权限管理系统 相关: spring boot + mybatis + layui + shiro后台权限管理系统 springboot + shiro之登录人数限制.登录判断重定向.session时间设置 springboot + shiro 动态更新用户信息 基于前篇,新增功能: 新增shiro权限注解: 请求乱码问题解决: 统一异常处理. 源码已集成到项目中: github源码: https://githu

Spring全局异常处理的三种方式

在J2EE项目的开发中,不管是对底层的数据库操作过程,还是业务层的处理过程,还是控制层的处理过程,都不可避免会遇到各种可预知的.不可预知的异常需要处理.每个过程都单独处理异常,系统的代码耦合度高,工作量大且不好统一,维护的工作量也很大. 那么,能不能将所有类型的异常处理从各处理过程解耦出来,这样既保证了相关处理过程的功能较单一,也实现了异常信息的统一处理和维护?答案是肯定的.下面将介绍使用Spring MVC统一处理异常的解决和实现过程. 使用Spring MVC提供的SimpleMapping

011医疗项目-模块一:统一异常处理

010中提到了serivce层抛出异常,然后由Action层去捕获异常去处理,之前的写法是很繁琐的,所以我们这里统一异常处理. Java中进行异常处理: 一类是可预知的异常,程序员在编码时,主动抛出的异常,为了给用户操作提示,提前检查代码中可能存在异常. 通过开发中,采用自定义的异常类,每个异常类表示每一类异常信息.类需要继承Exception类. 本系统采用统一异常类,提供一个属性标识异常类. 另一类是不可预知异常,就是runtimeException异常,通过提高代码编写质量来避免此类异常,

MVC 增加统一异常处理机制

原文地址:http://www.cnblogs.com/leoo2sk/archive/2008/11/05/1326655.html 摘要      本文将对"MVC公告发布系统"的发布公告功能添加日志功能和异常处理功能,借此来讨论ASP.NET MVC中拦截器的使用方法.一个小难题      我们继续完善"MVC公告发布系统",这次,我们的需求是对公告发布功能添加日志记录能力,即在发布公告前,记录一次,在公告发布成功后,再记录一次.然后还要使得其具备异常处理,即

Grunt JS构建环境搭建以及使用入门

Grunt JS构建环境搭建以及使用入门 1.应用场景 一种自动化任务处理工具,对于日常的需求(代码规则检查.代码合并)可以实现自动化执行,只需要保留package.json和Gruntfile.js便能用一句代码行进行依赖下载. 2.搭建步骤 Grunt 依赖 Node.js 所以在安装之前确保你安装了 Node.js,然后开始安装 Grunt. 2.1安装 Node.js 进入nodejs官网https://nodejs.org/en/download/,根据当前机型选择对应版本下载安装后,