同学们好!成功登录《我家租房网》系统的用户,可以点击位于搜索页面右上角的用户名,进入用户页面。点击用户页面个人信息栏中的“修改”,会打开修改个人信息的页面,在这里可以上传头像也可以更新用户名。这节课我们将着手实现上传头像的功能。


我们将首先实现用于上传头像的后端微服务,再在前端服务器中添加路由处理函数并远程调用后端微服务,最后再将前后端连在一起做完整的功能测试,并就所发现的问题给出解决方案。后续课程将继续优化这部分功能。


首先我们来实现后端服务器。


第一步是创建特定的微服务。


创建微服务的过程还是和先前一样,直接在back-end工程目录下执行go-micro命令,子命令为new,参数为service,微服务名为UploadAvatar。


接着,需要修改一下go-micro为我们自动生成的接口描述。在back-end工程目录下的UploadAvatar微服务目录中,有一个名为proto的子目录,这就是存放接口描述脚本及其Go代码文件的地方。现阶段里面只有一个名为UploadAvatar.proto的ProtoBuf脚本文件。我们需要对该文件做一些修改:

这段代码描述的是,前端服务器和后端微服务之间的数据交换格式。CallRequest表示前端提供给后端的请求数据,其中包含字符串形式的用户名、字节序列形式的头像数据,和字符串形式的头像文件名后缀。CallResponse表示后端返回给前端的响应数据,其中包含错误代码、错误描述和头像信息。头像信息中只含有一个字段,即头像图片的URL。


有了用ProtoBuf语言描述的远程调用接口,我们还需要把它编译成基于Go语言的程序代码。在UploadAvatar微服务目录中执行make命令,并携带四个目标参数,它们是init、proto、update和tidy。


在UploadAvatar微服务目录下,创建一个名为model的子目录,表示该微服务的模型层。在该子目录中创建mysql.go文件,封装所有与操作MySQL数据库有关的代码。在实际编写数据库访问代码之前,我们可以先把之前为前端服务器编写的mysql.go文件中的内容原封不动地复制到这里:


修改UploadAvatar微服务目录中的main.go文件,添加对InitDB函数的调用,将服务发现改为Consul,绑定IP地址和端口:

程序启动伊始,即完成对数据库的初始化。其中包括两个动作,其一是连接ihomedb数据库并获得连接池对象,其二是在该数据库中创建表。当然,如果这些表已经存在,则不再创建。接着,在服务器对象的初始化部分,指示其注册到Consul服务器,同时绑定本机的9008端口。


在完成UploadAvatar微服务模型层的所有开发工作之后,我们将着手编写用于处理上传头像业务的代码。


打开UploadAvatar微服务目录下,handler子目录中的UploadAvatar.go文件,在其中的Call方法里,添加与上传头像有关的操作:

这里仅仅是简单地打印了包含在请求对象中的用户名、头像数据字节数,和头像文件名后缀。


在完成UploadAvatar后端服务器的开发后,我们需要为前端服务器添加一条路由,并在路由处理函数中完成对后端微服务远程方法的调用。


前端和后端共用同一套接口描述。


因此,这里我们将UploadAvatar微服务目录下proto子目录中的所有文件,原封不动地复制到front-end工程目录proto子目录下的UploadAvatar目录中。


这里我们要为上传头像添加一条路由,POST方法结合/api/v1.0/user/avatar路径,处理函数名为UploadAvatar。


在front-end工程目录下的main.go文件中添加一条路由:

这里我们调用了路由对象的POST方法,为上传头像添加了一条路由,将POST方法结合/user/avatar路径,路由到controller包的UploadAvatar函数。将UploadAvatar函数定义在controller包里是因为该函数的主要任务是执行业务逻辑,属于MVC中的C,即控制器层的部分。


当然,在controller包里真的得有UploadAvatar函数。为此,我们打开front-end工程目录下controller子目录中的user.go文件。在该文件的import部分增加一行,同时定义UploadAvatar函数:

这段代码首先从Session中读取用户名,接着从请求包体中根据键获取头像文件头对象,并通过该对象的Open方法获得头像文件对象。根据头像文件的大小分配足量的字节切片,将头像文件中的数据读到该切片中。通过Consul服务发现,获取有关名为uploadavatar的微服务的信息,远程调用其中的UploadAvatar对象的Call方法。该方法以包含用户名、头像数据和头像文件名后缀的请求对象为参数,并返回包含错误代码、错误描述和头像信息的响应对象。头像信息中包含头像图片的URL,浏览器将据此显示头像图片。最后将该响应对象序列化为一个JSON字符串,编码到HTTP响应中,回传给浏览器。


至此,我们已经完成上传头像的全部开发工作。下面我们将对这部分功能进行测试。


启动Consul服务器、UserLogin、GetUser、UploadAvatar后端微服务和前端服务器。通过登录页面登录系统,点击位于搜索页面右上角的用户名,进入用户页面,点击个人信息栏中的“修改”,进入修改个人信息的页面,点击“选择文件”,选择图片文件,点击“上传”。观察UploadAvatar后端微服务的日志输出,验证其远程方法的执行是否符合预期。


当然,截至目前,我们的UploadAvatar后端微服务并没有做什么实质性的工作,只是打印了请求对象中的用户名、头像数据字节数,和头像文件名后缀。该微服务也没有向前端返回任何有价值的响应,因此浏览器并没有显示出所上传的头像图片。在完善这部分功能之前,我们需要先思考几个问题。


第一个问题是,后端微服务在得到头像数据后,把它保存在什么地方?存在后端服务器本地,显然并不合适。因为作为一个分布式的服务器系统,执行不同业务的后端微服务,往往被部署在不同的服务器主机上,即使是执行相同业务的微服务,也存在多机冗余部署的情况。谁也无法保证,当前端服务器需要获取头像数据时,为其提供服务的一定是当初处理上传头像业务的那台服务器主机。更妥当的做法是,将头像数据以文件的形式,保存到某个现成的云平台上。象七牛云、阿里云、腾讯云等,都提供类似这种分布式文件存储服务。作为另一种选择,我们也可以自己搭建这样的云平台,FastDFS结合Nginx,就是一种低成本且高度可靠的解决方案。第二个问题是,包含头像数据的文件如何命名?数据完全不同的头像不能相互覆盖,而内容相同的头像也没必要保存多份。针对这类问题,FastDFS就可以很好地解决。这就是我们后面课程需要完成的工作。


谢谢大家,我们下节课再见!