感悟
时光机和回忆之旅
今天又用时光机找回以前的博客看了看,终于下定决心要将这些逝去的记忆碎片拼凑回来。 这个随着阿荡的服务器到期丢失的——我的最初的博客。 第一次通过邮件和老外交流;第一次翻译英文文档;第一次使用安卓手机;让电脑通过手机的无线流量套餐上网。 现在看看,还真有一种奇妙的感觉。
感悟
今天又用时光机找回以前的博客看了看,终于下定决心要将这些逝去的记忆碎片拼凑回来。 这个随着阿荡的服务器到期丢失的——我的最初的博客。 第一次通过邮件和老外交流;第一次翻译英文文档;第一次使用安卓手机;让电脑通过手机的无线流量套餐上网。 现在看看,还真有一种奇妙的感觉。
本系列文章都是以方便开发和维护为出发点,在可能的时候,尽量兼顾性能方面的需求 本文是 归来的技术栈 的第三篇,必要时请阅读链接中的内容了解背景。 如果拿 Node.js 和 PHP 比较,我向来是喜欢 Node 多一点。但有一点是 PHP 天然具备, 而 Node 需要付出一些努力才能实现的。 默认情况下,PHP 针对每个请求会使用独立的进程来处理,完成后即销毁。虽然从性能上来说,每次执行都要重复加载文件和数据会带来负面影响,但在另一些方面,却有着先天优势。 比如某个请求发生了错误,不会对另一个请求造成影响;内存泄漏的负面效果无法累积起来影响系统的长期稳定运行;在一定程度上只要堆服务器就可以横向扩展来提高并发能力;不需要针对服务器启停编写额外的代码来初始化和扫尾;服务器意外关闭一般也不会造成什么影响(虽然也不总是如此,比如用了APC之类)。 这些都是无状态带来的好处,可以降低开发和维护的成本,并通过堆硬件提高性能。抛弃一些东西,在其他方面就可以获得更多。 完全无状态的服务端类似一个巨大的纯函数,每个参数相同的请求都会获得相同的结果,也不对外部环境产生影响。但是如
归来的技术栈
本系列文章都是以方便开发和维护为出发点,在可能的时候,尽量兼顾性能方面的需求 本文是 归来的技术栈 的第三篇,必要时请阅读链接中的内容了解背景。 如果拿 Node.js 和 PHP 比较,我向来是喜欢 Node 多一点。但有一点是 PHP 天然具备, 而 Node 需要付出一些努力才能实现的。 默认情况下,PHP 针对每个请求会使用独立的进程来处理,完成后即销毁。虽然从性能上来说,每次执行都要重复加载文件和数据会带来负面影响,但在另一些方面,却有着先天优势。 比如某个请求发生了错误,不会对另一个请求造成影响;内存泄漏的负面效果无法累积起来影响系统的长期稳定运行;在一定程度上只要堆服务器就可以横向扩展来提高并发能力;不需要针对服务器启停编写额外的代码来初始化和扫尾;服务器意外关闭一般也不会造成什么影响(虽然也不总是如此,比如用了APC之类)。 这些都是无状态带来的好处,可以降低开发和维护的成本,并通过堆硬件提高性能。抛弃一些东西,在其他方面就可以获得更多。 完全无状态的服务端类似一个巨大的纯函数,每个参数相同的请求都会获得相同的结果,也不对外部环境产生影响。但是如
Node.JS
在 express 4 中,app.use 有如下用法: const express = require('express'); const app = express(); const subapp = express(); app.use('/subpath', subapp); app.listen(3000); subapp 做为 express 的一个实例,本身也是 middleware ,可以被 app.use “挂载”到指定路径。 这种用法给我们项目中功能模块的可移植性进一步增加了保证,以之前用到的目录结构为例: . ├── app.js └── src ├── admin │ ├── stylesheets │ ├── javascripts │ ├── index.html │ ├── client.
归来的技术栈
所有的设计都是从开发者面对的问题出发。
SVG
在用 Leaflet 处理 GeoJSON 格式的地理信息时,解析结果被以内联的 SVG 格式嵌入网页中。为了使地图更有质感,希望通过添加阴影获得视觉上的高低效果,尝试过程记录如下。 css 首先,<svg> 内的元素是支持 css 样式的,用法也和普通的 css 一样,可以通过 id 或 class 来套用样式,但是 svg 元素具体支持的规则和普通 DOM 元素相差很大 box-shadow box-shadow 不支持 svg 内部的元素 filter filter 的 drop-shadow 也可以制造阴影效果,但是目前只有 Edge 支持对 svg 内部元素使用 元素 <defs&
PHP
环境 * macOS 10.12 * php 7.1 * atom 1.16 * brew 1.2 安装和配置 xdebug 打开命令行终端,输入以下命令 brew install php71 php71-xdebug brew 是 macOS 下的包管理器,php71 是 php7.1 的包名,如果你使用其他系统,请自行替换成相应的命令 配置 xdebug 的配置在 /usr/local/etc/php/7.1/conf.d/ext-xdebug.ini 中[注1],增加下列配置 xdebug.remote_
感悟
过完年第一天上班,就接到一个项目连夜出差去了。客户手头有大约 20 万条住房信息需要上报到一个指定的系统。这 20 万条记录由 200 多个员工花了超过一个月的时间到该县辖区内的各自然村挨家挨户上门采集,然后以乡镇-行政村-自然村的结构存放在 1000 多个 excel 文件中。excel 中的每条记录对应一套住房,同目录下,还有房屋的照片。 这些信息和图片都要上传到一个指定的网站,当然,没有接口。 所以,问题还是很清晰的,就是实现一个爬虫模拟请求,先登录网站,然后从 excel 中依次读取记录,将相应的信息和图片进行上传,重复这个过程。 常规问题 技术选择 其实没什么好选,我最熟悉的语言是 PHP 和 JavaScript,最终选了 Node.js 。平常处理网络请求已经用的很多,处理数据的话有 underscore ,模拟请求有 superagent ,处理 dom 内容有 cheerio
前端
毋庸置疑,单页面应用(Single Page Application,以下简称 SPA)正在变得越来越流行。SPA 具有前后端分离、接口重用度高、操作响应快速等优点,在用户体验上相比传统的网站也更接近原生应用。但与此同时,SPA 的体积却在不断增大,导致加载所需的时间越来越长,而这个问题在微信里面特别突出。 微信中的加载问题 首先,微信通常安装在移动设备上,网络的速度并不像固定宽带那么有保障,虽然 4G 已经普及,但总有些地方或某些时候网络没那么理想。在网络状况不佳时,加载较大的 SPA 耗时较长,屏幕表现为长时间白屏。 然后,微信对网页的缓存机制跟一般的浏览器不同。即使你没在服务器上进行特别的配置,它默认就会缓存 html、css、javascript 等它认为是“静态”的内容,而且在缓存有效期间“拒绝”去服务器上看看是否有更新,给不少新接触微信开发的程序员造成困扰。反过来,当你希望它将某个内容长期缓存,并通过响应头部的信息明确告知时,它也不能很好的遵守。说实话,
CentOS 6
上周写了一篇文章讲了讲为什么应该使用 HTTPS 加密你的网站,并笼统的介绍了如何申请和使用 Let's Encrypt 提供的 SSL 证书。这次我们说说如何在 CentOS 6 和 Nginx 中部署 Let's Encrypt 的 SSL 证书,过程中可能遇到的问题,以及如何解决。 整体上分成申请证书和使用证书两个部分。 申请证书 准备工作 在申请证书之前,你必须有一个域名,并配置好 DNS 解析服务,使其指向你将要使用的服务器。说白了,就是你要保证所有人都可以通过在浏览器中输入域名打开你的网站。 此时 Nginx 的配置文件如下(为了便于说明只包含了最基本的信息): [ngxin] server { listen 80; server_name www.bnlt.org;
作为一个普通用户,在使用手机浏览网页,或是阅读微信中别人分享的内容时,经常会看到屏幕下方有个弹出广告,什么点击领红包啦,免费送流量啦,或是移动运营商的广告。通常这些广告跟你浏览的网站本身风格完全不搭、画质又非常糟糕、而且在几个毫不相干的网站中都出现了。遇到这样的情况,基本可以肯定是有中间人劫持了你的流量,并篡改了网页内容,在其中嵌入了广告。纯粹做做广告已经算是客气,更恶劣的可以替换你浏览的网页内容,把你引向钓鱼网站,甚至直接窃取你的密码。 作为一个开发者,你的境遇更糟糕,因为这一切时刻都发生在你自己的网站或 APP 上。也许是你花费不少心思才做出来的精美页面被一个很粗糙的广告拉低了好几个档次;也许是一个重要活动的报名按钮被广告遮挡,你的用户不得不先小心翼翼关了广告才能继续;也许是为一个大客户制作的严肃的内容下面出现了一段夸张又搞笑的广告语。 但最最糟糕的是,你的大多数客户和用户都不清楚这是运营商或广告商劫持了他们的流量,而是以为你这个家伙为了一点微薄的广告收入在里面嵌了品味低下的广告,毕竟这网站是你的,这应用是你开发的,不是你干的还能是谁呢。你是希望当这一切发生的时候向他们解释
ImageMagick
今天遇到一个需求,客户发来几份PDF,想放到他们的微网站(专门给微信用的网站)上,由于是给手机看的,加上文件页数不多,就想到转换成图片再放上去。 第一时间想到用 ImageMagick 的 convert 命令,网上一搜,命令如下: convert -density 600 foo.pdf foo-%02d.jpg -density 设置了生成的图片的精度,数值越大,图片越清晰(分辨率高),转换也越慢。如果给手机用,普通 A4 大小的 PDF 设置在 200 左右比较合适。 foo-%02d.jpg 是希望生成的文件名,%02d 部分会替换成页码(从 0 开始),用过 printf 函数的应该对这个规则会比较熟悉。 然而在实际使用时遇到了一个意外情况:
前端
最近将 riot.js 升级到了 3.0,并用上了新版本的 riot-route,原先用了一年多的 2.2.4 版本内置的 riot.route 只支持 hash 形式的 SPA 单页面应用,riot-route 则支持 pushState。 Hash 方式有个缺点,就是服务器不知道地址栏中 # 之后的内容,放在微信里,就导致了未授权用户授权后想返回原界面需要借助 JS 来实现,导致历史记录多了一条,用户按返回键无法退出(返回上一页面后又被 JS “前进”了)。 PushState 方式就没有这个问题,可以直接用 HTTP 302 重定向过来,不影响历史记录和返回按钮功能。 于是在新项目中开始采用 pushState 方式。 不过等到应用到了微信环境中,又冒出来一个问题,通过
JavaScript
包含 underscore 和 es2016 语法 功能 将一个数转换成多个2的N次方的数的和 输入 二进制 输出 1 0001 [1] 6 0110 [2,4] 7 0111 [1,2,4] 用途 数据库中以整数形式存储,界面上以多选的形式展现 <select multiple> <option value="1">a</option> <option value="2">b</option&
CentOS 6
准备 * 版本:CentOS 6.7、Nginx 1.9 * 下列所有操作都在命令行终端中进行 * 权限:root 以下操作需要 root 权限,如果当前登录的用户不是 root,请输入 su 命令,并在提示中输入正确的密码切换为 root 用户 su 实现 1.添加源 在 /etc/yum.repo.d/ 下新建 nginx.repo 文件,文件内容如下: name=nginx repo baseurl=http://nginx.org/packages/mainline/centos/6/$basearch/ gpgcheck=0
CentOS 6
准备 * 版本:CentOS 6.7, Nginx 1.8 * 下列所有操作都在命令行终端中进行 * 权限:root 以下操作需要 root 权限,如果当前登录的用户不是 root,请输入 su 命令,并在提示中输入正确的密码切换为 root 用户 su 实现 1.添加源 在 /etc/yum.repo.d/ 下新建 nginx.repo 文件,文件内容如下: name=nginx repo baseurl=http://nginx.org/packages/centos/6/$basearch/ gpgcheck=0 enabled=