【内推字节】欢迎简历chengxinsong@bytedance.com

songEagle-backManage专栏:登陆篇

打算写个专栏,这个可以把一系列的文章放在一起,供更多开发者来交流学习。


一、初始化vue项目

vue init webpack structure

项目结构



二、调整项目结构

1、新建server文件夹,存放后端服务

2、引入koa

前提:node v7.6.0 以上版本

npm install koa --save

在server文件夹下创建程序入口文件:app.js

const Koa = require('koa')
const app = new Koa()

// response
app.use(ctx => {
  ctx.body = 'Hello Koa'
})

app.listen(3000)

3、路由和controller

Koa本质上是调用一系列的中间件,来处理对应的请求,并决定是否传递到下一个中间件去处理。

个人觉得,接口就是根据不同的请求连接干不同的事情,返回相应的结果,需要一个路由中间件koa-router来处理分发请求。

npm install koa-router --save

因为koa是很纯粹的,你提交的数据,它并不会帮你处理。所以需要引用一个中间件来处理提交的数据--bodyparserkoa-json

npm install koa-bodyparser --save

npm install koa-json --save

不能把所有的接口都写在这一个文件,所以我们得改变一下项目结构。

理一下思路,路由的配置文件router为一个模块,接口的方法应该按业务模块分成一个个controller为一个模块,koa的配置文件为一个模块



4、koa处理静态资源中间件

koa的中间件koa-static

npm install koa-static --save

koa中间件koa-static能将项目的某个目录(一般是static或者public目录)的文件映射到路由上,使得这些文件能通过url在浏览器访问到。 
koa-static并没有列出所有文件的功能,想要实现这一功能,只能自己写中间件处理了。

看一下源码

 if (!opts.defer) {
    return async function serve (ctx, next) {
      let done = false

      if (ctx.method === 'HEAD' || ctx.method === 'GET') {
        try {
          // koa-send 输入的path不存在时抛错(404或者500)
          done = await send(ctx, ctx.path, opts)
        } catch (err) {
          // 如果错误码是404说明请求的不是静态文件
          if (err.status !== 404) {
            throw err
          }
        }
      }

      //  请求不是静态文件  继续执行下面的逻辑
      if (!done) {
        await next()
      }
    }
  }

  return async function serve (ctx, next) {
    await next()

    // 假如请求方法不是get  必然不是访问静态资源
    if (ctx.method !== 'HEAD' && ctx.method !== 'GET') return
    // 说明对请求已经做了响应
    if (ctx.body != null || ctx.status !== 404) return // eslint-disable-line

    try {
      await send(ctx, ctx.path, opts)
    } catch (err) {
      if (err.status !== 404) {
        throw err
      }
    }
  }

它做的工作是根据传入的path查找文件是否存在,如果存在就创建一个流,不存在就抛出错误。


5、koa处理token问题中间件jwt

验证jwt的koa中间件

npm install koa-jwt --save

使用 jsonwebtoken 的 sign() 方法来生成 token 的,那么 koa-jwt 做了些什么帮我们来验证 token。

具体可以参考这篇文章:https://www.mwcxs.top/page/454.html


6、koa处理session存储中间件koa-session2

npm install koa-session2 --save

使用session来管理会话,用一个sessionId来表明用户已登录。session结合cookie管理会话在web应用中是很常见的。用一个store来继承session中的koa-session2中的store,主要是将sessionid持久化到redis中,本文使用了ioredis来连接redis数据库。 

然后当ctx的session改变的时候会触发koa-session2中的方法。

登录成功之后可以把用户信息存入session中。koa-session2会将sessionId写入cookie,再把session对象写入redis,键值为sessionID,这样每次客户端的请求带上sessionID我们就可以从redis中取登录用户信息。也可以通过是否有sessionID来做会话拦截。 

退出的时候只要将ctx.session置为{}就可以了。


7、安装koa处理的ioredis

npm install ioredis --save

ioredis是使用redis进行数据的缓存,快速进行数据的交互,使用的计算机的内存进行数据的存取,速度肯定比从数据库存取数据快,缺点就是不能用于存取大量的数据。

var Redis = require('ioredis');
var redis = new Redis();

redis.set('foo', 'bar');
redis.get('foo', function (err, result) {
  console.log(result);
});

// Or using a promise if the last argument isn't a function
redis.get('foo').then(function (result) {
  console.log(result);
});

// Arguments to commands are flattened, so the following are the same:
redis.sadd('set', 1, 3, 5, 7);
redis.sadd('set', [1, 3, 5, 7]);

// All arguments are passed directly to the redis server:
redis.set('key', 100, 'EX', 10);
感谢你的阅读,本文由 sau交流学习社区 版权所有。
如若转载,请注明出处:sau交流学习社区-power by saucxs(程新松)(/page/442.html)
交流咨询
    官方QQ群
    群号663940201,欢迎加入!
    sau交流学习社区交流群

微信群
欢迎加入微信群
微信公众号
欢迎关注微信公众号

图文推荐

微信群
saucxs聊天机器人
saucxs
hi ,欢迎来到sau交流学习社区,欢迎与我聊天,问我问题哦!
您正在使用的浏览器是,不在支持范围内!
为了您的正常使用与展示,推荐使用Chrome浏览器68以上版本
支持浏览器:
火狐浏览器最新版
Safari浏览器最新版
Edge浏览器最新版
IE浏览器10,11