html5前端入门教程分享：Node.Js 框架

78 阅读 0 评论 52 点赞

我是靠谱客的博主酷酷彩虹，最近开发中收集的这篇文章主要介绍html5前端入门教程分享：Node.Js 框架，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

项目前期准备：

以express 框架为例

npm i express-generator -g //全局安装express框架 express -e //生成express应用骨架 npm i //安装依赖 npm start //在3000端口监听

拓展：目前最市面上最流行的node框架有：

Sail.js

Sails.js 就像是 Node.js 平台上的 Rails 框架。这是一个可靠可伸缩的开发框架，面向服务的架构，提供数据驱动的 API 集合。用来开发多玩家游戏、聊天应用和实时面板引用非常方便，也可用于开发企业级 Node.js 应用。 Sails.js 基于 Node.js, Connect, Express 和 Socket.io 构建。

Koa.js

koa.js是下一代的 Node.js 的 Web 框架。由 Express 团队设计。旨在提供一个更小型、更富有表现力、更可靠的 Web 应用和 API 的开发基础。

Koa可以通过生成器摆脱回调，极大地改进错误处理。Koa核心不绑定任何中间件，但提供了优雅的一组可以快速和愉悦地编写服务器应用的方法。

项目开始

利用bootstrap完成布局（或者使用bulma前端css框架也很方便）
把需要复用的小组件放在一个文件夹在,这里我新建了一个commjs目录
构造函数中加载DOM结构（面向对象思想）
把一切需要重复使用的组件模块化，哪里需要哪里引入，代码复用

理解mvc

控制器Controller：是应用程序中处理用户交互的部分。　　通常控制器负责从视图读取数据，控制用户输入，并向模型发送数据。

作用：根据路由中设置的路径不同，调用控制器中对应的方法（函数）， res.body =>获取post请求中传递的参数 res.query => 获取get请求中的数据业务逻辑基本都在控制层，调用模型中相对应的函数，把需要传递的数据作为参数传递进去

模型Model Model（模型）是应用程序中用于处理应用程序数据逻辑的部分。　　作用：通常模型对象负责在数据库中存取数据。

因为模型中的函数需要在控制器里调用，所以在最后需要导出模型。模型里,涉及到数据库的操作需要依赖mogoose包

模型处理数据会返还一个promise对象，成功或者失败通过Promise.then调用控制器里传递过来的成功或者失败的函数再由控制器res.json返还到前端

View（视图）是应用程序中处理数据显示的部分。　　通常视图是依据模型数据创建的

前端到后端作为前端如果我们需要拿到后端的数据，就得发送ajax请求，如果涉及到文件操作，就必须用post 请求通过不同的url(在app.js里设置过)，拿到不同的数据 view-Controller-Model ，根据返还的数据渲染页面这里还是MVC模式，所以MVC流程必须得熟悉。

功能登录: 涉及到数据库的操作，查询的结果是Promise对象，控制器里面的操作还是那么回事,前端传递到控制器的参数，一个成功的回调，一个失败的回调模型里promise.then（）决定调用成功或者失败的函数，传到控制器回调，控制器res.json返还到信息前端

需要保存用户登录信息：npm i cookie-session --save app.js中配置cookie-session中间件检查是否登录：前端加载时，发送ajax请求，根据响应信息，判断是否登录，渲染登录效果点击退出时，把req.session置为null

**fromData.append("","")可以追加请求信息

关于文件上传

涉及到文件上传，在服务器端（路由）中引入 multer模块 npm i multer --save
配置文件上传，cv原则，修改保存位置和命名规则即可
路由里，回调函数前加一个文件上传的方法 router.post('',upload,single('文件上传表单name名')，fn)
控制器判断是否有文件上传(res.file) 如果有用变量储存文件路径 => const file = "/路由中配置的保存路径/" + req.file.filename

mvc意义

MVC 分层有助于管理复杂的应用程序，因为您可以在一个时间内专门关注一个方面。例如，您可以在不依赖业务逻辑的情况下专注于视图设计。同时也让应用程序的测试更加容易。 MVC 分层同时也简化了分组开发。不同的开发人员可同时开发视图、控制器逻辑和业务逻辑。

总结

Node.js实现了前后端分离，把mvc理解之后，所有的操作都是按部就班，前端请求到后端数据，只用根据请求到的数据来渲染页面，后端控制器里主要负责业务逻辑，模型里面保存的是数据(mongodb是非关系型数据库，需要转化成关系型数据库)。控制器联系着显示层和模型，它决定后端返回什么数据，前端能拿到什么数据。

编辑：千锋HTML5