文件上传视频（图片和视频）
先来简单介绍下功能实现，实现此功能分为数据库、后端java、前端vue共同实现；
业务流程：
- vue页面点击上传后，通过调用后端接口，进行上传，后端进行判断，并设置上传位置，大小等。
- 把文件上传后，数据库设计了文件表，对上传的文件进行记录。
- 后端进行上传后，返回前端一个文件路径，通过文件位置进行回显。
- 当点击确定后，把文件位置根据业务要求保存到数据库。
- 因为我的需求是只上传图片和视频，在后端判断时进行了判断文件是什么类型，并进行了筛选，不是图片和视频都不保存。
下面直接上代码：
mysql
文件管理的数据表：
此数据表是文件上传后文件的信息。
springboot
配置文件（application.yml）
文件地址：服务器或者本地的文件夹地址。
pom.xml文件
entity类
mapper类
封装类
Result
Constants
controller类
vue
直接来第一张照片的效果图的代码：
- 注意好v-for部分，是要循环的数据，
- baseURL是上传文件的接口，比如值为：localhost:8080
- handleAvatarSuccess3方法可以拿到后端返回的值。也就说文件地址。
js部分
addUrlNLXc方法是添加一行，对数据进行添加。
有些变量未定义，需要再data return中定义
css部分
因为有些功能涉及其他功能块，需要理解后加入自己的需求进行修改。
如有不解与疑问，请尽情留言。
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请联系我们，一经查实，本站将立刻删除。
如需转载请保留出处：https://51itzy.com/kjqy/138194.html