gulp 学习笔记

在 gulp 的任务中,gulp.src 接口将匹配到的文件转化为可读的文件流,通过 .pipe 流经各插件进行处理,最终推送给 gulp.dest 所生成的可写文件流,生成文件写入磁盘。其中涉及到下面几个重要的库:

Vinyl

Vinyl 是一个文件描述器,通过它可以在内存中构建临时文件对象。

1
2
3
const Vinyl = require('vinyl')
const empty = new Vinyl()
console.dir(empty)

最终打印出来:

1
2
3
4
5
6
7
File {
stat: null,
_contents: null,
history: [],
_cwd: '/job/gulp-tutorial',
_isVinyl: true,
_symlink: null }

Read More

Angular 中 video 自动静音播放

在页面里面加了一个 video,想让这个视频在页面加载之后自动播放,用下面的写法:

1
2
3
4
5
6
7
8
9
10
11
 <video
id="officeVideo"
preload="metadata"
poster="assets/media/office.jpg"
playsinline
autoplay
muted
loop
>
<source src="assets/media/office.mp4" type="video/mp4" />
</video>

但是在谷歌浏览器下测试,发现第一次可以自动播放,再刷新就暂停了,很奇怪,网上找了一些解决方案开始尝试,例如下面的代码用 jQuery 找到这个 video 元素,手动调用 play 函数:

1
2
3
const el = $('#officeVideo')
const video = el.get(0)
video.play()

Read More

syslog 学习笔记

syslog 服务器可以用作日志监控中心,这样更容易地查看和获取重要的日志消息。rsyslog 是 syslog 的守护进程,预装在了大多数的Linux发行版中,扮演了两种角色:

  1. 作为服务器收集来自其他设施的日志信息;
  2. 作为客户端将其内部的日志信息传输到远程的 syslog 服务器。

相关文件的位置如下:

  • 执行文件: /sbin/rsyslogd
  • 主配置文件: /etc/rsyslog.conf
  • 自定义配置文件: /etc/rsyslog.d/*.conf

通过下面的命令可查看状态和重启服务:

1
2
service rsyslog status # 查看状态
/etc/init.d/rsyslog restart # 重启服务

Read More

logspout 集中查看日志

logspout 可以把某宿主机上所有 docker 容器的日志集中到一起,方便用户查看,本身也可以用 docker 安装:

1
2
3
4
docker run -d --name="logspout" \
--volume=/var/run/docker.sock:/var/run/docker.sock \
--publish=127.0.0.1:8000:80 \
gliderlabs/logspout

这样就可以在命令行查看日志了:

1
2
3
4
5
6
# 查看所有日志
curl http://127.0.0.1:8000/logs
# 查看名以 api 开头的容器的日志
curl http://127.0.0.1:8000/logs/name:api*
# 指定返回 json 格式
curl http://127.0.0.1:8000/logs/name:api* -H 'Accept: application/json'

Read More

使用goaccess分析Nginx日志

首先安装 goaccess:

1
2
brew install goaccess # Mac
yum -y install goaccess # centos

安装完成之后,就可以用 goaccess 为 Nginx 的日志生成 html 版本的报告了,首先我们要获取 Nginx 日志,正好有一个正在运行的 Nginx:alpine 容器,进去看一下:

1
2
3
4
5
6
$ cat /etc/nginx/nginx.conf
error_log /var/log/nginx/error.log warn;

http {
access_log /var/log/nginx/access.log main;
}

发现默认情况下被存储在 /var/log/nginx 目录下:

1
2
3
4
$ ls -l /var/log/nginx/
total 0
lrwxrwxrwx 1 root root access.log -> /dev/stdout
lrwxrwxrwx 1 root root error.log -> /dev/stderr

Read More

logstash 嵌套 json

使用 json 插件,数据输入:

1
{"name":"bob","last":"builder", "atts":"{\"a\":111, \"b\":222}"}

希望得到:

1
2
3
4
5
6
7
8
{
"name": "bob",
"last": "builder",
"atts": {
"a": 111,
"b": 222
}
}

但实际得到:

1
2
3
4
5
{
"name": "bob",
"last": "builder",
"atts": "{\"a\": 111,\"b\": 222}"
}

Read More

redux-form学习笔记

首先要根据 formReducer 绑定到项目的 store 里面:

1
2
3
4
5
6
7
8
9
import { createStore, combineReducers } from 'redux'
import { reducer as formReducer } from 'redux-form'

const rootReducer = combineReducers({
..., // 其他的 reducer
form: formReducer // 必须把 formReducer对应到 form 键
})

const store = createStore(rootReducer)

然后在组件中引用 redux-form 相关组件:

Read More