0%

问题

安装 Jenkins 之后我要用 Jenkins 拉取 github 仓库,但是我碰到了个奇怪问题

就是以 git@github.com:mtrucc/ice-electron.git 这种格式拉取仓库,不选择凭据,或者凭据选择用户名密码,总是返回

1
2
3
4
5
6
7
无法连接仓库:Command "git ls-remote -h -- git@github.com:mtrucc/ice-electron.git HEAD" returned status code 128:
stdout:
stderr: git@github.com: Permission denied (publickey).
fatal: Could not read from remote repository.

Please make sure you have the correct access rights
and the repository exists.

过程

在此之前我自己已经添加过 ssh-keygen 到 github ssh 配置中了。

网上的解决方法也有不少,但都没用

比如执行 sudo su jenkins 切换到 jenkins 用户拉一遍仓库。

或者在 /home/jenkins 文件夹生成密钥后提权 chown jenkins:jenkins id_rsa id_rsa.pub

后来我又试验了一下将链接换成 https://github.com/mtrucc/ice-electron.git 就不存在上面的问题了。

我对比了一下命令行执行

1
2
git ls-remote -h -- git@github.com:mtrucc/ice-electron.git HEAD
git ls-remote -h -- https://github.com/mtrucc/ice-electron.git HEAD

这两个命令的返回结果其实是一致的,但是jenkins

但这样解决的话,我实在是非常别扭,找不到原因。

解决方式

后来我又执行 cat ~/.ssh/id_rsa 将私钥提取出来,然后在Jenkins中添加了 SSH Username with private key 类型的凭据,username填的root,key是将刚刚提取出来的key粘贴上去,就可以用 git@github.com:mtrucc/ice-electron.git 了。

或者 Repository URL 填写为 https 类型的也可以。

本文介绍了如何使用 Nginx 反向代理谷歌服务,并且替换其中的内容。

我对谷歌字体进行了反代操作,具体见这篇文章:Nginx 反向代理 Google Font、Ajax 和 Gravatar 头像

这儿记一下研究过程中碰到的问题。

Nginx 反向代理配置文件参考

在 Nginx 文件夹下创建 conf 文件,用于反代。

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

server {
...
resolver 8.8.8.8;

location /css {
sub_filter 'fonts.gstatic.com' 'fonts.itnote.me';
sub_filter_once off;
sub_filter_types *;
proxy_pass $scheme://fonts.googleapis.com:$server_port;
proxy_set_header Host fonts.googleapis.com;
proxy_set_header Accept-Encoding '';
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection $connection_upgrade;
client_max_body_size 1m;
proxy_cache_key $scheme$host$request_uri;
proxy_cache proxy_cache_zone_of_site_fonts.itnote.me;
proxy_cache_valid 200 301 302 7d;
proxy_cache_valid any 7d;
proxy_cache_min_uses 1;
proxy_cache_methods GET HEAD;
proxy_cache_use_stale error timeout invalid_header updating http_500 http_502 http_503 http_504;
proxy_cache_revalidate on;
proxy_cache_lock on;
proxy_cache_lock_timeout 6s;
}
...
}

遇见的问题

页面 502 错误

阅读全文 »

我网站是 itnote.me,页面上有个链接,代码是这样的

1
<a href="https://files.itnote.me/XXX/xxx.mp3" target="_blank">下载文件</a>

结果通过页面跳转打开这个链接的时候,竟然 403 错误,我直接复制链接在浏览器中打开却能正常访问。

百思不得其解之下,我查了一下,可能和防盗链(跨域)有关,去看了一下 nginx 的配置

Nginx 反向代理配置文件参考

在 Nginx 文件夹下创建 conf 文件,用于反代。

1
2
3
4
5
6
location ~ .*\.(wma|wmv|asf|mp3|mmf|zip|rar|jpg|gif|png|swf|flv|mp4)$ {
valid_referers none blocked *.itnote.me files.itnote.me;
if ($invalid_referer) {
return 403;
}
}

这段代码很有意思哈,虽然表明了 *.itnote.me files.itnote.me 是可以访问的,但是注意一下,没有表明 itnote.me 是可以访问的,这就造成了 a 标签元素打不开链接

很低级的错误。但挺有意思的,没想到 a 标签打开的页面再某些情况下也会触发防盗链(跨域)问题。

因为 IOS 下中文文件名需要 utf8 才能支持。

主要就是在响应头设置 content-disposition,主要遵循 RFC 5987 标准。

response.setHeader("content-disposition","attachment;filename\*=UTF-8''" + URLEncoder.encode(fileName,"UTF-8"));

需求

最近再做扫码识别,为了降低错误率,我就用了一个高阶算法,用1秒时间采样了大概100多条输出结果(节流),然后取出其中重复项最高的,进行容错,提高准确率。

1
2
let a = ['aaa', '2012', '2012', '2013', '2014', '2012', '2014'];
mode(a); // 2012

实现

网上抄的一个快速的,未优化的解决方案。复杂度 O(n)。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
let a = ['aaa', '2012', '2012', '2013', '2014', '2012', '2014'];
function mode(array) {
if (array.length == 0) return null;
let modeMap = {};
let maxEl = array[0],
maxCount = 1;
for (let i = 0; i < array.length; i++) {
let el = array[i];
if (modeMap[el] == null) modeMap[el] = 1;
else modeMap[el]++;
if (modeMap[el] > maxCount) {
maxEl = el;
maxCount = modeMap[el];
}
}
return maxEl;
}
mode(a);
阅读全文 »

这个方法只替换了一个回车

1
2
let a = '下载所有文件\nZIP\n(133 MB)'
a.replace('\n','')

改进一下,这个可以换掉所有的回车

1
2
let a = '下载所有文件\nZIP\n(133 MB)'
a.replace(/\n/g,'')

js通过url中获取文件名

1
2
let url = 'http://www.example.com/blah/th.html'
filename = url.split('/').pop()

可能还有更变态的情况,但这个方法目前比较好使

本文介绍了如何使用 Nginx 反向代理自己站点进行加速的。

目前我开了一个 AWS 的 AWS Global Accelerator 服务,价格还算可以。有 CDN 加速效果。

Nginx 反向代理配置文件参考

在 Nginx 文件夹下创建 conf 文件,用于反代。

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
proxy_cache_path  /data/cdn/sites/default.itnote.me/proxy_cache levels=1:2 keys_zone=proxy_cache_zone_of_site_default.itnote.me:10m max_size=5g inactive=7d;

server {
listen 80;
server_name default.itnote.me;
keepalive_timeout 75s;
keepalive_requests 100;
access_log /data/cdn/sites/default.itnote.me/log/nginx/access.log;
error_log /data/cdn/sites/default.itnote.me/log/nginx/error.log;
gzip on;
gzip_comp_level 6;
gzip_min_length 1k;
gzip_types text/plain text/css text/xml text/javascript text/x-component application/json application/javascript application/x-javascript application/xml application/xhtml+xml application/rss+xml application/atom+xml application/x-font-ttf application/vnd.ms-fontobject image/svg+xml image/x-icon font/opentype;

location / {
proxy_pass $scheme://192.168.1.1:$server_port;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection $connection_upgrade;
client_max_body_size 1m;
proxy_cache_key $scheme$host$request_uri;
proxy_cache proxy_cache_zone_of_site_default.itnote.me;
proxy_cache_valid 200 301 302 7d;
proxy_cache_valid any 7d;
proxy_cache_min_uses 1;
proxy_cache_methods GET HEAD;
proxy_cache_use_stale error timeout invalid_header updating http_500 http_502 http_503 http_504;
proxy_cache_revalidate on;
proxy_cache_lock on;
proxy_cache_lock_timeout 6s;
}
}

需求

周末的时候我在爬一个网站,里面的数据是 table,代码类似于下面的这种。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<table style="width:100%">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>

我需要获取上面的数据,并且整理成数组结构,类似这样[[Jill,Smith,50],[Eve,Jackson,94]]

阅读全文 »

React 的父子传值,其实非常简单,但是网上基本都是这种的。

Class - 子组件通过 this.props 中获取数据

父组件要向子组件传递 dataFromParent 的值,注意代码中的 dataFromParent 就可以了

Parent.jsx

1
2
3
4
5
6
7
8
9
10
11
class Parent extends React.Component {
state = { data: 'Hello World' };
render() {
return (
<div>
<Child1 /> //no data to send
<Child2 dataFromParent={this.state.data} />
</div>
);
}
}

Child.js

1
2
3
4
5
class Child2 extends React.Component {
render() {
return <div>The data from parent is:{this.props.dataFromParent}</div>;
}
}

如果不知道 stateprops 都从哪里来,可以看一下 React.Component 文档就好啦

Function - 子组件通过函数的形参获取值

这儿抄一下 React 官方的 demo

父组件要向子组件传递 date 的值,注意代码中的 date 就可以了

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function Clock(props) {
return (
<div>
<h1>Hello, world!</h1>
<h2>It is {props.date.toLocaleTimeString()}.</h2>
</div>
);
}

function tick() {
ReactDOM.render(<Clock date={new Date()} />, document.getElementById('root'));
}

setInterval(tick, 1000);

官方文档再此:State and Lifecycle