金蝶BOS开发工程师基础认证培训Web框架

金蝶BOSWeb框架金蝶软件（中国）有限公司资冰冰目录总体架构JSFFaceletsExtAOMWAFWeb开发调试总体架构金蝶开发平台基于aom开发，aom的底层技术为JSF，表现层采用ext和FaceletsJSF是什么JavaServerFaces(JSF,或者“Faces”)是一个构建JavaWeb应用的UI框架；它基于Java社区流程(JCP)开发，并且成为J2EE的一个组成部分。Faces的一个主要目标是为JavaWeb应用开发领域带来RAD风格的应用开发，就像MicrosoftVisualBasic和BorlandDelphi一样。JSF提供一系列标准部件(按钮、超链接、复选框等等)，一个创建定制组件的模型，以及在服务器端处理客户端产生事件的方式，并且有良好的工具支持。你可以同步UI组件和相关对象的值，而不必编辑太多令人生厌的代码。所有的JSF应用都构建于ServletAPI之上，使用HTTP进行通信，并且使用JSP.之类的显示技术JSF与Struts区别JSF包含什么JSF生命周期JSF生命周期构建复原组件树视图（RestoreViewPhase）JSF组件树用来构建和维护页的状态和事件。对于每个会话，将会构建一次树，并且当用户返回到该页时复用该树。在此阶段的末尾，当前请求的FacesContext实例的根属性反映由先前的“Faces响应”生成的视图的已保存配置（如果有的话）。JSF生命周期应用请求值请求处理生命周期这一阶段的目的是使当前请求中包括的信息更新各组件的当前值（如参数、标题和cookie）更新到相应组件树中的每个组件。从这里我们可以看到，从客户端发过来的请求是么种意义上的纯文本信息，而UI组件对应的是java实体，这里必然就存在了数据格式转换的问题。所以，在整个生命周期中，这个地方就成了数据转换发生的特定阶段（如：数据、日期显示格式）。JSF生命周期处理验证为保证上一个阶段的数据正确，特定抽取了这个阶段作为数据校验。在这里作为创建此请求的视图的一部分，可以为每个组件注册零个或多个验证器实例。另外，组件类自身也可以在它们的validate()方法中实现验证逻辑。在此阶段的末尾，会完成所有配置的验证。JSF生命周期更新模型值如果到达了请求处理生命周期的这一阶段，就意味着入局请求根据所执行的验证在语法和语义上都是有效的，且组件树中每一组件的本地值都已被更新，这一阶段主要通过调用组建树的每个UI组件的processUpdates（）方法，递归更新每个组件树对应的应用程序的模型数据JSF生命周期调用应用程序如之前构建复原视图时所述，如果当前请求的视图是根据先前请求保存的状态信息重新构造的，则JSF实现就能够确保通过在此Web应用程序的“应用程序”对象上调用getActionListener。JSF生命周期呈现响应此阶段同时完成两项任务：使响应呈示给客户机，以及使响应的状态得到保存以供后续请求处理之用。在一个阶段中同时处理这两项任务的原因是在JSP应用程序中呈示响应的行为会导致在呈示页面时构建视图。因此，要在视图的状态被呈示给客户机之后才能保存该状态。为什么要选用JSF对于RAD工具的四个层次，JavaServerFaces定义了其中3个：一个基础组件架构，一个标准的UI部件集，以及一个应用基础架构。JSF的组件架构定义了一个通用的方式来建立UI部件JavaServerFaces有一个特定的目标：使web开发更快更容易。它允许开发人员以组件，事件，BackingBean以及它们之间的交互来进行思考，而不是基于请求，响应和标记。换句话说，它掩盖了Web开发的大量的复杂性，使开发人员能够集中于他们最擅长的事情：开发应用系统。典型例子Hello，worldFaceletsFacelets非常适合JSF，专为JSF设计的视图技术Facelets是用来建立JSF应用程序时的一个可供选择的表现层技术。Facelets提供了一个强有力的模板化系统，让你使用HTML样式的模板来定义JSF的表现层，减少了组件整合进表现层时候冗余的代码，而不需要一个web容器FaceletsFacelets有以下吸引人的特性：模板化（像Tiles）复合组件定制的逻辑标记表达式语言对设计师友好的页面开发创建组件库用Facelets进行模板化（定义模版）创建layout.xhtml页面。定义Facelet的命名空间，导入对Facelets的使用。用ui:insert标记定义页面的逻辑区域。用纯文本和ui:include标记定义合理的默认值用Facelets进行模板化（使用模版）当页面调用布局模板时，需要指定模板的位置使用ui:composition标记。为了把参数传递给模板，要使用ui:define标记，它是ui:composition标记的子元素复合组件不要重复自己

Facelets把它的精华放在复合组件上复合组件的创建创建Facelets标记库。在web.xml中声明标记库。用命名空间导入标记文件ExtJsExtJS可以用来开发RIA也即富客户端的AJAX应用，是一个用javascript写的，主要用于创建前端用户界面，是一个与后台技术无关的前端ajax框架。因此，可以把ExtJS用在.Net、Java、Php等各种开发语言开发的应用中ExtJS由一系列的类库组成，一旦页面成功加载了ExtJS库后，我们就可以在页面中通过javascript调用ExtJS的类及控件来实现需要的功能EXTJSExtJS的类库由以下几部分组成底层API(core)：底层API中提供了对DOM操作、查询的封装、事件处理、DOM查询器等基础的功能。其它控件都是建立在这些底层api的基础上，底层api位于源代码目录的core子目录中，包括DomHelper.js、Element.js等文件Extjs控件(widgets)：控件是指可以直接在页面中创建的可视化组件，比如面板、选项板、表格、树、窗口、菜单、工具栏、按钮等等，在我们的应用程序中可以直接通过应用这些控件来实现友好、交互性强的应用程序的UI。控件位于源代码目录的widgets子目录中ExtJs实用工具Utils：Ext提供了很多的实用工具，可以方便我们实现如数据内容格式化、JSON数据解码或反解码、对Date、Array、发送Ajax请求、Cookie管理、CSS管理等扩展等功能ExtJs组件Ext组件是由Component类定义，每一种组件都有一个指定的xtype属性值，通过该值可以得到一个组件的类型或者是定义一个指定类型的组件。组件体系ExtJs组件使用组件可以直接通过new关键子来创建，比如控件一个窗口，使用newExt.Window()，创建一个表格则使用newExt.GridPanel()组件的构造函数中一般都可以包含一个对象，这个对象包含创建组件所需要的配置属性及值，组件根据构造函数中的参数属性值来初始化组件ExtJs组件每一个组件除了继承基类中的配置属性以外，还会根据需要增加自己的配置属性，另外子类中有的时候还会把父类的一些配置属性的含义及用途重新定义。学习及使用ExtJS，其中最关键的是掌握ExtJS中的各个组件的配置属性及具体的含义/deploy/dev/docs/AOMAOM：ApusicOperaMask，金蝶中间件公司的Web开发框架AOM完整实现了JSF1.2规范，同时，对JSF1.2规范做了大量扩充，主要有AJAX支持、IoVC编程模型AOM架构图AOM对Web组件的扩展标准的JSF提供了与HTML元素一一对应的Web组件，标准的JSFWeb组件基本上不能满足业务开发要求AOM在此基础上提供了一套基于ExtJS的RichComponents，根据ExtJS所提供的客户端组件模型，提供了相应的服务器端组件模型、事件和组件渲染器，服务器端组件模型可以被复用，与具体的组件表现形式无关。而组件的渲染器可以自行以替换的方式进行扩展AOM对Web组件的扩展组件使用方式<w:textFieldbinding="#{***ListBean.number}"value=""/><w:buttonid=“btnAddNew”value=“新增" actionBinding="#{***ListBean.addNewAction}"/>通过指定控件属性jsvar,可以用extjsapi在页面访问/help/index.jsp?topic=/org.operamasks.docs/output/eclipse/index.htmlAOM约定优于配置目前主流的一些框架如（Struts和spring）通过很多配置实现对象的依赖注入AOM中通过约定优于配置的规则，实现对象的注入AOM数据校验简单校验Annotation：@Required客户端校验<w:formid=“form1"clientValidate="true">自定义校验完整上下文校验

AOMJSF生命周期拦截默认提供@BeforePhase、@AfterPhase的标注式拦截其他生命周期可扩展AOMMBean编程模型AOM对标准JSF的ManagedBean进行了扩展：声明式定义ManagedBeanAOM提供了@ManagedBean、@ManagedProperty等一系列标签，可以使用这些标签来以声明方式定义ManagedBean通过@Inject注入其他ManagedBean

AOMIOVCIoVC——“InversionofView-Control”，即“视图控制反转”传统的JSF编程模式传统方式的JSF设计中，UI所展现出来的数据通常位于ManagedBean中，UI上需要与用户交互的行为（Action）也定义在ManagedBean中，在UI中通过EL表达式，将每个组件与ManagedBean中所持有的数据绑定起来。如：<h:outputTextvalue="#{DemoBean.clickText}"/><h:commandButtonaction="#{DemoBean.action}"/>这是以视图为控制导向的一种设计模式，视图必须知道其所要绑定的ManagedBean及其属性和行为，这在一定程度上限制了UI的重用。AOMIOVCIoVC定义了一系列的标注用于将Model与View上的元素对应，开发者通过在Model上声明这种对应关系，可以将视图上的元素与Model中的属性和方法对应起来在IoVC编程模式下，组件只需简单的声明id属性即可与Model进行关联WAFWAFwebapplicationframeworkWAF作用Web开发平台的核心职能类似GUI框架，是EASWeb产品开发的基础平台，跟GUI应用框架共用EASWeb服务端组件，协同BOS框架和业务模型(BIM)实现模型驱动架构(MDA)。它提供统一的业务开发模型，简化开发逻辑，形成一致的开发模式，最大限度实现代码的重用机制WAFWAF有什么

1.web应用框架体系为业务单据提供复用体系2.UI通用处理如RPC交互、数据绑定、异常处理、通用查询等3.业务服务调用如权限控制、BOTP、工作流等4.某些控件如F7,枚举框，多语言控件，LabelContainer等web应用框架体系序时簿Waf序时簿列表界面（ListWinlet）ManagedBean从ListBean继承，请实现如下方法：getQueryPK()要求返回查询当前列表数据结果的QueryPKgetEditBeanName()要求返回列表对象对应的编辑界面的ManagedBean的名称getEditUrl()要求返回列表对象对应的编辑界面的UrlgetBizInterface()类似编辑界面的同样接口实现。该业务接口的获取可以通过注入方式实现WAF@IBOSBizCtrl标签本注释型负责对BOSIBizCtrl（IBOSObject以及FunctionEJB接口对象）进行统一的注入控制,以及屏蔽与BOS服务端交互的复杂性例如：@IBOSBizCtrl

privateIPurReqservice;Waf序时簿模版templates/list-templates.xhtml定义了列表界面的布局模板，业务单据的列表界面视图从此模板继承，并提供相应的模板内容实现具体使用可以参照Facelets章节Waf序时簿组件WEB-INF/components/billList-toolbar.xhtml封装了单据列表界面工具条部分的内容，提供了标准的操作按钮以及统一的Action绑定，相关业务使用此组件时只需设置组件的beanName属性即可例子：<f:viewxmlns:biz=/jsf/biz renderKitId="AJAX"> <ui:definename="toolbar"><biz:billListToolbarbeanName="#{mydemo.PurReqListBean}"> </biz:billListToolbar></ui:define>Waf序时簿组件WEB-INF/components/baseList-toolbar.xhtml

封装了基础资料列表界面工具条部分的内容，提供了标准的操作按钮以及统一的Action绑定，相关业务使用此组件时只需设置组件的beanName属性即可例子：<f:view

xmlns:biz=http:///jsf/biz

renderKitId="AJAX"> <ui:definename="toolbar"><biz:baseListToolbar

beanName="#{com.kingdee.demo.CurrencyListBean}"> </biz:baseListToolbar> </ui:define>Waf序时簿组件WEB-INF/components/inner-window.xhtml封装了列表界面跟其他页面进行Ajax交互的载体，支持UIWindow的弹出框（适用于通用过滤等），也支持其他通过javascript脚本弹出的对话框或新窗口（例如编辑界面或BOTP转换界面等）例子：<f:viewxmlns:biz=/jsf/biz

renderKitId="AJAX"> <ui:definename="inner-window">

<biz:innerWindowbeanName="#{mydemo.PurReqListBean}"> </biz:innerWindow>

</ui:define>Waf编辑界面类图

Waf编辑界面编辑界面（EditWinlet）ManagedBean从EditBean继承，请实现如下几个方法：createNewModel：新增业务对象getBizInterface：业务操作接口,该业务接口的获取可以通过注入方式实现,注入方式和ListBean类似可选实现：getSelectors获取所选单据VO属性，子类可覆盖实现Updatemodel单据若含有分录，更新分录modelWaf编辑界面模版templates/edit-templates.xhtml定义了编辑界面的布局模板，业务单据的编辑界面视图从此模板继承，并提供相应的模板内容实现

Waf编辑界面组件WEB-INF/components/billEdit-actions.xhtml封装了编辑界面下方按钮部分的内容，提供了标准的操作按钮以及统一的Action绑定，相关业务使用此组件时只需设置组件的beanName属性即可例子:<f:viewxmlns:biz=/jsf/biz

renderKitId="AJAX"><ui:definename="actions"> <divclass="kd-panel-btns-right"><biz:billEditActionsbeanName="#{mydemo.PurReqEditBean}"></biz:billEditActions> </div></ui:define>Waf编辑界面组件WEB-INF/components/billEntry-actions.xhtml 封装了分录的基本操作以及统一的Action绑定，相关业务使用此组件时只需设置组件的beanName属性即可例子：<f:viewxmlns:biz=/jsf/biz

renderKitId="AJAX"><ui:definename="entry>"><divclass="kd-panel-btns-right"><biz:billEntryActionsbeanName="#{mydemo.PurReqEditBean}" entryBeanName="#{mydemo.PurReqEntryBean}"> </biz:billEntryActions></div> </ui:define>Waf编辑界面组件WEB-INF/components/billEdit-toolbar.xhtml封装了单据与其他单据相关常用功能的操作及Action绑定，例如上一个单据、下一个单据、单据转换等，相关业务使用此组件时只需设置组件的beanName属性即可Waf编辑界面组件WEB-INF/components/billEdit-actions.xhtml封装了编辑界面下方按钮部分的内容，提供了标准的操作按钮以及统一的Action绑定，相关业务使用此组件时只需设置组件的beanName属性即可例子:<f:viewxmlns:biz=/jsf/biz

renderKitId="AJAX"><ui:definename="actions"> <divclass="kd-panel-btns-right"><biz:billEditActionsbeanName="#{mydemo.PurReqEditBean}"></biz:billEditActions> </div></ui:define>WafUI通用处理数据绑定JSF体系本身提供了完善的数据绑定功能，不需要类似GUI的loadFields及storeFields等自己处理。对于一些特定类型的属性绑定，框架提供常用的Converter处理，包括IObjectValueConverter、BOSUUidConverter、DataTimeConverter等。支持EL表达式；可以绑定简单数据类型（string,int,float等）；可以通过数据类型转换器绑定复杂数据类型（任意数据类型）；支持表格、F7的数据绑定；WafUI通用处理多语言处理服务端多语言处理Web框架基类BaseBean提供了getResoureText(Stringkey)方法，从文件名等于类名的多语言文件中获取多语言文本；com.kingdee.bos.waf.resource.Resources提供了getText(Stringbundle,Stringkey)方式更加灵活的获取多语言信息。客户端JSF视图标签多语言处理通过EL表达式获取多语言信息：#{messages[‘资源键’]}客户端javascript脚本多语言处理对于jsp视图，通过扩展jsp的TagSupport，实现把服务端资源文件动态生成客户端javascript多语言脚本数组，然后在js脚本中通过操作此数据来获取相应的多语言信息；对于facelet视图，需要通过扩展TagHandler来实现jsp一样的标签功能，对于视图部分使用上对开发者是一致的。 用法：在JSF视图中申明 <kd:jsMessageBundlejsVar="resource"resourceName="#{myBean.resourceName}“locale=“#{myBean.locale}”/>，然后就可以在javascript中使用resource[“key”]即可获取对应的多语言字符。WafUI通用处理应用上下文WafUI通用处理异常处理HTTP错误异常包括用户访问的url不存在、会话失效、访问拒绝等，框架统一拦截，导航到统一的友好页面系统异常包括数据库取数出错、代码运行空指针等，框架统一拦截，如果是ajax请求，弹出错误提示框；如果非ajax请求，导航到统一页面用户异常主要是便于开发人员把自己认为的异常逻辑或者在应用中出现的问题展现出来，框架统一拦截处理，异常处理方式跟上面“系统异常”处理一样WafUI通用处理通用过滤通用过滤默认过滤只需要在XXXListBean实现getQueryPK()即可自定义过滤页面提供一个继承monquery.UserQueryBean的ManagedBean，假如为MyUserQueryBean，同时还有相应的Facelets视图，myUserQuery.xhtml；在序时簿ManagedBean里，覆盖getUserQueryView()方法，返回上面的Facelets视图路径，例如：@Override protectedStringgetUserQueryView(){

return"/mydemo/myUserQuery.xhtml";}Waf业务服务调用单据套打框架已经提供默认实现，用户只需要定义套打模板即可通过导出PDF方式实现网络互斥数据互斥避免同时编辑同一张单据日志框架默认已经提供，业务开发无需编码色彩方案目前支持蓝、绿、红、橙四种色彩方案，默认蓝色支持扩展（增加相应的色彩方案目录结构）Waf业务服务调用—权限权限控制页面访问权限页面按钮权限Waf业务服务调用—编码规则应用编码规则服务定义相关编码规则，然后再Web单据里直接根据规则自动生成编码Waf业务服务调用—工作流单据的提交及工作流审批Waf业务服务调用—工作流Waf业务服务调用—Botp配置BOTP规则Waf业务服务调用—Botp在费用申请单通过[关联生成]操作完成费用报销单的生成Waf控件F7<kd:promptBox>容器控件<kd:container>复合控件<kd:labelContainer>枚举控件<kd:enumCombo>多语言控件<kd:multiLangBox>Waf控件F7主要属性：queryInfo：定义queryviewUrl属性定义打开自定义url,不写将使用通用f7界面。diaplayFormat:'$name$'F7默认显示效果editFormat:'$number$'F7编辑时效果commitFormat:'$number$'popWidth:打开窗口宽popHeight:打开窗口高muti:是否为多选模式store：绑定后台默认的数据集合，用于回填编辑table页面cu:是否cu过滤orgType：对应的组织类型filterInfo：缺省的过滤条件permItemName：缺省绑定的权限项Waf控件F7F7修改后如果需要触发服务端事件，可以通过ajaxaction，直接绑定datachanged属性的el表达式<kd:promptBoxvalue="#{mydemo.PurReqEditBean.model.currency}"queryInfo="com.kingdee.eas.basedata.assistant.app.CurrencyQuery"><ajax:actionevent="datachanged"action="#{mydemo.PurReqEntryBean.removeRow}"/></kd:promptBox>F7修改后如果需要触发客户端事件<kd:promptBoxjsvar=”F7”value="#{mydemo.PurReqEditBean.model.currency}"queryInfo="com.kingdee.eas.basedata.assistant.app.CurrencyQuery"></kd:promptBox>可自行添加javascript脚本实现：Ext.onReady(function(){ F7.on("datachanged",fu