WebRTC H5页面 实现服务器转发的视频聊天(二) -- 迁移Spring Boot

WebRTC H5页面 实现服务器转发的视频聊天(二) – 迁移Spring Boot

背景

最近一段时间,工作内容也是在迁移项目,加上之前有读者要源码,所以打算重构下。

这个项目是之前因为工作中的调研(项目最后因为难度太大放弃了 == ),需要了解关于 WebRTC H5 + Java 如何实现实现网页端的视频聊天,而编写的sample。

原理就是 WebRTC + WebSocket。使用 WebRTC 采集视频看,通过 WebSocket 截取页面的视频流转发到后台,再经过后台分发到其他的客户端网页。

项目本身使用 Spring,打成 war,直接部署到 Tomcat 的方式运行。而写这个sample的时候,MyEcplise 还是我的最爱。

现在我已经习惯了 IDEA ,所以打算改成 Spring Boot,然后用 IDEA 跑起来。

项目实现基本不变,代码实现可考古 WebRTC H5实现服务器转发的视频聊天

流程

流程如下

WebRTC
WebSocket
WebSocket
WebRTC
用户A
浏览器
tomcat
浏览器
用户B
  1. 用户A 访问页面,浏览器通过 WebRTC API 从摄像头读取数据。
  2. 在A的浏览器中,流数据转换为字节数据,通过 WebSocket 发送到运行在 tomcat 的后台程序。
  3. 后台程序缓存视频数据。
  4. 用户B 访问页面。
  5. 后台程序从缓存中取出字节数据,通过 WebSocket 分发到用户B的浏览器。
  6. 用户B的浏览器,接收到字节数据,通过 WebRTC API 将字节数据转为视频流,在页面播放。

迁移过程

以前的架构:Spring

目标:Maven + Spring Boot

改造的过程很简单,三步走

  1. 将依赖的 lib 统一改为 maven 管理
  2. 前端等文件统一刚在 src/resouces/static
  3. 后端修改为 Spring Boot 启动。

访问 http://localhost:9090/chat/index.html 即可
在这里插入图片描述

注意浏览器必须支持 WebRTC 才可用

使用方式:

打开两个页面,分别点击 init 按钮,创建连接(途中可能会弹出是否允许使用摄像头等,需要点击允许)

然后分别点击 start 按钮,此时两个页面就会出现两个画面,上面的是本端,下面的是对端。

画面会有延时。

遇到的问题

历史问题,使用 Spring Boot 2 运行失败

调整为 Maven 项目,引入了Spring Boot 后,编译正常。

自行地 Run ,运行失败了。。。
在这里插入图片描述
编译错误,提示没有 this 变量, MessageInbound 也提示弃用了。

这说明内置 Tomcat 和项目本身依赖的好像不太不一样。。。

排查 Spring Boot 自动引入的 tomcat 的版本,果然不适用我的 demo。

内置 Tomcat 通过 spring-boot-starter-web 时自动引入spring-boot-starter-tomcat

此时Sring Boot 的版本为 2.0.9.RELEASE ,内部 Tomcat 的版本为 8,而 Tomcat 8 没有了 MessageInbound
在这里插入图片描述

项目本身用的是 Tomcat 7,目前也只有最古老的版本 1.1.12.RELEASE 还支持 Tomcat 7。

所以这里直接替换 Spring Boot,运行成功了。

Spring Boot 版本引起的问题

Caused by: org.springframework.context.ApplicationContextException: Unable to start EmbeddedWebApplicationContext due to missing EmbeddedServletContainerFactory bean.

1.1.12.RELEASE这个版本的启动,使用 @EnableAutoConfiguration ,而非 @SpringApplication

@WebServlet 没效果

要添加 WebServlet 的注册方式,如下

@Bean
public ServletRegistrationBean mc() {
    return new ServletRegistrationBean(new Monitor(), "/data");
}

代码托管:https://github.com/bottomheater/WebRTCApplication
代码托管:https://gitee.com/bottomheater/WebRTCApplication

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章