Coder Social home page Coder Social logo

wangyang1749 / cms-dev Goto Github PK

View Code? Open in Web Editor NEW
10.0 2.0 5.0 17.18 MB

内容(文章)管理、个人博客系统,实现全部页面静态化,采用spring boot、jpa、thymeleaf框架。支持markdown,支持latex公式,可以动态创建模板。

Home Page: http://www.bioinfo.online/

Java 32.09% JavaScript 40.59% HTML 8.34% CSS 15.91% SCSS 3.08%
cms blog

cms-dev's Introduction

本仓库不再维护, 迁移到: https://github.com/BioinfoFungi/cms-dev

一、内容(文章)管理系统介绍

本项目使用SpringBoot作为后端;使用thymeleaf作为模板引擎,实现全部页面静态化; 使用vue开发管理员界面。

二、技术概况

2.1 页面公共部分的处理

    private static  String pattern = "<!--#include file=\"(.*?)\"-->";
    private static String varPattern = "<!--\\{\\{(.*?)}}-->";

采用正则表达式匹配 <!--#include file="/components/header.html"-->,找到文件之后,读取替换。

这个插入语句是nginx的,所有将静态目录设置在nginx可以不通过服务器,直接访问静态页面

2.2 分页静态化的实现

    @GetMapping("/{categoryPath}/{categoryViewName}/page-{page}.html")
    public String articleListBy(HttpServletRequest request, @PathVariable("categoryPath") String categoryPath, @PathVariable("categoryViewName") String categoryViewName, @PathVariable("page") Integer page){
        File file = new File(CmsConst.WORK_DIR+"/html/"+categoryPath+"/"+categoryViewName+"/"+page+".html");
        String result = null;
        if(file.exists()){
            result = FileUtils.convert(file,request);
        }else {
            Category category = categoryService.findByViewName(categoryViewName);
            if (category!=null){
                String resultHtml = htmlService.convertArticleListBy(category,page);
               result =  FileUtils.convertByString(resultHtml,request);
            }
        }
        if (request!=null){
            return result;
        }
        System.out.println(categoryViewName);
        System.out.println(page);
        return  "Page is not found!";
    }

当第一次访问分页页面时,会生成其html页面。当第二次访问时,判断文件存在就直接文件返回。

在对文章增删改时会删除生成的分类列表缓存。

2.3 权限管理

三、项目部署

3.1 前提条件

  1. 本程序需要activemq61616端口在服务器运行,文章的静态化采用的是activemq完成的
  2. 需要将模板文件https://github.com/wangyang1749/cms-template.git拷贝在用户目录的cms下
  3. 根据配置文件,配置数据库

3.2 其他模块

  1. 使用vue实现的后界面,源码参考如下 https://github.com/wangyang1749/cms-admin.git

  2. 原生android调用api,项目地址如下(正在开发中) https://github.com/wangyang1749/cms-android.git

  • 前端静态化使用的模板文件

四、系统扩展

  1. 关于PDF的导出
  • 由于采用nodejspuppeteer模块, 因此服务器必须安装nodejs
  1. latex公式插入

五、更新记录

2020.3.23

  1. 更新文章和分类的关系变换为一对多(一篇文章只能在一个分类中)
  2. 新增栏目功能

2020.3.17

  1. 添加一键更新所有Category HTML功能
  2. 添加设置文章默认模板的功能

2020.3.9

  1. 实现导出文章PDF
  2. 删除本程序采用socket对nodejs渲染Katexmermaid的远程调用, 改为java调用本地命令的方式实现
  3. 将授权模块分离出来

2020.3.7

  1. 实现markdown添加图片包裹一层div
  2. 修复文章更新不能删除旧分类文章列表中的文章标题
  3. 增加重新生成所有文章Html功能

六、项目展示

  • 目前我已将本项目部署在自己的小型服务器里

http://www.bioinfo.online/

  • 后台界面
  • 静态化的前台界面

cms-dev's People

Contributors

wangyang1749 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

cms-dev's Issues

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.