Extjs+SpringMVC原型—内容发布

在上篇文章所描述的基础功能,本章采用MVC实现一个轻量的内容发布。

基本原理

文章发布的三要素如下图所示:

  • 栏目——也称网站频道可以视为一个树状的网站内容逐层分类。一个栏目下包含很多文章,通常一个栏目下的文章采用相同的模版发布,以保持相同的展示形式和风格。
  • 文章——包括:题名、内容、作者等元数据的结构化内容。文章可以发布到一个或者多个栏目下。一篇文章绑定一个模版之后会形成一个唯一的URL。如果一篇文章绑定了多个模版,应当会形成多个URL。
  • 模版——负责内容的展示形式,绑定文章(本例中为数据库表Article中的一条记录),render出最终的页面效果。


    内容发布三要素

Model:数据库表及对应的Entity

  1. article表用于文章;
  2. tag表用于文章分类标签;
  3. attach表用于上传图片或者附件;

View:管理界面提供结构化数据维护,模版实现内容展示

网站栏目的管理

  • 栏目信息非常适合用json树描述,用json的好处是维护方便,而且可以直接提供给后台界面用于发布栏目的多选。

  • 用户选择发布的栏目之后,直接以简单的格式分隔存到一个文本字段即完成了文章发布,用户体验是不是够简单?

  • 当然如果业务要求对发布内容进行审查,默认的状态可以是预览,后期也可通过置顶设置调整文章在频道首页的位置。

  • 同时json定义也供后台java逻辑解析,以获得指定栏目对应的模版。


    网站栏目
  • 如果在该json中通过tpl指定了栏目模版,发布到该栏目的文章将使用指定模版,否则使用默认模版。

网站栏目json可指定栏目模版

模版

模版采用JSP EL或JSTL,只负责将传入的model在页面中进行展示,不含其他逻辑。
此处也曾犹豫是否引入模版组件,最终SpringSide作者的见解影响了我,模版引擎怎么说相对jsp来说也是小众,
JSP完全胜任模版引擎任务,如果不考虑前端工程师的偏好,没必要再引入其他模版引擎,增加程序员的麻烦和系统复杂度。
以下为模版中显示文章相关图片的代码片段:

<c:forEach items="${robjs}" var="ro">
    <c:choose>
        <c:when test="${ro.suffix =='jpg' || ro.suffix =='png' || ro.suffix =='jpeg' }">
            <figure class="figure">
              ![](/fopen?fp=${ro.path})
              <figcaption style="text-align:center;color:rgb(153, 153, 153);">${ro.title}</figcaption>
            </figure>   
            <p><br></p>
            <p>${ro.content}</p>
        </c:when>
    </c:choose>
</c:forEach>

Controller:三个java类

  1. CMSController用于将发布生成的url 映射为模版+数据;
  2. SecNode.java用于加载json节点到后端;
  3. CMSService.java封装具体的实现逻辑。

CMSController.java

采用SpringMVC的映射注解可以轻松将上述URL匹配到负责绑定模版和数据的处理逻辑。

    @RequestMapping(value = PATH_ARTICLE + "{id_tpl}", method = RequestMethod.GET)
    public String showDetailByTpl(@PathVariable("id_tpl") String id_tpl, Model model) {
        try {
            String[] prs = id_tpl.split("_");
            long id = Long.parseLong(prs[0]);
            Article obj = cmsService.getArticle(id);
            // TODO 检查status 状态, 只允许管理员预览
            model.addAttribute("obj", obj);
            String tpl;
            if (prs.length == 1) {
                tpl = TPL_DEFAULT;
            } else {
                tpl = prs[1];
            }
            // 根据频道绑定多个文章模版
            return "tpl" + PATH_ARTICLE + tpl;
        } catch (Exception e) {
            e.printStackTrace();
            return "error/404";
        }
    }

CMSService.java + SecNode.java 实现预览

java中解析json文件,获得指定栏目的文章模版。
基本思路如下:

  1. 定义与json节点对应的java类SecNode
  2. 利用ObjectMapper读取json文件并解析为SecNode[]
  3. 遍历SecNode[],建立栏目全路径名称对应的模版文件名,
    例如:用户中心#办理流程-> 1.jsp ; 政策法规->default.jsp
  4. 前台Ajax请求主键值1的文章,发布对应的URL
  5. 后台根据主键值从数据库提取Article对象,得到其发布栏目为:政策法规;用户中心#办理流程 两个栏目
  6. 根据栏目获得对应的模版,如果栏目在json节点通过tpl定义了模版,则采用指定模版,否则沿用父节点模版。
  7. 根据模版和文章id 按URL定义规则拼接出URL数组,返回前端
  8. 前端拿到URL数组之后,采用tab窗口打开对应的两个页面预览。

内容管理界面

支持点击修改附件名
内容管理界面

发布结果

由于模版也符合decorators.xml 定义的layout规则,所以最终呈现的详细页包含了网站的header和footer。

发布结果(局部截图)
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,835评论 4 364
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,598评论 1 295
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 109,569评论 0 244
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,159评论 0 213
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,533评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,710评论 1 222
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,923评论 2 313
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,674评论 0 203
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,421评论 1 246
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,622评论 2 245
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,115评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,428评论 2 254
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,114评论 3 238
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,097评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,875评论 0 197
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,753评论 2 276
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,649评论 2 271

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,100评论 18 139
  • 1. Java基础部分 基础部分的顺序:基本语法,类相关的语法,内部类的语法,继承相关的语法,异常的语法,线程的语...
    子非鱼_t_阅读 31,296评论 18 399
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 170,569评论 25 707
  • 基本概念 有限域(Finite Field) A finite field is a finite set on ...
    FlyingPenguin阅读 8,202评论 0 1
  • 一个人想要别人的关注,你说他想要收获的是什么呢?或许是认同感吧!
    稳重的呼吸阅读 100评论 0 0