George Cheng

George Cheng

115 posts

Summary of decorators in TypeScript

declare classDecorator = (ClassConstructor) => DecoratedClassConstructor | undefined declare memberPropertyDecorator = (prototype, name, descriptor?) => decoratedDescriptor | undefined declare memberAccessorDecorator = (prototype, name, descriptor) => decoratedDescriptor | undefined declare memberMethodDecorator = (prototype, name, descriptor) => decoratedDescriptor | undefined declare memberMethodParameterDecorator = (prototype, name, index) => void declare staticPropertyDecorator = (ClassConstructor, name, descriptor?) => decoratedDescriptor

明确一下 XMLHttpRequest#withCredentials 的作用

先重复一下两个启用 withCredentials 之后 CORS 响应的要点: 响应头 Access-Control-Allow-Origin 不能为 *,必须明确指定为包含 Origin 的值。 响应头 Access-Control-Allow-Credentials 必须为 true 再重复一个 cookie origin 的问题: 请求发到哪个 origin,带的就是哪个 origin 的 cookie。不可能出现 a.com 携带 a.com 的 cookie 向 b.com 发 ajax 请求 的情况发生。 几个 case withCredentials 请求的响应操作

从 Nginx​ 启动时自动解析域名讲起

目前赛亚测试服务器的现状就是一台服务器上跑的服务非常多,我们把所有服务都 Dockerize 化之后通过统一的一个 Nginx 反向代理容器对外开放,其中下层的容器名作为反向代理的域名。 server { listen 80; server_name project.domain; location / { proxy_set_header Host $http_host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_pass http://container:80; proxy_redirect off;

使用 CI 构建 React Native 项目

网上已经有很多教程了,我这边也整理一份我跑通的流程。 iOS 构建部分 首先参照 官方文档 调整代码 其中文档中需要在 Xcode 下构建的部分,使用命令行来操作就是: xcodebuild archive -project ios/$PROJECT.xcodeproj -scheme $PROJECT -archivePath ios/build/$PROJECT.xcarchive xcodebuild -exportArchive -archivePath ios/build/$PROJECT.xcarchive -exportPath ios/build/ -exportOptionsPlist ios/ExportOptions.plist -allowProvisioningUpdates 要点: 绝大多数构建参数都可以用 Xcode 打开项目调整。 ExportOptions.

docker

把 Ghost Blog 迁移到 Docker 驱动

好久没写 Blog 了,净搬家玩儿了。前一段时间,Linode 降价,就把 Blog 从 Vultr Tokyo 区搬到了 Linode Tokyo 2 区,速度并没有太大提升。这两天发现我的信用卡突然可以在 GCP 上注册了,果断试用了个一年份的 GCP 台北彰化机房的 VPS。从家里访问延迟从 200 降到了 90,traceroute 发现也不用过美国转一圈了,效果还是不错的。 新主机打算把包括前置的 nginx 等等全部服务都跑到 Docker 里面,在 Docker 环境里面把请求反代到各个业务服务,主机自己除了 Docker 服务就不跑其它的服务了。在

JavaScript

理解 Promise (WIP)

一直想写篇文章帮助初学者理解 Promise。Promise 这个东西总是被人和异步回调这些东西联系在一起理解,而异步回调这些东西本身就已经很难理解了,再在上面叠上一个 Promise 理解起来更是难上加难。所以我考虑用另一种形式形式来表达 Promise 的特点,希望能对理解 Promise 有所帮助。 下面开始: 一、用 Promise 处理值 假如我们现在有一个数字: 4 假如我们又有一个操作叫 加五: function add_five(n) { return n + 5 } 假如我们还有一个操作叫 开平方: function square_root(n) { return Math.sqrt(n) } 最后我们也有一个操作叫输出: function print(n)

加速你的下载:发布 npm 命令行工具 qiget
node

加速你的下载:发布 npm 命令行工具 qiget

qiget 主要用来解决某些情况下下载速度不足的问题。 其原理是调用七牛的 fetch 接口,将远程文件经过七牛云存储中转下载到本地的方式,在某些慢速下载的场景下会有很好的效果。 安装和配置 $ npm install --global qiget $ exports QIGET_ACCESS_KEY=accesskey $ exports QIGET_SECRET_KEY=secretkey $ exports QIGET_BUCKET=bucket $ exports QIGET_HOST=host

Django

使用信号监控 Django 模型对象字段值的变化

Django 信号 (Signals) 的功能类似于 WordPress 的动作 (action),用于为项目全局增加事件的广播 (dispatch) 与接收 (receive) 机制。其中,灵活使用其内置的模型信号 (Model Signals) 的接收功能就可以监控大部分模型对象 (Model instances) 的变化。因为不需要修改模型本身的代码,在进行跨应用 (App) 监控时有低耦合的优势。 基本用法 信号的基本用法官方文档上的主题与参考上已经有详细描述。本文只提几个要点(本文环境:Django 1.8 & Python 3.4): 代码组织 官方推荐在应用目录下新增一个 signals.py 文件,同时参考官方文档的应用配置节中自定义应用配置 (AppConfig) ,重载应用配置类的 run

HTTP

从跨源 302 重定向到同源后会出现 Origin: null 的现象

在 Heroku 上用 node 写了个重现。 看整个请求的过程,请打开浏览器的调试工具,看网络请求的日志。 先看一下我的截图: 首先使用 Ajax 发送了一个跨域请求,该跨源请求重定向到同源请求。 此时浏览器自动请求重定向后的同源请求,该请求自动附加了 Origin: null 头。 在 StackOverflow 上有该现象的讨论,还没细看。现在基本可以确定该现象属于 HTTP 协议的正常规定。

node npm

wpkg - 选择适合你的最火的 node 包

每当我在写 node 程序的时候,都会遇到需要使用某些已经成熟的功能包,但是并不知道该功能包在 npm 里面叫什么,或者哪个好的尴尬境地。 目前有一些网站在做这方面的索引,譬如 node-modules。但是这类网站基本上是以该包在 GitHub 上的 star 数决定排名。 我感觉这种排名方式并不客观: 首先并不一定每个包都在 GitHub 上托管仓库,有些包会在 Bitbucket 上甚至并不会托管源码在代码托管系统。 其次对于越小的功能包,star 数多并不能代表该包有多流行。譬如最简单的 mkdirp 或者 rimraf 这种包,只要牵涉到文件的 node 程序一般都会使用他们,然而它们的 GitHub 仓库的 star 数并不能如实反映这种情况。 我认为相对客观的方式是使用它们被依赖的次数进行择优,即参考 most depended-upon packages

Bootstrap 4 alpha 新特性介绍
CSS

Bootstrap 4 alpha 新特性介绍

昨日 Bootstrap 官方发布了 4-alpha 版本,该版本的主要变更如下: 从 Less 迁移到 Sass。 Bootstrap 依靠 Libsass 拥有了前所未有的编译速度,我们也加入了蒸蒸日上的 Sass 开发者委员会。 改进的网格系统。 我们添加了一个新的网格层用于更好的支持移动设备,并全面检查我们的语义 mixin。 可选的弹性盒子支持。 未来近在咫尺——将一个布尔变量设为 true 之后重新编译 CSS 就可以体验到弹性盒布局的网格和组件的强大。 well、thumbnail

jQuery

jAjax: jQuery.ajax with ES6 Promise

起因 用 React、Vue.js 这些视图层高端武器的时候 他们不提供 Ajax 通信功能 还是 Angular.js 爽 直接用 XMLHttpRequest 觉得麻烦 于是 就用专门的 Ajax 库,比如说 fetch Polyfill reqwest SuperAgent 这些东西存在的问题有 兼容性问题 额外的学习成本 拼写看着难受 等 后来 大伙儿表示 去你大爷的 老子就是喜欢 jQuery 我就把 jQuery 的 ajax 模块拿出来单独编译 剔除 jQuery 的其他部分,还能缩减点源码的尺寸

Python

Cent OS 下使用 Nginx 部署 Python 3 编写的 Django 工程的 uwsgi

官方推荐在 systemd 中使用 emperor 的方式进行服务器自启动的部署。我觉得在 uwsgi 进程之上再加一个管理进程,显得有点重。于是就没用 emperor 的方式而是直接调用业务的 uwsgi 进行部署。 uwsgi.ini 内容如下 [uwsgi] chdir=/path/of/project module=project.wsgi:application master=True pidfile=/run/uwsgi.pid vacuum=True max-requests=5000 socket=/run/uwsgi.socket thunder-lock=True enable-threads=True

解读 webconponents.js 中对 ES6 WeakMap 的 shim (一)
JavaScript

解读 webconponents.js 中对 ES6 WeakMap 的 shim (一)

ES6 中对 WeakMap 的要求主要是对 key(非 null 对象) 仅保留弱引用,且取值是 O(1) 复杂度,这导致了它的两个特性: 不能求大小,更不能枚举。 当 key 对象不被其他变量引用时,会被垃圾回收系统回收。 按说这种关乎内存管理的对象是没法 shim 的。但是webcomponents.js 对 WeakMap 有一个很奇妙的 shim。经过阅读后整理原理如图:

Python

Django admin 界面显示不正常的可能原因 (Python 2)

检查定义中是不是有些包含中文的字符串没有使用 unicode 字符串语法 u'呵呵'。 已确认下面两个问题都是因为该原因而起 django-constance 中的 description 显示不正常:description 没有使用 unicode 字符串 modelAdmin 中 filter_horizontal (filter_vertical) 显示不正常:Model 的 verbose_name 没有使用 unicode 字符串。