场景
SpringBoot+Vue+Openlayers实现地图上新增和编辑坐标并保存提交:
SpringBoot+Vue+Openlayers实现地图上新增和编辑坐标并保存提交_霸道流氓气质的博客-CSDN博客
开源流媒体服务器ZLMediaKit在Windows上运行、配置、按需拉流拉取摄像头rtsp视频流)并使用http-flv网页播放:
开源流媒体服务器ZLMediaKit在Windows上运行、配置、按需拉流拉取摄像头rtsp视频流)并使用http-flv网页播放_srs按需拉流_霸道流氓气质的博客-CSDN博客
GeoServer简介、下载、配置启动、发布shapefile全流程(图文实践):
GeoServer简介、下载、配置启动、发布shapefile全流程(图文实践)_霸道流氓气质的博客-CSDN博客
若依前后端分离版手把手教你本地搭建环境并运行项目:
若依前后端分离版手把手教你本地搭建环境并运行项目_ruoyi本地调式_霸道流氓气质的博客-CSDN博客
结合以上流程,需要实现对摄像头名称、在地图上位置的增删改查以及摄像头的预览功能。
注意这里的摄像头只支持H264编码格式的拉流和播放。
实现摄像头预览效果
地图上新增和编辑坐标效果
注:
博客:
https://blog.csdn.net/badao_liumang_qizhi
实现
1、参考以上搭建前后端分离框架,建表如下
建表语句:
DROP TABLE IF EXISTS `bus_stream_media_video`;
CREATE TABLE `bus_stream_media_video` (
`id` bigint NOT NULL AUTO_INCREMENT COMMENT '序号',
`name` varchar(255) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci NULL DEFAULT NULL COMMENT '名称',
`rtsp_stream_address` varchar(255) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci NULL DEFAULT NULL COMMENT 'rtsp流地址',
`area_name` varchar(255) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci NULL DEFAULT NULL COMMENT '位置',
PRIMARY KEY (`id`) USING BTREE
) ENGINE = InnoDB AUTO_INCREMENT = 26 CHARACTER SET = utf8mb4 COLLATE = utf8mb4_0900_ai_ci COMMENT = '流媒体摄像头' ROW_FORMAT = DYNAMIC;
2、摄像头拉流预览流程
选择某个摄像头进行预览时,先校验流媒体相关信息是否设置,是才能预览
拿着该条数据的rtsp流地址调用ZLMediaKit的拉流的api进行拉流。
api拼接规则:
http://流媒体服务ip:流媒体服务端口/index/api/addStreamProxy?vhost=流媒体服务ip&app=live&stream=拼接时间戳&url=摄像头rtsp地址&secret= 流媒体服务秘钥
调用拉流api时需要流媒体服务器的ip和端口以及秘钥信息,通过配置页面进行配置并进行修改时的二次密码校验
然后解析拉流接口返回的json数据
状态码不为0或接口不通无响应等则提示不可预览,状态码为0则可预览。
解析data下的key,按照/解析,比如上面解析出ip:127.0.0.1,流应用live,流id为test。
进行http-flv视频预览, 预览url拼接规则:
http://key解析的ip:流媒体服务端口/key解析的live/key解析的test.flv
这里的流程可参考上面博客。
2、使用框架自带的代码生成工具生成代码并进行实体类部分修改
摄像头实体类:
import com.ruoyi.common.annotation.Excel;
import com.ruoyi.common.core.domain.BaseEntity;
import lombok.AllArgsConstructor;
import lombok.Builder;
import lombok.Data;
import lombok.NoArgsConstructor;
import java.math.BigDecimal;@Data
@AllArgsConstructor
@NoArgsConstructor
@Builder
public class BusStreamMediaVideo extends BaseEntity
{
private static final long serialVersionUID = 1L; /** 序号 */
private Long id; /** 名称 */
@Excel(name = "名称")
private String name; /** 位置x坐标 */
private BigDecimal siteX; /** 位置y坐标 */
private BigDecimal siteY; /** 区域位置 */
@Excel(name = "区域位置")
private String areaName; /** RTSP addresss */
@Excel(name = "rtspAddress")
private String rtspStreamAddress; private BigDecimal[] videoAdd;}
流媒体设置DTO类:
import lombok.AllArgsConstructor;
import lombok.Builder;
import lombok.Data;
import lombok.NoArgsConstructor;@Data
@AllArgsConstructor
@NoArgsConstructor
@Builder
public class BusStreamMediaVideoParamDto
{ private String ip; private String port; private String secret;}
Mapper接口层:
import com.ruoyi.system.domain.BusStreamMediaVideo;
import com.ruoyi.system.redisAop.AopCacheEnable;
import com.ruoyi.system.redisAop.AopCacheEvict;
import java.util.List;public interface BusStreamMediaVideoMapper
{
/**
* 查询摄像头参数
*
* @param id 摄像头参数ID
* @return 摄像头参数
*/
public BusStreamMediaVideo selectBusStreamMediaVideoById(Long id); /**
* 查询摄像头参数列表
*
* @param
* @return 摄像头参数集合
*/
@AopCacheEnable(key = "busStreamMediaVideo",expireTime = 86400)
public List<BusStreamMediaVideo> selectBusStreamMediaVideoList(BusStreamMediaVideo busStreamMediaVideo); /**
* 新增摄像头参数
*
* @param
* @return 结果
*/
@AopCacheEvict(key = "busStreamMediaVideo")
public int insertBusStreamMediaVideo(BusStreamMediaVideo busStreamMediaVideo); /**
* 修改摄像头参数
*
* @param
* @return 结果
*/
@AopCacheEvict(key = "busStreamMediaVideo")
public int updateBusStreamMediaVideo(BusStreamMediaVideo busStreamMediaVideo); /**
* 删除摄像头参数
*
* @param id 摄像头参数ID
* @return 结果
*/
@AopCacheEvict(key = "busStreamMediaVideo")
public int deleteBusStreamMediaVideoById(Long id); /**
* 批量删除摄像头参数
*
* @param ids 需要删除的数据ID
* @return 结果
*/
@AopCacheEvict(key = "busStreamMediaVideo")
public int deleteBusStreamMediaVideoByIds(Long[] ids);
}
注意这里使用了自定义缓存注解。
SpringBoot中通过自定义缓存注解(AOP切面拦截)实现数据库数据缓存到Redis:
SpringBoot中通过自定义缓存注解(AOP切面拦截)实现数据库数据缓存到Redis_redis切面_霸道流氓气质的博客-CSDN博客
Mapper.xml:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapperPUBLIC "-//mybatis.org//DTD Mapper 3.0//EN""http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.ruoyi.system.mapper.BusStreamMediaVideoMapper"><resultMap type="BusStreamMediaVideo" id="BusStreamMediaVideoResult"><result property="id" column="id"/><result property="name" column="name"/><result property="areaName" column="area_name"/><result property="rtspStreamAddress" column="rtsp_stream_address"/></resultMap><sql id="selectBusStreamMediaVideoVo">select id, name, area_name, rtsp_stream_addressfrom bus_stream_media_video</sql><select id="selectBusStreamMediaVideoList" parameterType="BusStreamMediaVideo"resultMap="BusStreamMediaVideoResult"><include refid="selectBusStreamMediaVideoVo"/><where><if test="name != null and name != ''">and name = #{name}</if><if test="areaName!=null and areaName != ''">and area_name = #{areaName}</if><if test="rtspStreamAddress!=null and rtspStreamAddress != ''">and rtsp_stream_address = #{rtspStreamAddress}</if></where></select><select id="selectBusStreamMediaVideoById" parameterType="Long" resultMap="BusStreamMediaVideoResult"><include refid="selectBusStreamMediaVideoVo"/>where id = #{id}</select><insert id="insertBusStreamMediaVideo" parameterType="BusStreamMediaVideo">insert into bus_stream_media_video<trim prefix="(" suffix=")" suffixOverrides=","><if test="id != null">id,</if><if test="name != null">name,</if><if test="areaName != null">area_name,</if><if test="rtspStreamAddress != null">rtsp_stream_address,</if></trim><trim prefix="values (" suffix=")" suffixOverrides=","><if test="id != null">#{id},</if><if test="name != null">#{name},</if><if test="areaName != null">#{areaName},</if><if test="rtspStreamAddress != null">#{rtspStreamAddress},</if></trim></insert><update id="updateBusStreamMediaVid