day15【前台】项目发布/23-尚硅谷-尚筹网-收集回报信息-上传图片

来，咱们回顾一下啊，咱们之前是做到哪了？看一下我们之前这个思路哈。从第一个表单。提交这个数据。哎，找这个微服务，找这它里边的handler保存项目的基本的信息。然后呢，封装到project view里边。Project VO呢，再存入到三域里边，哎，当然这里边呢，其实有一个文件上传，上传到oss上面。哎，然后把这个访问的地址呢，也拼到这个对象里边，保存到三生玉。然后呢，下一步跳转到页面，跳转到我们回报信息的表单的页面。诶，然后我们这边呢，需要发送Ajax请求啊，去添加这个回报信息。我们就是说，哎，咱们就做到这儿了，嗯，之前咱们。昨天呢？

昨天是。我们说到了这儿哈，说到了。嗯。回报信息部分前端的说明哈，呃，咱们现在就是要来到这个页面。找到这个project consumer。哎，在这个回报的这个收集回报信息这个页面哈，我们要做的事情呢。呃，首先哈，是这样的，就是说他。呃，在你选中一个文件的时候，马上呢，就需要给他上传上去了。这个就需要给他上传上去了。呃，上传呢。是要把一个文件哈，是要把一个文件。你看我们是在这儿说的哈。

就是把这个用户选中的这个文件。文件本身呢，是要上传到这个oss里边。诶，就是说这个文件本身呢，是上传到。Oss里面。哎，然后呢，上传完了以后，我们用的那个工具方法会返回一个访问的路径啊，返返回一个访问的路径。哎。呃，然后我们会把这个路径呢，以作为当前这个Ajax请求的一个响应，返回给这个页面啊，这是返回给页面的。把这个图片访问的路径呢，设置到这个return obj的里边。诶，那然后呢，这个下一步再点确定的时候，再把它们连同这个访问路径一起啊上传到服务器。

哎，提交给服务器啊，这是下一步，我们现在要考虑的就是这个事儿，这边呢，上传文件，发一个Ajax请求上传文件。然后呢，下一步我们看看这个。到页面上咱们找到这一段代码哈，你看name等于return picture，这个是定位到我们文件上传框。哎，这个啊。这是我们文件上传框。呃，他一旦选择了一个新的文件啊，就会触发，就会触发他的这个值改变的这个这个事件啊，触发这个事件。哎，在这个值改变的事件里边。

这一部分是用来做这个预览的，这个先不看了。诶，我们现在呢，就是用这一套这个代码把它给上传上去。这个project斜杠project是我们zoo这边定义的一个路由的访问规则。哎，我们在这个工程里边，我们要写的是这部分。Create upload return picture。表示是创建的意思啊，上传回报的图片。哎，我们需要跟这儿呢，给它这个接上。然后呢，我们在我们的handler里边。这边呢，我们得先写一个哈。Request。按Ajax请求，我们得返回一个result。

呃，然后呢，里边放的东西哈，就是那个访问的路径啊。Picture。哎，那么我们这个请求是一个HX请求，我们是希望这个方法的返回值作为当前请求的响应，不跳转到任何的页面。这就得加这个response。因为我们这个类上面没有用rest controller啊，这个类里边的请求有的是有的是这么走的，有的是这么走的啊，这个不一样。嗯，然后呢。我们这儿用multipar。来接收一下这个文件。哎，这是我们所谓的。Returned the picture。

呃，那这个东西呢，它怎么和我们请求参数去对应。嗯。啊，就是这个地方哈，你看。这有一个form data哈，它里边end一下form data就是我们表单要提交的数据，它这个aend呢，你看这个就是请求参数的名字，这个是请求参数的值。他把这个文件呢，用这个名字给带到服务器啊，所以说我们这个请求参数接收的话呢。就是用per的name就是它。看我这怎么写啊。我们放在这儿说哈，放在这儿说，因为我们主要关注的还是这个。呃，这个后台的代码。Javascript的代码里边。

这个return。Return picture呢是请求参数的。名字。哎，然后呢，这个feel。是请求参数的值诶。呃，也就是。要上传的那个文件。所以说呢，我们return哈，拿过来来这儿写这个。Quest。哎，它得是用我们这种啊，可能是我的O。把这个呢给接收到。接收到以后呢，我们下一步哎。呃，要做的事情啊，这个是我们说接收。接收用户上传的文件。哎，然后这个下下一步呢，就是说我们去先可以去执行一下文件的上传。

哎，就是说先得把它给上传到我们这个叫oss上面。啊，这边我们需要用到我们这个CN的悠久。Upload files。嗯，这里边又一大串哈，这个咱们就从这边复制一下。呃，这是return。这些不变，这儿呢是用它。去get dream she get original field name。这边有异常，给他抛出去。现在呢，我们上传这个文件之后。

去判断一下。这个上传的结果是成功还是失败？那么咱们先把这个结果呢，先拿到哈。哎，我想想啊。我们现在想要的呀，大家看啊。就是。我们现在想要的东西呢，他如果成功的话。他就把这个路径给放里边，我们页面那边想要的就是这个路径，他要是失败的话呢，他也会把消息给放到里边。哎，这边也是消息放在这里边。我们要的他已经有了，就没必要咱们自己另外再判断了，直接把这玩意儿返回就行了。哎，就是返回我们这个上传。结果。就直接这个东西就返回就完事了，就把这个发给页面，它是成功就成功，失败就失败，失败里边会有消息的。

哎，这是我们这个汉字方法。哎，所以说呢，我们看一下啊，下一步就是咱们得去。试一下哈。试一下，我天呐，试一下这玩意儿跑起来的话要等半天是吧。