基于ruoyi框架实现的短链接生成管理系统(前后端分离)

本文涉及的产品
日志服务 SLS,月写入数据量 50GB 1个月
简介: 基于ruoyi框架实现的短链接生成管理系统(前后端分离)

一、为什么要开发短链接管理系统?有什么好处?

普通链接地址,也就是长链接地址,缺点就是太长,不便于传播。所以就衍生 出了短链接,具体好处如下:

  • 1、短链接更短,占用字符数更少,简短易用,易于传播;
  • 2、短链接可在各大平台传播,有效避免日常分享链接被其他平台屏蔽风险;
  • 3、短链接可实时统计用户数据,全景统计用户行为、偏好等数据;

二、技术栈说明

后端:springboot+mybatis+jwt+spring security

前端:vue

数据库:mysql

工具:navicat 、 idea

三、系统功能

系统用户分为普通用户和管理员

具体功能如下:

登录页面

首页

短链接生成页面

短链接管理页面

访问日志页面

统计面板页面:统计当前总连接数、统计所有连接今日产生的总点击量和总IP数、昨日产生的总点击量和总IP数、近七日总点击量和总IP数。

echarts统计图:统计操作系统饼图、统计浏览器饼图、统计访问量折线图

用户管理

角色管理

菜单管理等功能

四、页面功能说明

登录页面

系统首页展示了短链接的生成页面,用户可以输入将要缩短的长网址,点击生成按钮,后台会将短链接结果返回,并展示到输入框界面中。然后,用户就可以直接使用短链接来访问所需要的页面。

生成效果如下:

短链接管理页面

删除短链接

修改短链接

统计面板信息:点击 统计面板 菜单,后台系统会将用户的短链接相关信息,以卡片的形式展示出来。该页面主要是对短链接的访问量、短链接数量进行不同时间维度的统计。

当前总链接数统计详情:点击 当前总连接数 卡片 的查看详情按钮,会展示出系统中所有的短链接信息。

今日短链接访问量详情

点击 所有连接今日产生的总点击量 卡片 的查看详情按钮,系统会统计出今日所有的短链接访问量,包括 用户使用的浏览器、操作系统、登录时间、用户主机、短链接地址等信息。

今日短链接ip数统计

点击 所有短链接今日点击的总IP数 卡片 的查看详情按钮,系统会统计出今日所有的短链接访问的IP数量(去重之后的IP数量)。

昨日短链接访问量详情

点击 所有连接昨日产生的总点击量 卡片 的查看详情按钮,系统会统计出今日所有的短链接访问量,包括 用户使用的浏览器、操作系统、登录时间、用户主机、短链接地址等信息。

昨日短链接ip数统计

点击 所有短链接昨日点击的总IP数 卡片 的查看详情按钮,系统会统计出今日所有的短链接访问的IP数量(去重之后的IP数量)。

近七日短链接访问量详情

点击 所有连接过去七日产生的总点击量 卡片 的查看详情按钮,系统会统计出今日所有的短链接访问量,包括 用户使用的浏览器、操作系统、登录时间、用户主机、短链接地址等信息。

近七日短链接ip数统计

点击 所有短链接过去七日点击的总IP数 卡片 的查看详情按钮,系统会统计出今日所有的短链接访问的IP数量(去重之后的IP数量)。

访问日志

点击 访问日志 菜单,后台系统会将用户访问短链接的日志信息进行实时的记录,包括短链接,访问IP地址,浏览器类型,操作系统,访问时间等信息。

Echarts统计图

根据不同的维度,对用户访问短链接的信息进行统计和汇总

统计操作系统饼图

统计各个操作系统的访问次数。

统计浏览器饼图

统计各个浏览器的访问次数。

访问量折线图

统计各个时间段,用户的访问量大小

五、数据库

一共21张表

六、源码地址

https://download.csdn.net/download/weixin_43860634/88486987


相关实践学习
日志服务之使用Nginx模式采集日志
本文介绍如何通过日志服务控制台创建Nginx模式的Logtail配置快速采集Nginx日志并进行多维度分析。
相关文章
|
前端开发 小程序
宠物管理系统-前端小程序-后端web
宠物管理系统-前端小程序-后端web
209 0
|
6月前
|
SQL 前端开发 NoSQL
【若依】前后端分离版快速上手
【若依】前后端分离版快速上手
274 1
|
5月前
|
开发框架 移动开发 JavaScript
SpringCloud微服务实战——搭建企业级开发框架(四十七):【移动开发】整合uni-app搭建移动端快速开发框架-添加Axios并实现登录功能
在uni-app中,使用axios实现网络请求和登录功能涉及以下几个关键步骤: 1. **安装axios和axios-auth-refresh**: 在项目的`package.json`中添加axios和axios-auth-refresh依赖,可以通过HBuilderX的终端窗口运行`yarn add axios axios-auth-refresh`命令来安装。 2. **配置自定义常量**: 创建`project.config.js`文件,配置全局常量,如API基础URL、TenantId、APP_CLIENT_ID和APP_CLIENT_SECRET等。
217 60
|
3月前
|
NoSQL JavaScript 前端开发
SpringBoot+Vue实现校园二手系统。前后端分离技术【完整功能介绍+实现详情+源码】
文章介绍了如何使用SpringBoot和Vue实现一个校园二手系统,采用前后端分离技术。系统具备完整的功能,包括客户端和管理员端的界面设计、个人信息管理、商品浏览和交易、订单处理、公告发布等。技术栈包括Vue框架、ElementUI、SpringBoot、Mybatis-plus和Redis。文章还提供了部分源代码,展示了前后端的请求接口和Redis验证码功能实现,以及系统重构和模块化设计的一些思考。
SpringBoot+Vue实现校园二手系统。前后端分离技术【完整功能介绍+实现详情+源码】
|
3月前
|
开发框架 前端开发 JavaScript
基于SqlSugar的开发框架循序渐进介绍(30)-- 整合客户关系管理系统模块功能
基于SqlSugar的开发框架循序渐进介绍(30)-- 整合客户关系管理系统模块功能
|
5月前
|
前端开发 Java 应用服务中间件
|
前端开发 Java 应用服务中间件
【超详细】RuoYi 前后端分离版部署流程
部署前端(前端访问域名,跳转域名修改)、后端配置(配置文件),Nginx 配置文件详解,上传后部署需要的脚本。
3238 1
|
6月前
|
前端开发 NoSQL Java
1、若依(前后端分离)框架的使用
1、若依(前后端分离)框架的使用
332 0
|
6月前
|
前端开发 Java BI
基于Springboot+Vue开发前后端端分离农产品进销存系统
基于Springboot+Vue开发前后端端分离农产品进销存系统
|
6月前
|
Java
Ruoyi若依前后端一体项目整合cas单点登录
Ruoyi若依前后端一体项目整合cas单点登录
875 0