gzl的博客

  • 首页

  • 关于

  • 标签

  • 分类

  • 归档

进阶命令

发表于 2019-08-21 分类于 linux

df

查看磁盘空间,-h表示以可读性较高的形式展示大小

1
2
3
4
5
$ df -h
文件系统 容量 已用 可用 已用% 挂载点
udev 964M 0 964M 0% /dev
tmpfs 198M 6.5M 191M 4% /run
/dev/sda1 18G 11G 6.5G 62% /

free

查看内存的使用情况,-m 表示以 MB 为单位查看

1
2
3
4
$ free -m
total used free shared buff/cache available
Mem: 1971 841 260 18 870 957
Swap: 2044 0 2044

date

  1. %F:表示完整的年月日

  2. %T:表示完整的时分秒

  3. %Y:表示四位年份

  4. %m:表示两位月份(带前导0)

  5. %d:表示日期(带前导0)

  6. %H:表示小时(带前导0)

  7. %M:表示分钟(带前导0)

  8. %S:表示秒数(带前导0)

1
2
3
4
5
6
7
8
$ date
2019年 08月 21日 星期三 14:38:32 CST

$ date +%F # 等价于date "+%Y-%m-%d"
2019-08-21

$ date "+%F %T" # 等价于 date "+%Y-%m-%d %H:%M:%S"
2019-08-21 14:48:31

cal

1
2
3
4
5
6
7
8
$ cal # 等价于 cal -1 直接输出当前月份的日历
八月 2019
日 一 二 三 四 五 六
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31
1
2
3
4
5
6
7
8
9
$ cal -3 # 表示输出上一月+本月+下个月的日历
2019
七月 八月 九月
日 一 二 三 四 五 六 日 一 二 三 四 五 六 日 一 二 三 四 五 六
1 2 3 4 5 6 1 2 3 1 2 3 4 5 6 7
7 8 9 10 11 12 13 4 5 6 7 8 9 10 8 9 10 11 12 13 14
14 15 16 17 18 19 20 11 12 13 14 15 16 17 15 16 17 18 19 20 21
21 22 23 24 25 26 27 18 19 20 21 22 23 24 22 23 24 25 26 27 28
28 29 30 31 25 26 27 28 29 30 31 29 30
1
$ cal -y # 输出这一年的日历

clear

清屏

1
$ clear

|

管道号|,不能单独使用,必须配合指令一起使用,起辅助作用。

过滤根目录下包含 y 的文件,grey 用于过滤,以管道为分界线,管道前面的输出就是后面指令的输入

1
2
$ ls /|grep y
sys

基础命令

发表于 2019-08-21 分类于 linux

因为 mac 和 win10 的一些命令会有不同,所以下面的命令是在 powershell 中运行的,不能运行成功的就是在 git 下运行的

pwd

1
2
# 使用命令 "pwd" (print working directory)会得到当前的全路径信息
pwd

cd

1
2
# 一个点(.)代表当前路径,两个点(..)代表父级路径,使用cd ..可以到父级路径
cd ..

ls

命令行 “ls” (list) 是可以帮助我们查看当前文件夹下拥有哪些文件及文件夹,ls -a(all) 代表展示所有文件(包含隐藏文件),ls -l(longer) 代表展示更多文件的信息。

1
2
3
4
5
6
7
8
9
$ ls
dir/ README.md test.md text.txt

$ ls -a
./ ../ .git/ .gitignore dir/ README.md test.md text.txt

$ ls -l

$ ls -al

mkdir

命令 mkdir(make directory) 表示在当前文件夹中创建新的文件夹

1
mkdir images

touch

命令 touch 表示在当前路径下创建一个文件类型

1
$ touch hello.html

mv

命令 mv(move) 可以做两件事,一个是移动,另一个是重命名

1
2
3
4
5
6
# 下面这条命令会把 a.txt 重命名为 b.txt
mv a.txt b.txt
# 下面这条命令会把 b.txt 移动到 images 文件夹下
mv b.txt ./images
# 下面这条命令会把 images 文件夹下的 b.txt 移回
mv ./images/b.txt ./

rm rm-rf

命令 rm(remove) 可以实现删除文件(永久删除,不放回回收站)

1
2
# 下面这条命令会把 b.txt 删除
rm b.txt

删除文件夹需要使用 rm-r(recursive),也可以使用 rm-f(force) 实现强制删除

1
2
# 下面这条命令会把 abc 这个文件夹删除,不管有没有权限
$ rm -rf abc

vue-fund-manage记录

发表于 2019-08-19 更新于 2019-10-13 分类于 vue

依赖总结

后端部分

1
2
3
4
5
6
7
8
9
10
"dependencies": {
"bcrypt": "^3.0.6", // 进行密码的加密
"body-parser": "^1.19.0", // post请求
"concurrently": "^4.1.1", // 前后端连载
"express": "^4.17.1", // express框架
"jsonwebtoken": "^8.5.1", // 生成token
"mongoose": "^5.6.9", // mongoose框架
"passport": "^0.4.0", // passport配合passport-jwt实现token验证
"passport-jwt": "^4.0.0"
}

前端部分

1
2
3
4
5
6
7
8
9
"dependencies": {
"axios": "^0.19.0", // 进行数据请求
"core-js": "^2.6.5",
"element-ui": "^2.11.1", // elementUI
"jwt-decode": "^2.2.0", // token的解析
"vue": "^2.6.10",
"vue-router": "^3.0.3",
"vuex": "^3.0.1"
}

token

生成token

https://www.npmjs.com/package/jsonwebtoken

后端代码 users.js 登录成功部分节选

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
const jwt = require('jsonwebtoken');
const keys = require('../../config/keys.js'); // "secret"
if (isMatch) {
const rule = {
id: user.id,
name: user.name,
identity: user.identity
};
// 规则 加密名字 过期时间 箭头函数
jwt.sign(rule, keys.secretOrKey, {expiresIn: 3600}, (err, token) => {
if(err) throw err;
res.json({
success: true,
token: "bearer " + token
})
})
}

验证token

https://www.npmjs.com/package/passport

https://www.npmjs.com/package/passport-jwt

passport初始化

后端代码 index.js 节选

1
2
3
4
const passport = require('passport');
// passport初始化
app.use(passport.initialize());
require('./config/passport.js')(passport);

后端代码 passport.js 节选

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
const JwtStrategy = require('passport-jwt').Strategy,
ExtractJwt = require('passport-jwt').ExtractJwt;
const mongoose = require('mongoose');
const User = mongoose.model('users');
const keys = require('../config/keys.js');

const opts = {}
opts.jwtFromRequest = ExtractJwt.fromAuthHeaderAsBearerToken();
opts.secretOrKey = keys.secretOrKey;

module.exports = passport => {
passport.use(new JwtStrategy(opts, (jwt_payload, done) => {
// console.log(jwt_payload);
User.findById(jwt_payload.id)
.then(user => {
if (user) {
return done(null, user);
}
return done(null, false);
})
.catch(err => console.log(err))
}));
}

进行请求

必须带着 token 才能请求成功。使用 postman 进行测试时要设置 headers 部分的 Authorization 为登录请求后得到的 token 值,在这个项目中,只有登录和注册是不带 token 验证的。

后端代码 profiles.js 节选

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
// $route POST api/profiles/add
// @desc 添加信息接口
// @access Private
router.post('/add', passport.authenticate('jwt', { session: false }),(req, res) => {
const profileFields = {};
// console.log(req.user);

if (req.body.type) profileFields.type = req.body.type;
if (req.body.describe) profileFields.describe = req.body.describe;
if (req.body.income) profileFields.income = req.body.income;
if (req.body.expend) profileFields.expend = req.body.expend;
if (req.body.cash) profileFields.cash = req.body.cash;
if (req.body.remark) profileFields.remark = req.body.remark;

new Profile(profileFields)
.save()
.then(profile => {
res.json(profile)
})
})

后端代码 users.js 节选

前端部分并没有使用 current 这个接口,这个接口只是为了了解 token ,特别是下面 req.user 部分,个人觉得 req.user 部分就代表 token 验证成功,表示谁去请求。

1
2
3
4
5
6
7
8
9
10
11
12
// $route GET api/users/current
// @desc return current user
// @access Private
router.get("/current", passport.authenticate('jwt', { session: false }), (req, res) => {
// console.log(req.user.identity);
res.json({
id: req.user.id,
name: req.user.name,
email: req.user.email,
identity: req.user.identity,
});
})

请求拦截响应拦截

前端代码中 http.js 节选

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
// 请求拦截
axios.interceptors.request.use(config => {
// 加载动画
startLoading();
if (localStorage.eleToken) {
// 设置统一的请求header
config.headers.Authorization = localStorage.eleToken;
}
return config;
}, error => {
return Promise.reject(error);
})

// 响应拦截
axios.interceptors.response.use((response) => {
// 结束加载动画
endLoading();
return response;
}, (error) => {
endLoading();
Message.error(error.response.data);

// 获取错误状态码
const { status } = error.response;
if (status === 401) {
Message.error('token失效,请重新登录');
// 清除token
localStorage.removeItem('eleToken');
// 跳转到的登录页面
router.push('login');
}
return Promise.reject(error);
});

vuex

前端部分 store.js 代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

const types = {
SET_AUTHENTICATED: 'SET_AUTHENTICATED',
SET_USER: 'SET_USER'
}

const state = {
isAuthenticated: false,
user: {}
}

const getters = {
isAuthenticated: state => state.isAuthenticated,
user: state => state.user
}

const mutations = {
[types.SET_AUTHENTICATED](state, isAuthenticated) {
if (isAuthenticated) state.isAuthenticated = isAuthenticated;
else state.isAuthenticated = false;
},

[types.SET_USER](state, user) {
if (user) state.user = user;
else state.user = {};
}
}

const actions = {
setAuthenticated: ({commit}, isAuthenticated) => {
commit(types.SET_AUTHENTICATED, isAuthenticated);
},
setUser: ({commit}, user) => {
commit(types.SET_USER, user);
},
clearCurrentState: ({commit}) => {
commit(types.SET_AUTHENTICATED, false);
commit(types.SET_USER, null);
}
}

export default new Vuex.Store({
state,
getters,
mutations,
actions
})

前端部分 Login.vue 代码节选

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
this.$axios.post("/api/users/login", this.loginUser)
.then(res => {
// console.log(res);
// token
const { token } = res.data;
// 存储到 ls
localStorage.setItem('eleToken', token);
// 解析token
const decoded = jwt_decode(token);
// console.log(decoded);

// token 存储到vuex中
this.$store.dispatch("setAuthenticated", !this.isEmpty(decoded));
this.$store.dispatch("setUser", decoded);

this.$router.push('/index');
})

总结流程

首先进入 register 或者 login 页面,因为有路由守卫,所以不能直接进入 index 页面,进行注册,然后登录,登录会返回后端生成的 token ,存储 token 到 localStorage 中,并解析 token 存储到 vuex 中,设置授权 setAuthenticated 为真,setUser 为 token 解析后的用户信息,如果登录失败,可能是 token 过期失效,如果退出登录的话,会删除 localStorage 中的 token,并将 vuex 中的存储清除。

进行对数据的增删改查需要带上 token ,在请求拦截与响应拦截中有相关的配置。

1…161718…32

gzl

96 日志
14 分类
37 标签
© 2020 gzl
由 Hexo 强力驱动 v3.7.1
|
主题 – NexT.Pisces v7.2.0