Skip to content

nForum 2.0 Front

Jump to bottom
xw2423 edited this page Nov 14, 2013 · 2 revisions

前端架构文档

nForum2.0前端采用backbone.js作为前端MVC框架，整体框架页面无刷新，即有一个固定的前端（front）页面，其中包括页面顶部（header），左侧菜单（left menu）和底部（footer）。一般来说，每次请求只改变页面的中间部分（body），页面的URL类似于 http://DOMAIN/BASE/#!LINK ，其中LINK为body的路径。前端核心代码位于 www/js/forum.lib.js 。

前端对象

  • BaseModel类：此类继承于Backbone.Model，主要包含ajax相关的成员变量，也就是说所有继承此类的model都可以由ajax来获取。

  • UserModel类：此类继承于BaseModel，表示一个用户，包含一个用户的成员变量，变量名与API的用户元数据一样。

  • SESSION对象：此对象为继承于UserModel类的实现，在前端初始化时（front_init）生成。它负责处理与当前用户相关的所有事物，包括登陆，退出，状态刷新。

  • BODY对象：此对象为Backbone.Model的实现，持有当前body部分的路径和内容，负责body部分的刷新和跳转

  • APP对象：此对象为Backbone.View的实现，负责html渲染，model事件处理，用户查询，加载提示等。

  • ROUTER对象，此对象为Backbone.Router的实现，负责无刷新的链接识别。

  • DIALOG对象，此对象BaseModel的实现，负责弹出层的实现，目前包括alertDialog（提示对话框），confirmDialog（确认对话框），formDialog（表单对话框），ajaxDialog（ajax提示框）

前端函数

  • String.GBKlength()和String.GBKsubstr(start,length)，用来处理GBK编码的字符串长度和字符串截取

  • $.random()，产生一个随机数

  • $.isIE(num)，是否为IE浏览器，num可选，为ie浏览器版本

  • $.isMultiFile()，浏览器是否支持html文件上传

  • $.isTop()，判断当前页面是否是顶级页面

  • $.sizeFormat()，显示可读的文件大小

前端跳转

由于前端的整体ajax化，nForum1.0的链接模式 http://DOMAIN/BASE/LINK ，将变为 http://DOMAIN/BASE/#!LINK ，对于原来的链接会自动跳转至新的链接，此功能由 app/plugins/Redirect.php 控制并且在 conf/redirectacl.php 中可以配置无需跳转的页面。

原进站页面在nForum2.0中改为BASE/index，如果访问前端框架为guest用户并且不含有#时，会跳转到/index页面，此功能由 conf/nforum.php 的$export['site']['preIndex']控制。

前端文件

nForum2.0使用手动方式打包css和javascript文件，打包的命令为

/path/to/nForum/bin/cli buildasset

运行后会在 www/css 和 www/js 目录下生成前端框架所需的css和javascript文件，文件名类似packXXXXX。你可以修改 app/shells/buildasset.php 文件来控制所要打包的文件内容。

SEO

一般来说，对于ajax网站spider是获取不到真实的网站内容的，所以nForum2.0针对spider可以输出网页的实际内容，在 conf/uaacl.php 中可以配置spider列表，在列表中的spider可以获取链接的实际内容以便SEO。

ajax格式

nForum2.0的ajax请求返回的对象一般含有如下属性：

  • ajax_st:表示此次ajax请求的状态，1为成功，0为失败

  • ajax_code:表示此次ajax请求的状态码

  • ajax_msg：表示此次ajax请求的状态信息(GBK编码)

nForum处理ajax

  1. nForum2.0使用以ajax_开头的action作为处理ajax的action，系统会自动检测其ajax请求的合法性。

  2. 在ajax的action中使用controller->set方法，分配给no_html_data值作为ajax响应数据，如$this->set('no_html_data', array('foo'=>'bar'));输出的json对象为为{foo:'bar',ajax_st:1,ajax_code:001,ajax_msg:''}

  3. 如果设置no_ajax_info为true，则ajax响应不会含有ajax_st,ajax_code,ajax_msg三个属性，如$this->set('no_ajax_info', true);

  4. controller->error()方法可以直接传入错误代码并产生相应的ajax响应,其ajax_st值为0，也可以单独设置ajax_st,ajax_code值，如果不设置ajax_st则默认ajax_st为1

  5. ajax响应的输出格式由请求的url后缀决定，目前nForum2.0支持xml和json的输出格式，比如 http://DOMAIN/BASE/user/ajax_session.json 将输出json格式的当前用户信息

  6. ajax请求是不会跳转至front界面的，所以不用在 conf/redirectacl.php 中配置

前端处理ajax

DIALOG对象提供ajaxDialog方法，传入json格式的ajax响应并显示相应的提示消息。

Clone this wiki locally