本文介绍基于 Spring Boot 的 AI 智能评论审核与自动回复系统实现方案。系统分为前端、控制层、服务层和 AI 服务层，核心模块包括本地敏感词预筛选、AI 深度审核（支持多模态表情）、上下文感知自动回复、状态机管理和异步任务调度。采用双层审核提升效率，利用 Prompt 设计返回 JSON 判定结果，回复可配置风格（友好、专业、幽默）。通过 Spring @Async 与自定义线程池实现高并发下的非阻塞处理，并支持实时状态推送，最终实现低延迟、可扩展的评论安全与互动功能。

本项目实现了一个嵌入博客页面的 Web AI 对话机器人，能够读取文章内容并基于上下文进行精准问答。核心功能包括上下文智能问答、逐字打字机效果、暂停/继续、对话历史本地持久化、快捷预设问题以及响应式布局。前端采用原生 HTML5、CSS3、JavaScript，配合 Marked.js 解析 Markdown、Highlight.js 代码高亮、Font Awesome 图标；后端通过 RESTful API 调用 AI 服务，数据存储使用 LocalStorage。系统分为 UI 层、交互逻辑层、数据处理层和服务接口层，AI 生成流程由状态机管理（idle、thinking、generating、paused、completed）。关键技术难点在于打字机效果与增量 Markdown 渲染的同步、暂停状态的持久化以及多状态切换的稳定性，均通过增量渲染、历史记录标记和统一状态变量管理得到解决。

在博客底部“每日一句”板块添加英文音频播放功能。通过有道词典每日一句API获取 voice URL，后端提供 /api/daily-quote/voice 代理接口解决 CORS。前端新增圆形播放按钮，使用 HTML5 Audio 实现播放/暂停并通过 CSS 动画反馈状态，兼顾 PC 与移动端响应式布局。开发中解决了跨域、DOM 加载时机和移动端样式超出等问题，最终实现蓝‑粉切换、脉冲动画的交互效果，并总结了后端代理、Audio API 与响应式设计的实践经验。

本文介绍在 Web 项目中实现自定义图片 Emoji 的完整方案。通过统一的文件结构把 PNG 表情放在 `/static/img/emoji/`，以有意义的英文/拼音命名，并在 JavaScript 中维护路径与名称列表。核心函数使用正则 `\[:([a-zA-Z0-9_\-@]+):\]` 将 `[:表情名:]` 代码转换为 `<img>`，插入编辑器后再在提交前逆向替换回代码，实现纯文本存储。提供表情面板的 HTML、CSS 样式及交互逻辑，支持点击弹出、图片插入、面板关闭等基本功能。文中还给出懒加载、最近使用记录、分类展示等进阶优化思路，强调方案的可扩展、兼容性好且便于数据库查询。

本文介绍在 Spring Boot + Thymeleaf 项目中为博客文章详情页实现侧边栏的热门文章和最新文章功能。通过自定义 SQL 只查询必要字段，使用 Service 层 @Cacheable 缓存提升性能；在控制器一次获取列表后，利用 Java 8 Stream 按浏览量降序取前 5 条作为热门文章，直接取前 3 条作为最新文章。前端采用 Thymeleaf 渲染 HTML，CSS 使用 sticky 定位实现左侧固定，媒体查询在 PC 端显示侧边栏、移动端隐藏，并为排名前三提供颜色标识、标题截断等视觉效果。整体实现数据复用、响应式布局和性能优化。

本文介绍在个人博客中实现分享卡片的完整方案。通过 HTML Overlay 弹窗搭建结构，使用 Canvas 绘制卡片背景、标题、摘要、作者信息及二维码，并自定义文本自动换行函数解决 Canvas 不支持换行的问题。采用 qrcode.js 生成可扫描二维码，利用 Canvas toDataURL 实现图片保存。细化了配色、字体、视觉层次的 UI 设计，并通过媒体查询实现 PC 与移动端的响应式适配。文中还说明了获取文章数据、高清渲染、异步二维码生成和性能优化等关键实现细节，最终交付一个美观、易用且跨端兼容的博客分享卡片功能。