Perchouli 的 Blog – 第2页 – 原教育台《动漫驿站》栏目网站遗留物

Other 2015-07-032018-04-10 by Perchouli

关于中国色网站的说明

很早之前在一个日本网站上看过一个很不错的颜色排版方式，于是做了一个中国版的http://zhongguose.com/。完工后就任其自生自灭，也没太关注。结果前段时间在微博上被转发后，当天访问量突然飙升到10w级，随之而来相关讨论和邮件，有鼓励有质疑，故在此统一回应。先说容易懂的，关于颜色数值和名字。前人研究请参看：《色譜》與《中國的傳統色》、《中國色名綜覽》之色名比較研究。数值是从《色谱》和其他书上取的。其中标注星号的例如天青，出处为东方出版社2013年版的《中国颜色》，这本书算不上权威，FB上有读者质疑它使用了曾启熊教授的研究而没有注明，所以只取了这书上很少的几种颜色作为补充。通常来说，礼仪的场合古人倾向使用纯度很高颜色（肖世孟. 先秦色彩研究[D]. 武汉大学 2011），这些颜色在现代印刷、显示的场景中就太重了。因此经典的五色——青、赤、黄、白、黑——没有单独列出来，名字直白或者生活中常见的颜色也没有选入（例如大红、灰白）。一言蔽之就是有缺漏但不会有冗余，只取前人研究过有据可查的而不去自己臆造。第一版是给屏幕校色之后，按照《色谱》上的颜色选择RBG颜色，用算法转成CMYK，效率低，颜色值也不够准 …

Python,Javascript(NodeJS),PHP之间的AES加密解密

场景是现有的几个项目，微信企业号是PHP，广告数据处理平台是Python，其中的Web API部分是NodeJS。现在这几个应用之间要传递数据，基于安全考虑先用AES加密，接收后做解密处理。本来预想是一个很简单的工作，库都是现成的，但发现网上的代码要么是不全，要么是padding处理不一致，所以最后还是自己看文档来写的，分享其中的核心代码，有类似需求可以直接拿去用。 AES AES的介绍可以参看Wikipedia: 高级加密标准。这种加密方式需要指定Key(密钥)和IV(初始化向量)，解密时使用同样的Key和IV进行解密。其次需要padding(填充字符)，网上一些代码是用空格或者大括号做padding，解密后再用rstrip/rtrim/replace清掉，但用标准的PKCS会更好。

Python Tech 2015-06-012015-09-07 by Perchouli

Django+MySQL安装配置详解(Linux)[更新为1.8.2版]

Perface Django是一个开源的Web应用框架，由Python写成，并于2005年7月在BSD许可证下发布。Django的主要目标是使得开发复杂的、数据库驱动的网站变得简单。Django采用MVC设计模式注重组件的重用性和“可插拔性”，敏捷开发和DRY法则（Don’t Repeat Yourself）。在Django中Python被普遍使用，甚至包括配置文件和数据模型。本文介绍Django在Linux(Ubuntu 14.04.2)+MySQL(5.5.43)环境下安装、配置的过程，包括安装、运行、添加应用的所有流程，最终建立一个可以从MySQL读取文章并显示的Django应用。文章面向刚接触Python/Django的初学者，所以安装过程都以默认环境为主，用pip可以简化安装过程。 Install 首先下载Django，得到Django-1.8.2.tar.gz，后解压并安装 $ wget https://www.djangoproject.com/m/releases/1.8/Django-1.8.2.tar.gz $ tar xzvf Django-1.8.2.tar.gz $ cd …

Front 2015-05-222015-06-10 by Perchouli

重新学习HTML5的HTML

经过媒体的渲染，目前大众认为的HTML5大致等于：酷炫的效果，复杂的技术，手机能正常浏览的网页。于是经常有人问我：某个功能，某个效果，HTML5能实现吗？这种表现层的问题，如果排除平台因素回答就是：以前实现不了的，HTML5还是实现不了；以前能实现的，HTML5通常能实现得更好。比如通知，以前用轮询，现在可以用websocket；比如想直接读取客户Windows目录下的文件（…），现在（正常情况下）还是实现不了… 广义的HTML5是一系列技术组合，希望能减少浏览器对插件(Flash/Silverlight/JAVA)的依赖。于是大家关注的重点主要是各种新增的API，HTML作为一种标记语法就没太重视。结果当我用canvas做好表格，用localStorage实现缓存，用video+websocket改进了视频播放后，回头来看我写的HTML代码其实还不够规范。所以这篇文章是关于HTML的，内容顺序按照HTML的顺序：从doctype到metadata，然后是部分常见标签，总之都是非常浅显的内容。嵌入内容的标签(例如img/object/video)不在讨论的范围，跟CSS或JS关联太紧密的标签(例如各种事件绑 …

Front Product 2014-07-232015-04-28 by Perchouli

Erya – 基于SemanticUI + Django的内容发布系统

Erya是基于SemanticUI开发的内容发布系统，主要用来搭建BBS。遵守GPLV3协议。系统的后端是简单的发布主题/回复/评论的功能，目前是基于Django(Python)的。使用Python3.2 + Django1.7的架构，Python2.7测试通过。在界面上模仿NodeBB，前端使用SemanticUI，支持自适应，编辑器使用Quilljs，同样也是支持自适应的：因为是面向国内中文用户，所以没有Google的JS/字体API等容易被墙掉的性能，用户头像是使用Gravatar的，因为目前Gravatar可以正常访问。安装下载zip包解压或是直接clone，用pip3安装Django1.7。建议使用Python3运行。 git clone https://github.com/perchouli/erya.git cd erya pip3 install -r requirements.txt 执行migration相关命令，添加管理账号。如果使用默认的sqlite可以跳过这一步，默认的管理账号/密码是： root/root python3 manage.py migrate python …

Front 2014-06-112016-03-28 by Perchouli

Backbone.js简单入门范例

11年刚开始用前端MVC框架时写过一篇文章，当时Knockout和Backbone都在用，但之后的项目全是在用Backbone，主要因为它简单、灵活，无论是富JS应用还是企业网站都用得上。相比React针对View和单向数据流的设计，Backbone更能体现MVC的思路，所以针对它写一篇入门范例，说明如下： 1. 结构上分4节，介绍Model/View/Collection，实现从远程获取数据显示到表格且修改删除； 2. 名为“范例”，所以代码为主，每节的第1段代码都是完整代码，复制粘贴就能用，每段代码都是基于前一段代码来写的，因此每段代码的新内容不会超过20行（大括号计算在内）； 3. 每行代码没有注释，但重要内容之后有写具体的说明； 4. 开发环境是Chrome，使用github的API，这样用Chrome即使在本地路径(形如file://的路径)也能获取数据。 0. Introduction 几乎所有的框架都是在做两件事：一是帮你把代码写在正确的地方；二是帮你做一些脏活累活。Backbone实现一种清晰的MVC代码结构，解决了数据模型和视图映射的问题。虽然所有JS相关的项目都可以用，但Backbone最 …

Python Tech 2014-04-252015-07-09 by Perchouli

Django 1.7 自带migrations用法及源码

Django下一个版本是1.7，增加了类似South的migration功能，修改Model后可以在不影响现有数据的前提下重建表结构。这真是个千呼万唤始出来的feature了，所以做个简单的整理分享。文章包含部分源代码，对具体怎么实现不感兴趣可以忽略。 Prepare 从Django官网或直接pip下载1.7b版本，创建project和app： $ pip install https://www.djangoproject.com/download/1.7b2/tarball/ $ python manage.py startproject dmyz $ cd dmyz/ $ python manage.py startapp articles

Python Tech 2014-03-292014-05-03 by Perchouli

Python.org的相关技术

Python.org使用了Django框架，基于Python3.3开发，是在生产环境应用Python3+Django的好例子，所以clone了它的源代码来学习，使用的是868d254版，整理如下。 Deploy 搭建Python环境自然先想到virtualenv，但Python.org源代码根目录里有Vagrantfile文件，支持用vagrant来搭建环境。虽然之前做ROR的环境时都配好了，但Python.org的配置用vagrant 1.0.1版本运行会出错，升级成最新的vagrant 1.5.1就正常了，执行vagrant up命令会自动下载Ubuntu 12.04 64bit来部署：

Tech 2014-01-082014-05-13 by Perchouli

Hadoop(Pig)统计IP地理位置

很常见的分析需求：日志中记录有访客IP（国内），现在要根据IP地址得出访客的地理位置，精确到市县一级，数据量平均是每天15G，需要统计日、周、月的结果。最后的实现方式是，先找到IP地理位置数据库，包含每个ip段对应的地址：1.1.0.0,1.1.0.255,福建省然后把它转成具体每个IP对应的地址，即：1.1.0.1,福建省。这样在Pig中用JOIN的方式，就可以获得这个IP实际对应的地址了。 IP Database 12年成立的中国广告协会互动网络分会IP地理信息标准委员会（简称IPB）已经发布了IP地理信息标准库，委员会成员和大广告公司都有一份。也可以下载全球城市ip库，取其中CN部分：文件信息：cn.csv 大小：1.26MB 有效时间：永久读取这个文件，把ip转成数字，起止ip的差，就是这个ip段所包含的主机数，用range函数生成，主要的python代码如下：

# coding: utf-8
def ip2long(ip_string):
    return ip_string.find('.') != -1 and reduce(lambda a, b: a<<8 | b, map(int, ip_string.split("."))) or ip_string
 
if __name__ == '__main__':
    OUTPUT = open(r'out.csv', 'a')
    INPUT = open(r'cn.csv')
    for l in INPUT.readlines():
        s, e, city = map(ip2long, l.split(','))
        if city.strip() == 'area': continue
        for i in range(s, e+1):
            OUTPUT.write('%s,%s'%(str(i), city))
    OUTPUT.close()
    INPUT.close()

# coding: utf-8

def ip2long(ip_string):

return ip_string.find('.') != -1 and reduce(lambda a, b: a<<8 | b, map(int, ip_string.split("."))) or ip_string

if __name__ == '__main__':

OUTPUT = open(r'out.csv', 'a')

INPUT = open(r'cn.csv')

for l in INPUT.readlines():

s, e, city = map(ip2long, l.split(','))

if city.strip() == 'area': continue

for i in range(s, e+1):

OUTPUT.write('%s,%s'%(str(i), city))

OUTPUT.close()

INPUT.close()

处理结果会保存在out.csv文件中，中国地区总共有3亿个IP，生成的文件是7.9G，gz默认压缩后是900MB左右，按Map需求进行分割。 Pig Latin LOAD …

Front 2013-09-292015-07-21 by Perchouli

Semantic-UI和其他几个前端框架

本来是想介绍Semantic-UI的，但如果只介绍这个框架，没什么内容，框架相关feature站点上有不需要说，所以干脆列出自己常用的几个前端框架，算是做个阶段性总结。本文的核心是侧重于HTML/CSS的框架，JS框架或以JS为核心的框架不讨论(比如YUI)；多屏已是既定事实，虽然不是所有开发都要考虑自适应，但有自适应功能至少说明了这框架短期内不会被淘汰，所以不带自适应功能的框架不讨论(比如flaminwork)；非开源、不可商用，或是需要付费的框架不讨论(比如easyframework)。先说Bootstrap，这两年都在用它，如今Bootstrap有点烂大街了，难免有些审美疲劳。但想想在Bootstrap这种框架出现之前，程序员做的界面实在是惨不忍睹，如今至少升级成“还能看”的级别了，所以“泛滥”这个问题是瑕不掩瑜的。平时开发个小工具用它来做界面，写个底层脚本用它来做文档界面，工作环境中也可以用来做原型或是布局，谁都看得懂没什么学习成本。总体来说，这个框架对于互联网的美化实在是功不可没。