四、JWT在Koa框架中实现用户的认证与授权
JWT是什么 JSON Web Token是一个开放标准（RFC7519) 定义了一种紧凑且独立的方式，可以将各方之间的信息作为json对象进行安全传输 该信息可以验证和信任，因为是经过数字签名的。 JWT的构成 Header typ TOKEN的类型，固定为JWT alg 使用hash算法 Payload 存储需要传递的信息，如用户ID、用户名等 还包含元数据，如过期时间、发布人等 与 Header不同， Payload可以加密 Signature 对 Header和 Payload部分进行签名 保证 Token在传输的过程中没有被篡改或者损坏 NodeJs中使用JWT 安装jsonwebtoken 1yarn add jsonwebtoken 使用 12const jsonwebtoken = require('jsonwebtoken')const token = jsonwebtoken.sign({ _id, name }, secret, { expi ...
三、NodeJs链接MogoDB云数据库
MongoDB使用云数据库 注册用户 创建数据库 添加用户 设置白名单地址 链接数据库 使用数据库 安装mongoose 1yarn add mogoose 链接数据库 复制上一步的字符串，并替换掉其中的数据。例如<password>和<dbname> 在入口文件链接数据库 1234567const mongoose = require('mongoose')// 通过配置文件导入链接字符串const { connectionStr } = require('./config')mongoose.connect(connectionStr, { useUnifiedTopology: true, useNewUrlParser: true }, () => { console.log('链接成功了');}) 创建用户模型 新建一个schema文件夹，在这个文件中写我们的数据库模 ...
二、Koa的基本使用
初始化项目 安装依赖 12yarn add koayarn add nodemon -D 简单的Hello World 12345678const Koa = require('koa')const app = new Koa()app.use((ctx) => { ctx.body = 'Hello World'})app.listen(3000) nodemon使用了内部安装，因此需要在package.json中写运行脚本才可以使用。 12345{ "scripts": { "server": "nodemon index.js" }} 路由 一个简单的判断路由路径和请求方法 1234567app.use(async (ctx) => { if (ctx.url === '/' && ctx.method == " ...
一、RESTful API 理论
什么是REST及限制 REST的六个限制 客户-服务器 关注点分离 服务端专注数据存储，提升了简单性 前端专注用户界面，提升了可移植性 无状态 所有用户会话信息都保存在客户端 每次请求必须包括所有信息，不能依赖上下文信息 服务端不用保存会话信息，提升了简单性、可靠性、可见性 缓存 所有服务端响应都要被标为可缓存或不可缓存 减少前后端交互，提升了性能 统一接口 接口设计尽可能统一通用，提升了简单性、可见性 接口与实现解耦，使前后端可以独立开发迭代 分层系统 每层只知道相邻的一层，后面隐藏的就不知道了 客户端不知道是和代理还是真实服务器通信 其他层：安全层、负载均衡、缓存层等 按需代码 客户端可以下载运行服务端传来的代码（比如JS) 通过減少ー些功能，简化了客户端 统一接口的限制 资源的标识 通过表述来操作资源 表述就是 Representation，比如JSON、XML等 客户端不能直接操作（比如SQL）服务端资源 客户端应该通过表述（比如JSON）来操作资源 自描述消息 每个消 ...
7、谷粒后台后续操作
图表介绍 echarts https://echarts.baidu.com/ 百度开源, 如果要在react 项目中使用, 需要下载echarts-for-react G2 https://antv.alipay.com/zh-cn/g2/3.x/index.html 阿里开源 bizcharts https://bizcharts.net/products/bizCharts 基于react 包装G2 的开源库，需要额外下载@antv/data-set d3 https://d3js.org.cn/ 国外的免费可视化图表库 简单使用 安装插件 1yarn add echarts echarts-for-react bizcharts @antv/data-set 柱形图 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667import React, { ...
6、谷粒后台使用redux管理数据
环境准备 安装插件 1yarn add redux react-redux redux-thunk redux-devtools-extension 在入口index.js文件中包装 12345678910111213141516171819/** * 入口文件 */import React from 'react';// 引入reduximport { Provider } from 'react-redux'import ReactDOM from 'react-dom';import memoryUtils from './utils/memoryUtils'import storageUtils from './utils/storageUtils'import App from './App';import store from './redux/store'const user = storageUtils ...
AppStore降价监控
项目说明 限免是个好东西，为了不错过心爱App的限免活动，因此写下这个脚本用于监控自己心爱的App是否发生了价格变动。 快速开始 fork项目 地址：https://github.com/Dreamy-TZK/AppStorePrice 点击右上角的fork即可，难度系数为0 打开actions设置 点击绿色的按钮即可。 添加server酱提醒 填入你的server酱中的SCKEY即可 修改监控app 找到src/list.json文件，点击编辑。 1234567[ { "id": App的ID, "country": 国区, "name": 可不填，主要是为了方便用户分辨该id是什么app }] 示例 1234567[ { "id": 1161125462, "country": "cn", "n ...
5、谷粒后台用户、角色管理组件
基本布局 123456789101112131415161718<Table bordered rowKey='_id' dataSource={roles} columns={this.columns} pagination={{ defaultPageSize: PAGE_SIZE }} rowSelection={{ type: 'radio', selectedRowKeys: [role._id], onSelect: (role) => { // 选择某个radio时回调 this.setState({ role }) ...
4、谷粒后台商品管理组件
基本路由 1234567<Switch> <Route path='/product' component={ProductHome} exact /> {/*路径完全匹配*/} <Route path='/product/addupdate' component={ProductAddUpdate} /> <Route path='/product/detail' component={ProductDetail} /> <Redirect to='/product' /></Switch> 两种分页技术 前台分页 后台直接返回全部数据 后台分页 后台返回给前台当前页数与总页数 前台需要传递当前页码数与每页数量 跳转路由时传递参数 跳转路由 1this.props.history.push('/pr ...
