乐趣区

Palantir开源项目-第一章节-SF社区成员打造

项目立项于 2019 年 10 月 17 日

GitHub 仓库地址

第一章节


一、Redis 鉴权,持久化 Session 存储的环境准备


操作系统:Mac os

全局安装Redis,MongoDB

安装成功后,命令行输入


redis-server


启动 Redis 服务 Redis默认占用端口6379

MongoDB默认端口是27017

安装 Node.jsRestFul服务需要的依赖


connect-redis     // 连接 redis

cookie-parser     //cookie 解析

express                //Node.js 框架

express-session //express 的 session 存储库

redis                    //redis

等依赖

二、服务端代码编写


鉴权的思路:

密码密文传输,存储

利用 Redis 进行持久化存储Session

需要写入数据库的内容可以集中式写入

没有储存 session 信息的,不能访问任何接口

使用 pm2 启动 Node.js 服务,保证服务端的健壮性

每次前端会发送请求是否免密码登陆,前往 Redis 拉取数据鉴定

例如免登陆鉴权的路由:


app.get('/authentication', (req, res) => {
  const result = req.session;
  if (result) {result.login && res.send(JSON.stringify({ code: 0, data: '免登陆'}));
      return;
  }
  res.send(JSON.stringify({ code: 1, data: '需要密码登陆'}));
  return;
});

完成一个需求,先把整体架构图看明白,再把流程图画出来,就成功了一半

上面的路由比较简单,如果这个人登陆过,持久化存储在服务端 Session 信息中的 logintrue, 那么就不需要密码登陆,前端给予控制路由即可。

登陆路由的思路:


每次登陆,如果没有的 username 自动注册

前端做账户密码的格式化检测

后端只负责检测密码是否正确、是否首次登陆等(考虑到高并发)

账户密码可以用 key-value 形式存储在 Redis 中(密码都是密文)

伪代码如下:

  redisClient.get(username, (err, value) => {if (value && password !== value) {res.send(JSON.stringify({ code: 2, data: '密码错误'}));
      return;
    }
    if (!req.session['login' && !value]) {redisClient.set(username, password);
      req.session['login'] = {username, login: true, password};
      res.send(JSON.stringify({ code: 0, data: '登陆成功'}));
      return;
    }
    res.send(JSON.stringify({ code: 0, data: '欢迎回来'}));
   

三、服务部署


由于我们项目需要用到 session 持久化存储,但是 session 其实本质利用了 Cookie 传输,而且存在跨域 所以需要在 axio、Node.js 服务端配置允许 Cookie 跨域

Axios

axios.defaults.withCredentials = true;

服务端伪代码:


app.all('*', function(req, res, next) {res.header('Access-Control-Allow-Origin', 'http://localhost:5000');
  res.header('Access-Control-Allow-Headers', 'X-Requested-With');
  res.header('Access-Control-Allow-Methods', 'PUT,POST,GET,DELETE,OPTIONS');
  res.header('X-Powered-By', '3.2.1');
  res.header('Content-Type', 'application/json;charset=utf-8');
  res.header('Access-Control-Allow-Credentials', 'true');
  next();});

上面项目的代码已经编写大致完毕,下面需要部署到阿里云服务器

首先购买一台轻量级服务器,选择 Node.js 环境

Node.js 代码通过苹果电脑自带的 ftp 传输到阿里云

输入密码鉴权后,

首先输入 put

然后拖入你的文件到命令行中,然后设置在阿里云服务器中的文件路径,回车。即可正常上传

之后在 Mac 自带的 ssh 命令行工具远程连接,启动 Node.js 服务

修改 Nginx 配置,反向代理 80 端口 —>Node.js的服务监听窗口

重启 Nginx 即可访问

至此,外网已经正常访问,接口调用正常

四、前端免密登陆、路由鉴权

根组件第一次被渲染时候发送 ajax 请求


const result = await authentication();
          if (result.code === 0) {alert('免登陆');
            this.props.history.replace('/video');
          }
如果有返回状态码 0,即可免登陆

五、前端用户名,密码格式化校验

客户端是一个人用,后端是一个接口很多人用

上面这句话时刻记着,如果校验不通过,那么就不应该有发送请求或做出某种损耗传输、耗时操作的能力

当然,我们项目不使用任何 UI 组件库,纯原生开发,包括后面的通信也是使用一样,使用 TCP 长连接传输

六、更新一次技术架构流程图

目前 RestFul 风格的服务端接口,已经部署。后面是长连接、静态资源服务器的代码部署到另外一台服务器上,然后通过 GRPC+PB 协议调用~

欢迎加入我们的微信群,关注我们的微信公众号:前端巅峰

也欢迎在下方给我们赞助,开源不易,欢迎 Star 支持

退出移动版