基于java的考研自习室音视频通话APP设计

目录
一、概述 2
选题： 2
1.选题背景： 2
2.制作意义： 2
3.人员分工： 2
二、需求分析 3
1.业务逻辑与业务流程： 3
2.功能性需求： 3
3.技术可行性分析： 3
4.经济性分析： 4
三、总体设计 4
1.系统架构设计（思维导图均为自行绘制） 4
2.功能架构设计 4
3.数据结构设计 5
四、详细设计 5
五、总结 7
1.主要工作： 7
2.收获： 7
3.遗憾与展望： 7
4.对老师的建议： 8
二、需求分析
1.业务逻辑与业务流程：
1.在音视频通话模块，我们使用腾讯云的模板，可以实现固定房间的音
视频通话功能，其中房间是已经开辟过的，进入即用，在此基础上进行设计。
2.在房间利用的功能模块，应有创建和加入房间两种功能，创建房间时需输入房间名并创建一个密码，系统将自动生成一个房间号与之对应，并将其告知创建者，而加入房间者只有正确输入房间号和对应密码正确才可进入通话，本文转载自http://www.biyezuopin.vip/onews.asp?id=15010当然还有选择页面已显示房间并加入的快捷功能。
3.房间设置密码功能，除了保证安全性问题，还能将一对一、一对多的功能整合到一起，想要一对一通话的两位用户，只需要用同一个房间和密码， 就能实现一对一的通话。还能在多人通话中保证不让陌生人进入扰乱正常通话。
2.功能性需求：
1.在总体设计中，必须能进行一对一，一对多的音视频通话；
2.可以显示房间名，房间号等信息，用户根据信息判断自己想要进入的房间；
3.可以自行创建房间，也有通过房间号进入房间的功能；
4.在通话过程中，应有打开关闭麦克风、摄像头等的功能；
5.此外，一个成熟的 APP 还应有用户注册登录、修改资料、密码、注销

登陆等的基本功能。
3.技术可行性分析：
技术上，前端安卓开发使用 Android studio 用 Java 语言编写，配置好
Apache-Tomcat9.0 环境变量，基于此环境设计各部分 UI，进行用户数据采集并发送数据到后端，接收后端信息和数据后进行 UI 跳转和数据显示；后端基于 Java servlet 编写，与云服务器和数据库连接通信，向云服务器数据库请求数据和发送增删改查等指令；云服务器申请腾讯云服务器，在云服务器中创建 demo 实现音视频通话功能，传输流程如图 2.1，后端代码和数据库服务部署在阿里云服务器，开发 MySQL 数据库用于存放数据，与后端连接收发请求。
这些技术在过去的数据库原理、综合实践、云计算等课程中有涉猎和学习，技术上实现可以实现。

<template>
  <div class="wrapper">
    <headerd></headerd>
    <sidebar></sidebar>
    <div class="content-box" :class="{'content-collapse':collapse}">
      <tags></tags>
      <div class="content">
        <transition name="move" mode="out-in">
          <keep-alive :include="tagsList">
            <router-view></router-view>
          </keep-alive>
        </transition>
      </div>
    </div>
    <el-dialog title="密码修改" :visible.sync="isShow" :before-close="handleClose">
      <el-form :model="form">
        <el-form-item label="原密码" :label-width="formLabelWidth">
          <el-input v-model="form.name" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="新密码" :label-width="formLabelWidth">
            <el-input v-model="form.name" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="确认密码" :label-width="formLabelWidth">
            <el-input show-password v-model="form.name" autocomplete="off"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="hideDailog">取 消</el-button>
        <el-button type="primary" @click="hideDailog">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import Headerd from '../components/Headerd.vue'
import Sidebar from '../components/Sidebar.vue'
import Tags from '../components/Tags.vue'
import { mapGetters } from "vuex"
import { mapActions } from "vuex"
export default {
  name: 'Home',
  data(){
    return{
      tagsList: [],
      collapse: false,
      form: {
        name: '',
        region: '',
        date1: '',
        date2: '',
        delivery: false,
        type: [],
        resource: '',
        desc: ''
      },
      formLabelWidth: '120px'
    }
  },
  computed: {
    ...mapGetters("dailog", {
      isShow: "isShow"
    })
  },
  components: {
    Headerd,
    Sidebar,
    Tags
  },
  methods: {
    ...mapActions("dailog", ["hideDailog", "showDailog"]),
    handleClose(){
       this.$confirm('确认关闭？')
          .then(_ => {
            this.hideDailog();
            //this.$store.dispatch('dailog/hideDailog')
          }).bind(this)
          .catch(_ => {});
    }
  },
  created() {
    this.$bus.$on("collapse", msg => {
      this.collapse = msg;
    });

    // 只有在标签页列表里的页面才使用keep-alive，即关闭标签之后就不保存到内存中了。
    this.$bus.$on("tags", msg => {
      let arr = [];
      for (let i = 0, len = msg.length; i < len; i++) {
        msg[i].name && arr.push(msg[i].name);
      }
      this.tagsList = arr;
    });
  }
}
</script>