koa项目：云音乐应用7——总结

发表于 更新于 分类于 阅读次数： Disqus：

前面分步骤完成了云音乐应用的基本功能，有些功能暂时没能实现，我对这次做项目的过程做了一个小结，帮助自己分析了这个项目中的收获和问题。

收获

这是我第一次尝试做前后端兼顾的项目，课程里老师提供了大部分的思路，我在看完老师的讲解之后再自己摸索做了一遍。其中有一些细节尝试了用自己的方法完成，有一些细节功能没有完全做完，这些我会在问题总结里面提到。但总体来说，明白了前后端到底是怎么一回事，有一些之前并不十分理解的概念，比如cookie和session，在项目过程中明白了是什么，以及具体用来做什么的，它们如何起作用等。

1. 搭建项目架构

之前跟着视频教程学node.js还有框架的时候，都是以某个功能或者常用中间件为单位来学习的，整个服务器的搭建其实都比较简单，通常流程是引用http模块或者express/koa框架，创建服务器，规定服务器功能，服务器监听。其中，服务器功能比较单一，比如实现一个文件的读写功能、解析一个请求体等。这次的项目会相对复杂一些，需要完成的功能多一些，所以在整个项目的搭建上也更贴近真实项目。

这次项目框架包括：

  • 主文件： app.js（用来处理比较主要的服务器功能）
  • routes文件夹（用于处理不同的路径请求，本次项目涉及user用户路由和music音乐路由）
  • controllers文件夹（用于定义不同路径请求的函数，相应地，本次项目涉及user_controller和music_controller）
  • modules文件夹（用于定义单独的功能性模块，本次项目定义了数据库功能）
  • views文件夹（模板引擎文件夹，可以根据内容再做进一步细分，这次项目还划分出了layout文件夹，用于放置主页面文件，以及components文件夹，用于放置统一的页面部分，如头header.html，底部footer.html以及连接link.html）
  • public文件夹（静态资源文件夹，本次项目静态资源部分包括模板页面的css文件，引入的字体、图片，以及上传文件等）
  • config.js文件，是项目设置参数文件

我在网上查了其他人分享的项目内容，基本框架和以上内容差不多，虽然根据项目不同，会有细微差别，但是大体的思路是一致的。这样一方面更有利于项目的维护，避免出现问题或者项目调整的时候，要在主文件中到处找原代码的位置；另一方面，在写代码的时候，思路更加清晰。这是我这次最深的体会，之前写代码会有功能多了就这儿添加一些，那儿添加一些的习惯，很容易加的自己不知道哪儿是哪儿，也不方便自己回顾，但是这次比较明显地用模块化的思路去归类不同的功能，每个文件里都很明确地知道有什么功能。

2. 了解项目的解决思路

这次项目的整体思路还挺明确的，因为功能也不太难。

  1. 访问注册、登录地址能够访问登录和注册页面
  2. 实现注册功能
    • 判断用户名是否可用（是否已经存在）
    • 判断邮箱是否可用（是否已经存在 && 是否符合邮箱格式）
    • 判断密码强度，显示相应的图案
    • 发送验证码，并判断验证码是否正确
    • 完成注册功能（在数据库中添加用户信息），并跳转到登录页面
  3. 实现登录功能
    • 判断用户名是否存在，以及用户名与密码是否一致
    • 完成登录，在session中保存用户的登录状态，并跳转到音乐页面
  4. 音乐页面功能
    • 根据用户id显示该用户的音乐列表
    • 点击添加按钮跳转到添加音乐页面，填写信息并上传文件后，在数据库中添加该条数据信息
    • 点击修改信息跳转到修改音乐页面
    • 填写信息并上传文件后，在数据库中修改该条信息
    • 点击删除按钮在数据库中删除该条信息
    • 点击播放按钮可以播放音乐
    • 点击退出按钮删除登录状态，跳转到登录页面

以上功能中有两项没有完成，主要有两个原因：

  1. 老师在讲解时没有提到有这两个功能，我后续想要自己完成时，发现没有提前预留好修改他们的id，导致修改的时候会殃及其他数据；
  2. 对MySQL语法不熟，文档中没有相应的语法，目前还在摸索怎么解决这个问题，等后续解决之后，我会把解决方案同步过来；

3. 熟悉koa框架和中间件

在blue老师的课程里详细介绍了express的用法，koa说的比较少。这次项目用koa框架来完成，刚开始觉得很别扭，很多地方不熟悉，但是整个做下来顺畅了许多。

对于中间件的使用也比较熟悉了，由于使用中间件的方法在文档中都比较明确，所以使用并不是难点，需要注意的是这些中间件排列的位置，需要考虑它们的功能以及起到的作用，从而根据事件发展的顺序来排列，也就是通过业务逻辑来排列，才能保证每个中间件都起到相应的作用，否则，有些中间件不仅无法发挥作用，还会导致内容无法继续向下执行。

这次项目涉及到以下中间件：

  • koa-art-template 渲染模板
  • koa-session 用来保存服务器端的session
  • koa-formidable 用来请求数据，包括普通文本数据和上传的文件
  • koa-router 用来处理不同路径的路由中间件
  • captchapng2 用来发送验证码
  • mysql 数据库中间件

问题

这次的问题是我思考的比较多的。整个项目涉及到了前后端的内容，但是因为重点训练node.js部分的知识点，前端的代码是提前发给我们的，所以项目中有好几处不好进行。

1. 对前端内容

这次项目的后端代码是从零开始写的，前端是完成好的模板文件，但是没有script，全都是静态页面。后端的思路是根据模板页面已经规定好的功能来一步一步完成，但是因为第一次接触这样的项目，对前端内容的统计有些不全面，所以后端代码光顾着对应每个页面的内容来写了，但是涉及到跨页面的内容，比如有些需要提前预留接口或者辨识符的地方就没有注意到，导致最后有些页面的功能实现起来特别费劲。

另外前端的模板代码不熟悉，有些它提前预留的功能接口不太明确，写后端代码的时候有点不太明白这些地方为什么这么设计，就只能这么留着。还有些会觉得布局很尴尬，比如头部的状态栏有登录和注册两个按钮，但只要鼠标悬停就会出现退出按钮。我猜原代码对这部分也有一个状态判断，最终根据登录和非登录状态显示的内容是不一样的，但是因为我对模板部分进行了优化，可能原代码判断的方式和我不一样，导致这部分的布局一直有些别扭。

解决方案：

前后端内容应该在项目开始前统一好功能内容，明确各自要做什么，以及为对方提供什么，减少无用功。

2. 对数据库不熟悉

之前在sololearn上面学过mysql的语法，但是因为是纯粹的语法，没有项目练习，所以很快就忘得差不多了。这次使用数据库时，明显觉得对数据库语法不熟悉，而且中间件使用时还对语法做了一些调整，更让人有些摸不着头脑。

解决方案：

这个只能慢慢补了，最好是能有这类项目来反复练习，加强记忆。