基于 Spring Boot 博客系统开发(二)

基于 Spring Boot 博客系统开发(二)

本系统是简易的个人博客系统开发,为了更加熟练地掌握SprIng Boot 框架及相关技术的使用。🌿🌿🌿
基于 Spring Boot 博客系统开发(一)👈👈

首页查询文章列表

后端代码

    @Autowiredprivate IArticleService articleService;@RequestMapping("/")public String home(Model model,@RequestParam(defaultValue = "1") Integer pageNum){PageHelper.startPage(pageNum,5);List<Article> articleList = articleService.list();PageInfo<Article> articlePage = new PageInfo<>(articleList);model.addAttribute("articlePage",articlePage);return "client/index";}

前端代码
文章列表模板

			<!-- 文章遍历并分页展示 --><article th:each="article:${articlePage.list}" class="am-g blog-entry-article"><div class="am-u-lg-6 am-u-md-12 am-u-sm-12 blog-entry-img"><img width="100%" class="am-u-sm-12" th:src="${'./user/img/rand/'+(article.id%25+1)+'.png'}"/></div><div class="am-u-lg-6 am-u-md-12 am-u-sm-12 blog-entry-text"><!-- 文章分类 --><span class="blog-color"style="font-size: 15px;"><a>默认分类</a></span><span>&nbsp;&nbsp;&nbsp;</span><!-- 发布时间 --><span style="font-size: 15px;" >发布于 [[${article.created}]]</span><h2><div><a style="color: #0f9ae0;font-size: 20px;" href="article.html" th:text="${article.title}">函数式接口</a></div></h2><!-- 文章摘要--><div style="font-size: 16px;" >   [[${article.content.substring(0,100)}]]......</div></div></article>

文章分页模板

        <!-- 文章分页信息 --><div class="am-pagination"><ol class="am-pagination"><li th:if="${!articlePage.isFirstPage}"  class="am-pagination-prev"><a  th:href="${'./?pageNum='+articlePage.prePage}">上一页</a></li><li th:class="${num==articlePage.pageNum?'current':''}" th:each="num:${articlePage.navigatepageNums}" ><a th:href="${'./?pageNum='+num}" th:text="${num}">1</a></li><li th:if="${!articlePage.isLastPage}" class="am-pagination-next"><a th:href="${'./?pageNum='+articlePage.nextPage}">下一页</a></li></ol></div>

实现效果

文章列表效果
在这里插入图片描述
文章分页效果
在这里插入图片描述

去除markdown、html标记,文章摘要处理

添加Markdown处理的依赖

 		<!-- Markdown处理html --><dependency><groupId>com.atlassian.commonmark</groupId><artifactId>commonmark</artifactId><version>0.11.0</version></dependency><!-- Markdown处理表格 --><dependency><groupId>com.atlassian.commonmark</groupId><artifactId>commonmark-ext-gfm-tables</artifactId><version>0.11.0</version></dependency><!-- 过滤emoji表情字符 --><dependency><groupId>com.vdurmont</groupId><artifactId>emoji-java</artifactId><version>4.0.0</version></dependency>

添加文本处理的工具类

import com.vdurmont.emoji.EmojiParser;
import org.apache.commons.lang3.StringUtils;
import org.commonmark.Extension;
import org.commonmark.ext.gfm.tables.TablesExtension;
import org.commonmark.node.Link;
import org.commonmark.node.Node;
import org.commonmark.parser.Parser;
import org.commonmark.renderer.html.AttributeProvider;
import org.commonmark.renderer.html.HtmlRenderer;
import org.springframework.stereotype.Component;import java.util.Arrays;
import java.util.List;
import java.util.Map;@Component
public class TextUtils {public static String intro(String markdown,int len) {String text = html2Text(md2Html(markdown));if (text.length() > len) {return text.substring(0, len)+"......";}return text;}/*** 去除md标记*/public static String md2Text(String markdown) {return html2Text(md2Html(markdown));}/*** 提取html中的文字*/public static String html2Text(String html) {if (StringUtils.isNotBlank(html)) {return html.replaceAll("(?s)<[^>]*>(\\s*<[^>]*>)*", "");}return "";}/*** Markdown转换为Html*/public static String md2Html(String markdown) {if (StringUtils.isBlank(markdown)) {return "";}List<Extension> extensions = Arrays.asList(TablesExtension.create());Parser parser = Parser.builder().extensions(extensions).build();Node document = parser.parse(markdown);HtmlRenderer renderer = HtmlRenderer.builder().attributeProviderFactory(context -> new LinkAttributeProvider()).extensions(extensions).build();String content = renderer.render(document);content = emoji(content);return content;}/*** :hugging 这种格式的字符转换为emoji表情*/public static String emoji(String value) {return EmojiParser.parseToUnicode(value);}private static class LinkAttributeProvider implements AttributeProvider {@Overridepublic void setAttributes(Node node, String tagName, Map<String, String> attributes) {if (node instanceof Link) {attributes.put("target", "_blank");}}}}

修改文章摘要模板,thymeleaf调用后台工具类方法使用@bean

 <!-- 文章摘要--><div style="font-size: 16px;"  >[[${@textUtils.intro(article.content,100)}]]</div>

最终实现效果

去除了markdown、html标记符号
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/3618.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【DataGrip】导出导入迁移数据库表

文章目录 前言迁移表结构导出表结构导入表结构 迁移表数据导出表数据导入表数据 前言 DataGrip导出数据库表结构跟表数据是分开的&#xff0c;所以需要分两个步骤来完成。 DataGrip版本&#xff1a;2024.1.1 DataGrip官方文档地址&#xff1a;https://www.jetbrains.com/help/d…

第5章 全局大喇叭——详解广播机制

第5章 全局大喇叭——详解广播机制 如果你了解网络通信原理应该会知道&#xff0c;在一个IP网络范围中&#xff0c;最大的IP地址是被保留作为广播地址来使用的。 比如某个网络的IP范围是192.168.0.XXX&#xff0c;子网掩码是255.255.255.0&#xff0c;那么这个网络的广播地址…

用 JetBrains DataGrip 连接 Huawei openGauss

参考文章https://blog.itdevwu.com/post/1632/ DataGrip 连接GaussDB数据库的时候&#xff0c;会出现身份验证只能通过无验证或 pgpass 进行&#xff0c;而没有需要的用户名-密码的方式&#xff0c;也就无处填写 user 和 password。 而如果直接使用 DataGrip 自带的 PostgreSQ…

【Pytorch】(十四)C++ 加载TorchScript 模型

文章目录 &#xff08;十四&#xff09;C 加载TorchScript 模型Step 1: 将PyTorch模型转换为TorchScriptStep 2: 将TorchScript序列化为文件Step 3: C程序中加载TorchScript模型Step 4: C程序中运行TorchScript模型 【Pytorch】&#xff08;十三&#xff09;PyTorch模型部署: T…

09.JAVAEE之网络初识

1.网络 单机时代 >局域网时代 >广域网时代 >移动互联网时代 1.1 局域网LAN 局域网&#xff0c;即 Local Area Network&#xff0c;简称LAN。 Local 即标识了局域网是本地&#xff0c;局部组建的一种私有网络。 局域网内的主机之间能方便的进行网络通信&#xff0…

数据结构四:线性表之带头结点的单向循环链表的设计

前面两篇介绍了线性表的顺序和链式存储结构&#xff0c;其中链式存储结构为单向链表&#xff08;即一个方向的有限长度、不循环的链表&#xff09;&#xff0c;对于单链表&#xff0c;由于每个节点只存储了向后的结点的地址&#xff0c;到了尾巴结点就停止了向后链的操作。也就…

TGRS 2023.12基于矢量多边形和深度学习的高分辨率遥感影像土地覆盖变化检测

首先&#xff0c;采用增强型简单线性迭代聚类(SLIC)算法对同一区域的双时相图像进行分割。随后&#xff0c;使用多尺度提取、裁剪和绘制方法生成带注释的数据集。接下来&#xff0c;分使用时态前和时态后图像的数据集进行训练和测试&#xff0c;并使用双分类器交叉验证对训练集…

uniapp对uni.request()的封装以及使用

官方文档 uni.request(OBJECT) | uni-app官网 (dcloud.net.cn) uni.request参数 参数名说明url是写api地址的data是用来传值的对于 GET 方法&#xff0c;会将数据 转换为 query string。例如 { name: name, age: 18 } 转换后的结果是 namename&age18。对于 POST 方法且 …

k8s pod 无法启动一直ContainerCreating

情况如下&#xff0c;更新 pod 时&#xff0c;一直在ContainerCreating 查看详细信息如下 Failed to create pod sandbox: rpc error: code Unknown desc [failed to set up sandbox container “334d991a478b9640c66c67b46305122d7f0eefc98b2b4e671301f1981d9b9bc6” networ…

viewerjs在vue中实现点击图片预览、切换、缩放、拖拽、旋转等功能

1、下载依赖&#xff1a; npm i viewerjs 2、定义html结构 <template> <div><ul class"artBody"><li><img src"picture-1.jpg" alt"Picture 1"></li><li><img src"picture-2.jpg" alt&…

Find My头盔|苹果Find My技术与头盔结合,智能防丢,全球定位

头盔是保护头部的装具&#xff0c;是人们交通中不可或缺的工具。头盔具有保护头部、吸收冲击力、减少伤害风险、提高安全性、防止颅脑损伤等功效作用。头盔能够提供额外的保护&#xff0c;减少头部受伤的风险。在日常出行或进行高风险活动过程中&#xff0c;如骑自行车、骑行电…

pytest参数化数据驱动(数据库/execl/yaml)

常见的数据驱动 数据结构&#xff1a; 列表、字典、json串 文件&#xff1a; txt、csv、excel 数据库&#xff1a; 数据库链接 数据库提取 参数化&#xff1a; pytest.mark.parametrize() pytest.fixture()…

oracle 执行计划详解

执行计划是指示 Oracle 如何获取和过滤数据、产生最终的结果集&#xff0c;是影响SQL 语句执行性能的关键因素。在深入了解执行计划之前&#xff0c;首先需要知道执行计划是在什么时候产生的&#xff0c;以及如何让 SQL 引擎为语句生成执行划。 先了解 SQL 语句的处理执行过程…

RoadBEV:鸟瞰图中的道路表面重建

1. 代码地址 GitHub - ztsrxh/RoadBEV: Codes for RoadBEV: road surface reconstruction in Birds Eye View 2. 摘要 本文介绍了RoadBEV&#xff1a;鸟瞰图中的道路表面重建。道路表面条件&#xff08;特别是几何形状&#xff09;极大地影响了自动驾驶汽车的驾驶性能。基于…

FastGPT编译前端界面,并将前端界面映射到Docker容器中

建议在linux系统下编译 1、克隆代码 git clone https://github.com/labring/FastGPT 2、进入FastGPT目录&#xff0c;执行 npm install 3、进入projects/app目录&#xff0c;执行 npm run dev 此时会自动下载依赖包&#xff0c;这里如果执行npm install的话&#xff0c;…

某赛通电子文档安全管理系统 NavigationAjax SQL注入漏洞复现

0x01 免责声明 请勿利用文章内的相关技术从事非法测试&#xff0c;由于传播、利用此文所提供的信息而造成的任何直接或者间接的后果及损失&#xff0c;均由使用者本人负责&#xff0c;作者不为此承担任何责任。工具来自网络&#xff0c;安全性自测&#xff0c;如有侵权请联系删…

25计算机考研院校数据分析 | 浙江大学

浙江大学&#xff08;Zhejiang University&#xff09;&#xff0c;简称“浙大”&#xff0c;坐落于“人间天堂”杭州。前身是1897年创建的求是书院&#xff0c;是中国人自己最早创办的新式高等学校之一。 浙江大学由教育部直属、中央直管&#xff08;副部级建制&#xff09;&a…

rust中结构体的属性默认是不能修改的,要想修改可以有两种方式

Rust中结构体里面的属性默认是不支持修改的&#xff0c;而且默认不是pub的&#xff0c;要想修改的话&#xff0c;有两种方式&#xff0c;我以为和python里面的类似呢&#xff0c;但是还是需要一点技术含量的。如果想在引到外部修改&#xff0c;需要声明pub&#xff0c;如果想在…

(九)Pandas表格样式 学习简要笔记 #Python #CDA学习打卡

目录 一. Pandas表格样式 1&#xff09;举例数据 2&#xff09;字体颜色 3&#xff09;背景高亮 4&#xff09;极值背景高亮 &#xff08;a&#xff09;高亮最大值 highlight_max() &#xff08;b&#xff09;高亮最小值 highlight_min() &#xff08;c&#xff09;同时…

决策树分析及其在项目管理中的应用

决策树分析是一种分类学习方法&#xff0c;其主要用于解决分类和回归问题。在决策树中&#xff0c;每个内部节点表示一个属性上的测试&#xff0c;每个分支代表一个属性输出&#xff0c;而每个叶节点则代表类或类分布。通过从根节点到内部节点的路径&#xff0c;可以构建一系列…