记一次前后端分离使用 token 登录解决方案(node jwt + Vue axios)

前言

最近在帮校友写一个项目,欣音悦(以歌单歌单分享为主的音乐 webapp)。这是一个类似于 QQ 音乐的 webapp 目前还在开发中,其中歌曲数据和歌手数据来自于 QQ 音乐的接口,而歌单数据则存在本地数据库中。校友的需求是用户能添加歌单并分享,能听歌,能评论。所以就涉及用户登录状态保持,而我也是首次尝试使用后 token 方案进行登录处理,所以就写这篇博文记录下。


Node.js + Express + mongodb 的博客项目之总结(十一)

前言

之前一直想做一个前后端都完整的个人项目,但由于当时还在学校进行实训2的学习,就一直没有多少时间着手,所以就在暑假的时候将这个项目做了起来。技术栈上采用 Node.js + Express + mongodb,经过了断断续续的开发,如今完成了这个项目的大部分基本功能,今天抽个时间写了个总结。项目的代码我全程托管到 GitHub 上,项目地址 https://github.com/tflins/node_blog


Node.js + Express + mongodb 的博客项目之评论系统(十)

前言

本节内容主要是构建一个对博客文章的评论功能,由前端使用 ajax 通过 GET 方式向 /api/comment/post 路由提交评论,服务器再将其保存在数据库中。当用户没有登录时,会提示用户没有登录,不能评论。用户登陆以后,会显示一个评论文本框,用来给用户提交评论,提交后的评论会使用 ajax 进行局部刷新在博客文章的下方显示出来。提交的时候,会在前端进行简单的验证吗,验证通过后才能提交评论,否则 return false。



Node.js + Express + mongodb 的博客项目之博客文章内容详情界面及文章评论(九)

前言

本节内容中将实现博客的文章详情页面还有文章的评论功能。博客的文章详情页面与博客的首页的页头是一样的,所以为了以后便于维护,就将两个页面的页头给分离出来作为一个单独的模块 header.ejs 然后在两个页面中引入该页头模块。博客的文章内容详情的路由设计为 /views?contentId=XXX ,前端通过 GET 方式向后端提交需要渲染出来的内容的 id 。而 Markdown 渲染文章的内容则是通过 marked 模块来将内容渲染成相应 html 后,再在模板引擎中使用 <- include()> 引用。



Node.js + Express + mongodb 的博客项目之博客内容的前台展示(八)

前言

前台内容的展示,是将博客的文章内容从数据库中查询出来,再将数据绑定给模板引擎,由模板引擎渲染出来。由于博客首页的数据是需要分页展示的所以就需要调用之前自己定义的的博客分页处理模块 /my_modules/pagination.js ,但在此之前得先将博客的文章分类信息从数据库中查询出来,在查询博客分类信息的回调函数中来调用 pagination.js 渲染内容。



Node.js + Express + mongodb 的博客项目之博客内容的后台管理(七)

前言

博客内容的管理,与博客文章分类的管理基本上类似。都是分别有几个路由对应相应的功能,GET /admin/content 对应文章内容的首页,GET /admin/content/add 对应内容的添加,GET /admin/content/edit 是内容的修改编辑,GET /admin/content/delete 则为博客内容的删除路由。



Node.js + Express + mongodb 的博客项目之前端ejs模块化及博客分类管理、分页功能实现(六)

前言

模块化开发,主要是以提高代码的复用性,可维护性等。再这个博客项目中,到处体现有模块化开发的思想,如使用 MVC 的设计模式,路由的分文件处理等。在 ejs 模板引擎中,类似 jsp 一般可以将里面的各个内容分成不同的模块,然后再分别引入相关模块组成页面,这样一来就可以做到了代码的复用性,同时维护起来的成本也降低。



Node.js + Express + mongodb 的博客项目之后台管理界面及用户管理(五)

前言

前面的几篇博文中,基本实现了博客的登录注册,及区分管理员账户和普通账户。在本节中,将搭建管理员的后台管理页面,还有对注册用户的管理。



Node.js + Express + mongodb 的博客项目之保持用户登录,区分管理员账户,及用户登出(四)

前言

在上一节中,完成了用户的注册与登录,但是并没有保持用户登录,一刷新浏览器登录状态就没有了。所以在本节内容中将实现用户登录状态的保持,同时进行普通用户与博客管理员的区别,并且实现用户登出接口。



Node.js + Express + mongodb 的博客项目之模板引擎的配置及用户登录、注册(三)

前言

在这一节中,我们将会进行模板引擎的配置,以及博客前台的界面设计、并且设计博客的用户数据结构及连接数据库,实现用户的注册、登录。写得比较的详细,所以篇幅会较长,



Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×