00:01
那接下来我们看一下文件上传功能该怎么开发,那还是以我们这个后台管理系统为例,那么在这呢,首先有一个表单页面,这个表单页面呢,有一个上上传框,我们希望呢,在这选中文件以后来点击上传的上传进去,那我们先把这个页面呢复制过来,我们放到我们的整个后台管理系统里边来找一下这个页面,这个页面呢,应该叫咱们这个form layout就是它,我们把这个页面呢,我们来拿过来,CTRLC。我们还是一样给页面呢,我们也放一个文件夹,跟我们这个表单相关的开发放在这个form里边,然后呢,我们把这个所有页面我们都要加上SIM lef,我们把引擎的这个名称空间把它加过来,Controlr home,好,我们把这个表单页面就拿到了,我们再来准备一个controltrler来进行测试,那就叫我们的这个form表单的test controlrler。那么在这呢,主要要测试一个文件上传文,那么这个文件上传测试,那么这个测试呢,首先我们得写一个controller来处理请求,要处理呢,首先我们得能跳转到我们这个表单页面,我们就叫form lineouts,我们想要跳转到这个页面来发上一个请求,就来发一个叫get门屏板,发一个get请求,Get请求呢给我们跳转到这个页面,然后呢,另外我们要说当前呢,是一个controltrler来处理我们请求这个页面呢。
01:30
最终跳回我们的这个模板地址,那这个地址呢,得加上form的前缀class pass类路径下form下边的这个form layouts,不用加后缀,前后缀呢,人家已经都把给我们配好了,然后再回到我们这个表单页面,我们还是像以前一样把这个模板呢,我们都公共引进来,这是公共的CSS一些啊,我们就从这个页面,比如我们这儿呢,有一个慢页面,Ctrl home,我们这个慢页面里边呢,来把它的这个公共的头拿来,以及我们的这个左侧的导航。
02:07
把这个呢,给它一缩好来,把左侧的公共导航拿来,CTRLC,还有我们的这个header。导航的头状态栏,然后我们把这一块再拿来head。好,那我们把这个拿过来,过来以后呢,还有我们下边的这个公共GS,我们也一引入就行了,这几个呢,都是所有页面都要用的CTRLN的,在这儿来引公共GS是使用这个方法,CTRLC复制来,好我们这个页面呢,就准备好了,我们先来测试一下,保证呢能跳转到我们这个页面。我们来到我们的后台管理系统,我们来测试一下,请求来回车。重新访问一下。
03:00
好,现在呢,要求我们登录,我们来登录一个。先来确认一下我们这个页面跳转,这个页面跳转呢,由于我们要改这个菜单地址,所以我们先来找一下我们这个菜单地址是他在。com目里边引的,我们来搜索一下,这个我们叫form,我们要跳转到我们的这个form的这个地方,哎,就是这个layouts,我们使用TH,呃,RF,我们直接呢把这个路径一写就行了啊这个应该是之前改过了,那接下来呢,我在这来发送请求,我们来测试一下,点击好,现在来到这个页面,这个页面呢,接下来我们就来准备上文件上传的这个表单,来到这个页面文件上传表单CTRL后来准备一下,那应该就是这么第一个表单,第一个表单呢,它这有一个email,好,我们把这个表单呢,我们就来写成我们自己的,比如呢,我们要上传,除了有一些文件要上传,我们还有一些普通的属性,比如这个邮箱,我们给它呢,就叫name name呢也叫email啊,比如呢,我们这还有一个它叫password,我们就不叫password,我们就叫名字吧。
04:08
Type,它是一个,呃,Test纯文本,好,然后呢,Name name呢,那我们就叫email,呃,我们就叫user name,然后接下来这有一个文件项,这个文件项呢,比如我们就叫头像用户的这个头像,那头像呢,要求他上传头像的这个name,我们来给一个叫header image image,好,这是它的这个头像这一块的这个屏幕不要了,然后再接下来我们再来加上一个,因为这个文件上传呢,我们常用的两种方式,第一种是单文件上传,我们在这儿呢,能选择一个文件,比如在这儿我们来选中上一个。我们在这呢,CTRL按住也只能选一个文件,我们也有需要用到多文件上传,所以我们可以把它复制过来,比如某一项呢,我们这儿除了有头像外,比如还有他的这个生活照,对吧,他的这个生活照片,这个照片呢是一个我们的多文件,多文件呢,我们可以使用这个multiple啊,我们来上传,那这个多文件呢,我们就叫它photos,那现在呢,我们来准备好了这个表单,然后最终我们这有一个提交按钮,可以来提交一下,来看一下我们这个表单,保证没问题。
05:22
来刷新。好,那就是我们的这个表单,我们来CTRLF9,好刷新没问题了啊,我们这个表单邮箱名字以及我们这个头像啊生活照,我们这个生活照呢是一个多文件,好我们来选中打开,然后呢,我们这个头像呢,是一个单文件来选中,所以我们会看到多文件呢,我们可以加一项叫multiple,哎,它是代表呢当前是一个多文件上传,那接下来呢,我们就来写我们的这个controller来处理我们这个上传请求,那上传请求呢,我们就认为这个表单呢,要提交给一个地方是哪个地方呢?我来THX,我们上传请求呢,比如我们就叫啊安特福大括号,我们来这样取路径就叫upload,这是一个上传请求表单,要上传method的方式必须为post,另外呢,我们的整个表单code type必须叫multi PI form data,这样呢才是一个文件上传。表单这一块呢,都是固定写法,特别是method post和multi part form data,然后来到我们的这个controller,我们专门来写一个请求,来处理我们的上传请求。
06:24
我们就叫public string upload,然后呢,因为我们是post提交的,所以我在这来写一个处理post方式的这个请求,叫upload,然后呢,我们最终如果表单上传完,我们也可以让他来给我们来返回到麦页面,这也也行,我们来直接返回到麦,让它前后语拼刷好。那接下来呢,我们这个表单问题是我们上传来的这些数据,我们怎么获取,我们表单上传的这个数据不只有普通的这些属性,Email user name,那普通属性呢,跟我们以前获取的方式一样,比如我们想要获取邮箱的值,那我们就来写一个参数,或者呢,我们写一个对象,让它自动封装,我们写一个参数可以使用request和PAR,那请求参数代表呢,它从请求参数中取email就行,那我们的username也一样,我们可以来string username,让他呢给我们来从请求参数中获取username的值。这是我们两个。
07:24
个普通的项,跟我们以前获取方式一样,然后呢,我们的表单项,我们应该是这么来写,表单项呢,首先头像它的名字叫hier image,表单呢,最终我们可以让spring mvc封装一个文件叫multi part form,哎,Multi part费就是它,我就叫这个呢,我们就叫head image,由于呢,它是表单项,表单里边的文件项,我们可以使用这个注解叫request part,哎,它是我们里边的一个文件,这个文件呢,它叫header image,因为我们这一块的name叫header image,而且呢,因为我们这是一个单文件上传,所以它只能选中一个文件,而下面的photos呢,它又是一个多文件上传,那photos这些文件该怎么获取,那同样的,只要我们以后文件上传,我们可以给参数位置写一个multi part file啊,我们叫photos,因为它是多文件,我们直接写一个这个中括号的这个语法,那就是数组,然后呢,来写一个request part,它还是从请求参数中给我获取photo。
08:24
只不过呢,它是一个多文件,所以呢,在我们的spring boot,我们来做文件上传的时候,这个multi part file它就会呢,自动封装,自动封装,自动封装我们上传来的文件,自动封装上传过来的文件,而且呢,有什么好处,我们可以来给大家看一下,我们看一下这些上传的值都对不对,来使用日志打印一下CE fo件,好,我们来打印一下上传的相关信息,点ino,诶上传的信息信息里边呢,首先它的email邮箱呢是什么?然后呢,我们让他一打印,然后呢,还有他的username是什么,我们也可以让他一打印啊,大括号占个位,还有呢,我们的这个头像,这个头像的呃大小有多大,我们可以让他打印一下头像的这个文件大小,然后呢,包括我们的整个这个photos,他上传了几个生活照,我们可以让他打印一下生活照的这个数量,那我们可以。
09:24
把这些信息呢,我们打印到这儿,首先第一个是我们的呃邮箱,我们把这个邮箱的值拿到第一个填充,然后呢,Username拿到第二个填充,然后我们的header image,我们想要打印header的大小,所以我们只需要拿到它,因为multi part file呢,这是一个接口,里边呢也有非常多的方法,比如我们可以get bit,获取到它整个流,当然我们现在就想要判断它有多大,所以我们来get size,拿到我们整个上传图像的大小,然我们这个photos来看它给我们上传的几个文件,我们可以来看一下它的这个长度,好,这是我们上传的相关信息,我们先来保证基本的信息能获取到,我们再来看把这个文件该怎么存到服务器里边。
10:10
好,现在呢,启动起来没问题,来还是来访问这个表单页面,他让我们来重新登录。来到我们的这个表单,那我们现在要文件上传,我们来邮箱随便填一个名字,我们来随便写一个,然后呢,头像我来选中一个头像呢,我们就来选这个bug JPG,然后呢,还有这个生活照,我们来选择上两个,诶比如我们来选一个这个,呃,支付宝还有一个这个呃头像啊,我们来选上两个,当我来点击提交,走好,我们提交呢,一看来到我们的这个慢页面,那说明提交成功了,来看控制台日志的打印,日志的打印呢,应该是这样子的,我们来找一下啊,我们这个提交的这个数据打印上传的信息email呢,诶是我们的这个邮箱没问题,在这儿呢,还有我们这个头像的大小在这,然后呢,我们这个照片上传了几个,我们都能获取到,所以呢,我们现在这个信息能获取到,那我们怎么将这个文件保存起来呢?其实在我们spring boot中,这个抽取已经变得非常简单了,我们可以这么来做,首先我们来判断第一个这个文件呢,我们先要对它做所有操作。
11:21
之前next spring boot给我们里边封装了一个方法叫it's empty,先来判断我们上传的这个文件是不是空的,如果它不为空,我们可以对它来进行一个操作,怎么操作呢?我们一般要把它存在,诶大家可以来保存到文件服务器,或者呢,我们比如用阿里云的一些对象存储啊,服务器等等等等,那我们现在呢,就来简单来写,把这个文件直接存到我们的这个磁盘,那怎么存,我们直接可以通过这个multi part file,它来封装的这个上传的文件,我们可以第一种拿到它的原生的这个流,这个流呢,我们接下来想要把这个流怎么操作就怎么操作,而且呢,为了方便来专门还抽取了一个非常简单的方法叫transfer to,现在我们还传输到哪来,我可以来写一个new,一个fair,我来传输到一个地方,这是哪个地方呢?我们就假设把它放到D盘,D盘的某一个地方,我们放到D盘,我们来看一下啊,我们就放到D盘的这。
12:21
那根目录吧。来打开我们的整个磁盘,来放到H盘,我们就来放到H盘的我们这个根录根目录,而且呢,我们这个文件要放肯定要得有我们的这个名字什么的,所以们这个名字怎么获取呢?我们还可以从它这拿到文件名,点一个它呢有一个这个方法叫get,诶这有一个叫origin,呃,File name,这相当于我们原始的文件名,所以呢,我们相当于能拿到原来的这个文件名,我们可以呢,把它就存到DH盘的这个位置,然后呢,当然我们这个流传输肯定会有异常,我们把它相关抛出去就行了,诶这是我们这个,然后呢,再来加上如果我们现在是啊生活照的这些信息,我们给H盘专门创建一个文件夹啊,应该比较方便,比如我们就来放到这个catch文件夹里边吧,这个catch文件夹里边什么东西也没放,我就放到这,所有的文件呢,都放在这啊,Catch下边的好,一定要加上它下边的这个文件,那我们其他的这个东西呢也一样,我们先来判断A,如果说我们。
13:23
我们的这个数组点lengths大于零,那也就是说呢,数组有长度,我们有文件,所以我们就可以给它来进行一个遍历,我们来点一个for each来遍历的时候呢,每一个我们再来进行一个操作们所有的操作一定要判断我们当前的这个文件项封装的是不是正确,Photo is empty,如果它呢不为空,那说明我们这个文件呢是能获取到的,能获取到以后呢,我们想要把它保存在一个位置,非常方便,你直接给我们封装了transfer to方法,那么就来使用它new,一个file,我们放在一个指定的位置。而这个位置呢,我们必须有一个文件名,这个文件名从哪来,我们就还是拿到它原始的这个文件名,Get一个原始的文件名,好把这个原始的文件名拿来,这就是我们所有的信息,我们当然也能拿到每一个文件的这个大小等等各种来进行判断,比如get size,它这个大小还能拿到它原生的流,我们以后可以把这个流想要怎么做就怎么做好,我们现在来确认一下我们这个文件上传功能能不能使用。
14:29
所以整个文件上传呢,用起来是非常简单的,我们只需要使用multi part file来封装文件上传项就行了,那上传项如果有多项,就使用这个数组方式,我们来看一下最终的效果,我们来到我们的这个表单。好,那还是要先登录来到我们的这个表单页,那表单页呢,我们来准备要上传一些东西,来我们来选一个头像,我们来随便选择一个头像,本集照片我们来选一个,然后呢,生活照来选上几个1234,好,我们来点一个打开,那我们这几个文件呢,我们都选中了,我来点一个提交,好然后呢,接下来大家会看到这呢,会给我们有这么一个提示叫max upload,然后我们最大上传这个大小,大小呢是限定了的,那相当于现在呢,超出了我们这个大小,最大呢它是呃,它是限制,我们在这儿呢,有一个1048576,那所以说呢,我们会看见啊,这也就是我们这photo这个字段,我们这最大大小已经限制了,为什么会限制,因为所有的文件上传呢,都是自动配合配置好的,那我们来看一下啊,文件上传呢,它的底层原理呢,是有一个叫文件上传解析器,解析器我们可以multi part,我们来搜索文件上。
15:44
上传解析器的时候呢,人家直接有一个multi partt,我整个文件上传的auto configuration,相当于呢,它有这个自动配置来看一下自动配置,然后跟文件上传有关的所有的属性都是以这个前缀,我们可以点solid multi part来配,它所有的属性呢,都被最终enable configuration properties封装到这点进来,所以呢,我们会看到这呢,会有一个限制叫max size,哎,我们在这呢有限制,相当我们最大的这个相当于是em MB,而然后呢,我们最大的请求大小是十,也就呢我们前面是最大的文件大小也是单个文件,我们限制必须呢不最大不超过em MB,而所有的总请求上传的文件量最大呢不能超过10MB,而我们刚才的这一堆上传肯定是超数量了,我们可以来看一下我们刚才的这几个图片,在这来选中的这几个图片啊,我们就来随便来准备上这几个图片,然后呢,我们来看到啊,啊有单个图片有没有。
16:44
就超过我们的这个最大大小,来这有一个图片,你超过我们这个em MB了,所以呢,我们可以来给这来做一个修改,来这修改,所以呢,跟文件上传有关的修改,我们都是通过multi part这一块我们来改的,好multi part呢,我们接下来可以改一下,改第一个markx fair size相当于单个文件的最大大小,这个em MB呢有点太小了,我们可以来写一个10MB,然后呢,接下来我们可以来再来写一个整体的上传的整个文件大小,Max有一个request size,我们整个上传的整个请求,我们整个文件呢,你不超过100MB就行,所以我们在这呢,可以来修改文件上传的相关参数来重新启动。
17:31
所以用了什spring boot呢,我们就会发现我们无论想要做什么功能,全都是自动配置好的,而且也有一些默认的细节规则,这些规则呢,比如文件上传的规则全都在这儿,我们提前呢,给大家复制到这儿,自动配置原理,所有的文件上传功能的配置在这儿一键上传,嗯,在我们的这儿,那我们在这儿呢,我们看到了它对文件已经限制了大小,当我们把这个一修改以后,来重新来进行测试,好,我们来重新进入我们的后台管理系统,12346走。
18:04
来测试一下文件上传,那现在呢,我们来写一个邮箱啊,Email头像,现在我们来选一个,比如我们这个啊,这个头像我们来选中上一个,然后呢,还有它的这个生活照,我们来也选中几个啊,我们来选择多一点,我们把整个的这些图片我们全选上去,它呢肯定是超过我们之前说的emb等等了,这有31个文件来点一个提交,诶我发现呢,这一切成功,一切成功,包括我们控制台呢,没有报错,也收到了上传信息,上传信息里边呢,我们会看到photos有31个,而单图片呢,都已经超过em MB了啊,所以呢,我们现在这个相当于限制的约束,我们就解禁了,然后来到我们的整个这一块,看到我们的看看里边呢,我们上传的信息,诶,所有的图片都在这,没有任何问题,所以这就是我们说的整个文件上传功能,那文件上传功能呢,用起来代码非常简单,我们也无需要对spring boot来做任何的设置。想要写。
19:04
文件上传就是老师的这种写法就行了,它呢复制过来,这是我们文件上传的代码,当然我们也可以呢,在下一节课看一下我们文件上传整个功能,我们的这个multi part file,它又是怎么被确定进来,然后我们来直接使用它的transfer to方法就能把文件上传上去的。
我来说两句