通过Webkit远程调试协议监听网页崩溃.

背景介绍

因为正在开发一个项目,而这个项目使用到了puppeteer,其中有个功能是在puppeteer打开的chrome里打开多个Tab,并进行管理。
虽然puppeteer可以打开多个网站,但是并不利于管理,所有我使用的是插件的方式,通过插件来打开多网站,并进行管理。

但是这里有个需求是,当网站崩溃时,我要做出一些操作。但是目前网上没有一个好的办法去监听当前网站是否崩溃。

可能有同学会说:puppeteer不是提供了一个page.on('error', fn)的方法,来进行监听么?

请注意上文中提到的,使用插件打开多个网站,puppeteer提供的方法只能对自己打开的网站起作用,没有使用puppeteer打开的网站,page.on('error', fn)方法无能为力。

使用Service Workers

这个方法是由我同事Haitao提出来的思路。

在当前网站上运行一个Service Workers,因为在运行的时候Service Workers会再启动一个单独的进程,当前网站和Service Workers是两个单独的进程。也就是说当网站崩溃时,并不影响Service Workers进程。所以可通过心跳检测来进行判断网站是否崩溃。

聊聊RxJS中的错误重试

前言

最近工作中有一个需求是:如果这个请求超时,则进行重试,且重试次数可配置。

首先我们发请求使用的库为:Axios,其处理请求的位置,是在 redux-observable 中的 epic 里。

那么如果要完成重试机制的话,有两种办法:

  • 在对 Axios 封装的函数里添加重试代码
  • epic 里,使用 RxJS 操作符进行重试。

关于 Axios 重试的,其实比较麻烦的,而且需要在原有封装好的函数里,继续添加重试代码,总感觉不太好。且维护起来也不太方便。于是那就使用 RxJS 操作符进行重试吧。本文代码将不会套用项目代码,而是重新写一个 Demo,方便理解。

读书笔记:从Lucene到Elasticsearch:全文检索实战

从Lucene到Elasticsearch:全文检索实战

当前的笔记只介绍 Elasticsearch 的搜索部分。

文章中的搜索都是在 kibanaDev tools 进行查询的。

准备工作

需要安装 Elasticsearchkibanaelasticsearch-analysis-ik

具体的安装方式,这里就不再阐述了。(安装完,记得重启 Elasticsearch

重启完成后,打开 kibanaDev tools,输入下面的DSL代码,并运行:

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
PUT books
{
"settings": {
"number_of_replicas": 1,
"number_of_shards": 3
},
"mappings": {
"IT": {
"properties": {
"id": {
"type": "long"
},
"title": {
"type": "text",
"analyzer": "ik_max_word"
},
"language": {
"type": "keyword"
},
"author": {
"type": "keyword"
},
"price": {
"type": "double"
},
"year": {
"type": "date",
"format": "yyyy-MM-dd"
},
"description": {
"type": "text",
"analyzer": "ik_max_word"
}
}
}
}
}

JavaScript集成Sentry

Sentry-JavaScript

Sentry是一套用于捕获产品错误的开源项目,其下支持很多语言、框架。

这里就只阐述在前端JavaScript方向的处理操作

在我们公司之前的应用场景里,很多项目都是使用kibana来做信息统计。但是我们无法清楚的知道应用的运行状态是怎么样的。当某个客户在使用我们开发产品时,如果报错、崩溃。用户只能向客服寻求帮助,再交接给我们的开发人员进行复现、修复。其中因为不清楚具体的数据,开发人员是在复现时会非常的耗时。

Sentry的用途就是解决这一痛点问题,让开发人员快速准确的定位到问题的根源所在,以达到快速修复,让开发人员更注重于开发新的功能上面。减少时间资源上的浪费。

JavaScript

接入

因为Sentry使用的是一种Hook错误函数的技术,来达到捕获错误的目的,所以我们基本可以无损耗的接入到现有的项目中去。

下面是ReactSentry进行结合的一些基本步骤。

分析axios源码来找出无法使用all和spread等方法的原因

前言

如果你在使用axios的时候,是使用axios.create({})方法来进行创建axios的,那么你会发现你无法使用allspreadCancelCancelTokenisCancel方法。

我上网查了相关的问题,axios维护者们都是让你重新引入axios package来进行完成任务。我不喜欢这种方法,因为重新引入的话,那我的axios配置就会丢失,需要重新配置一遍,太过麻烦。

因为我们项目很多时候,不想使用默认的配置,想使用自定义设置的axios实例。比如设置基础URL和超时时间:

基于vue-simplemde实现图片拖拽、粘贴功能的一些思考

前言

项目使用的是vue框架,需要一个markdown的编辑框,就在npm上找了一下,发现simplemde挺不错的,由于我比较懒,就顺便在npm又搜了一下,找到了vue-simplemde这个package,那就开始使用它吧。

但是这个vue-simplemde不支持图片拖拽上传、粘贴上传,也不能说是因为这个vue-simplemde,因为vue-simplemde只是对simplemde的基础上封装成一个Vue插件。所以最后还是由于simplemde没有提供相关的功能,但是为了用户体验考虑,这个功能时必要的,除非不使用markdown编辑器。而去使用富文本编辑器,那样的话,项目很多的代码都要进行更改。所以就在网上查了文章,及在github上查了一些代码。下面将进行分析

在vmware里运行qcow2镜像

前言

因为一些原因,需要在自己的笔记本上运行qcow2镜像。做个OpenStack平台吧,系统配置吃不消。想试一下能不能在vmware里直接跑qcow2镜像。网上的答案都是使用qemu-img工具进行转化,但是都后面也就没有说明了。于是自己折腾了一下,把过程记录一下。

准备

需要先下载qemu-img工具,因为我是在windows64位上,所以就下载了win64的镜像,工具安装好后,最好在环境变量里的PATH里加入下一安装目录,方便后面的操作

Vmware虚拟机、qcow2原始镜像包就不说了,必备的。

对Promise增加统一操作扩展

前言

在ES6里,增加了Promise方法。而Promise的回调函数只有thencatch两种方法。

而后,Promise又添加了两种附加方法,当然需要自己去添加进去。

可以去看一下上文的链接去了解一下,或者去下面的链接,看下官方源码是如何实现的: donefinally

Numpy & Pandas & Matplotilb部分API操作

Numpy

导入

import numpy as np

API

创建数组

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
np.array([10, 11, 12, 13])
# [10 11 12 13]


np.array([10, 11, 12, 13, 14 ,15]).reshape([2,3])
# [
# [10 11 12]
# [13 14 15]
# ]


np.array([[1, 2], [3, 4]])
# [
# [1 2]
# [3 4]
# ]


np.arange(4)
# [0 1 2 3]


np.arange(2, 6)
# [2 3 4 5]


np.arange(4).reshape([2,2])
# [
# [0 1]
# [2 3]
# ]


np.random.random([2,3])
# [
# [ 0.00136044 0.46854718 0.59149907]
# [ 0.75636339 0.18204628 0.53191402]
# ]

基于Vue+Koa的pm2配置

背景介绍

目前使用的技术栈是:前端Vue、后端Koa、数据库Mongodb。

然而每当起服务的时候,都要npm startnode ./server/app.js,还要同时保持这两个窗口一直是开着的,很是麻烦。

而且因为我使用的是koa,也没有使用狼叔写的koa脚手架。是自己基于廖雪峰老师的Koa框架 改的一个小型mvc。导致没有热更新。

为了简化这种没必要的操作及增加热更新,开始想怎么进行优化。于是选择了pm2

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×