# 多人在线远程协作白板

说明

该仓库为前后端共用仓库

前端目录：/front-end

后端目录：/back-end

功能设计与实现

支持图形及样式

直线、箭头：颜色、透明度

矩形、圆形：颜色、是否填充、填充颜色、填充透明度

文本：颜色、透明度、尺寸

支持操作

创建房间、加入房间、绘图、添加画布、切换画布、修改画布模式（仅限房间主人）、撤销、重做 填充

更多功能敬请期待

演示视频

哔哩哔哩-演示视频在线播放地址

QQ空间演示视频在线播放地址

若由于QQ空间限流及权限问题导致播放地址失效，请手动打开/docs/演示视频.mp4查看

环境准备

前端环境：node v16.14.2

后端环境：Java8

快速开始

前端部署

配置说明

默认启动端口为10087，如需修改，请到/front-end/vue.config.js中修改对应配置

使用说明

项目默认访问后端接口为localhost:10087，如需跨终端访问，请修改/front-end/App.vue文件data.st.wsUrl属性值为相应后端项目IP地址和端口号

运行

切换路径

cd ./front-end

安装依赖

npm install

运行

npm run serve

打包

npm run build

后端部署

配置说明

默认启动端口为10086，如需修改，请到/back-end/back-end/src/main/resources/application.properties中修改对应配置

运行

项目入口：./back-end/back-end/src/main/java/com/am/BackEndApplication.java

执行入口文件main方法即可