分类目录归档:vicalloy的庄家

[django-ajax-validation]Django表单AJAX校验及提交的APP

项目地址https://github.com/vicalloy/django-ajax-validation
django-ajax-validation是一个使Django支持表单AJAX校验的第三方APP。我做了一些修改,增加了表单的AJAX提交以及twitter-bootstrap的支持。

安装

  • pip install git+git://github.com/vicalloy/django-ajax-validation.git
  • 在Django settings的INSTALLED_APPS中加上”ajax_validation”。

一个简单的使用范例

views.py

from ajax_validation.views import validate_form
from ajax_validation.utils import render_json_response
...
class TimelineForm(forms.ModelForm):
    class Meta:
        model = Book
def add_book(request):
    #创建表单并进行校验。返回表单以及校验结果。
    form, validate = validate_form(request, form_class=BookForm)
    if validate['valid']:#如果校验成功,执行保持操作
        book = form.save()
    return render_json_response(validate)//返回JSON

模板

进阶

django-ajax-validation的原始文档就写的非常糟糕,我也偷懒,所以想了解更多还是直接看代码吧。

将LBForum、“似水流年”的部署环境切换到Gunicorn+Supervisor

Gunicorn 是一个Python WSGI UNIX的HTTP服务器。Gunicorn有着不错的性能以及稳定性。Gunicorn对WSGI、Django、Paster提供了很好的支持,使用起来非常的简单。
此前 LBForum似水流年 使用apache+wsgi的方式部署在webfaction上。为了给服务器节约些内存将部署方式切换到Gunicorn。不过似乎效果并不明显。除工作进程外,Gunicorn还会另外启动一个master进程用于管理子进程。master进程加一个子进程的内存耗用量加在一起大概在40M左右。
注:在一些评测里Gunicorn的性能并不是太好。Gunicorn支持多种 worker-class ,默认的worker-class使用的是同步模式。在将worker-class切换到gevent或tornado性能会好出不少。

DPress部署到SAE

将DPress部署到SAE的简要说明。如果你在部署过程中有遇到什么问题,欢迎反馈。

  • 在SAE管理后台创建应用,开发语言选择python
  • 使用svn将应用代码更新到本地
  • 修改配置文件config.yaml
name: 你的应用名称
version: 1
libraries:
- name: django
  version: "1.4"
  • 将DPress sites目录下所有文件复制到SAE应用目录(如:dpress/1/)。
  • 在应用的根目录下创建目录libs(如:dpress/1/libs/)
  • 将virtualenv.bundle.zip复制到libs目录
  • 在服务管理中启用mysql数据库
  • 由于SAE上无法使用Django命令。需要在本地使用syncdb命令在本地mysql数据库中创建好DPress的初始数据,然后使用SAE的phpmyadmin将数据导入到SAE。
  • 在服务管理中创建Storage,并将Domain设置为base
  • 创建配置文件settings/local.py
# -*- coding: UTF-8 -*-
import sae.const
DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.mysql', # Add 'postgresql_psycopg2', 'postgresql', 'mysql', 'sqlite3' or 'oracle'.
        'NAME': sae.const.MYSQL_DB,                      # Or path to database file if using sqlite3.
        'USER': sae.const.MYSQL_USER,                      # Not used with sqlite3.
        'PASSWORD': sae.const.MYSQL_PASS,                  # Not used with sqlite3.
        'HOST': sae.const.MYSQL_HOST,                      # Set to empty string for localhost. Not used with sqlite3.
        'PORT': sae.const.MYSQL_PORT,                      # Set to empty string for default. Not used with sqlite3.
    }
}
DEFAULT_FILE_STORAGE = 'saestorage.SaeStorage'
FILEBROWSER_DIRECTORY = ''
STATIC_URL = 'http://vicalloy.sinaapp.com/dpress/'#修改为你静态资源位置
DPRESS_TITLE = u'天地一沙鸥'
DPRESS_SUBTITLE = u'to be continue'
DPRESS_DESCN = ''
DISQUS_SHORTNAME = ''
GOOGLE_ANALYTICS_CODE = ''
#根据你的静态资源位置进行修改
EPIC_JS = 'http://vicalloy.sinaapp.com/dpress/dpress/epiceditor/js/epiceditor.min.js'
EPIC_BASEPATH = 'http://vicalloy.sinaapp.com/dpress/dpress/epiceditor'

  • 到这里服务已经可以跑起来了。由于没有对静态资源进行配置,将出现无法找到静态资源的情况。
  • 创建一个新的SAE应用,应用类型选择PHP,专门用于管理DPress的静态资源文件(如:dstatic.sinaapp.com)。
  • 在本地运行Django的collectestatic命令将DPress的静态资源收集到sites/collectedstatc/目录。
  • 将collectedstatc中的内容复制到新创建的站点
    • 如:static/dpress/。对应的STATIC_URL配置文件修改为 http://dstatic.sinaapp.com/static/dpress/

DPress配置、定制、模板创建指南

DPress项目地址: https://github.com/vicalloy/DPress
DPress是我用Django写的一个博客系统,支持使用MarkDown语法进行博客的书写。这里将就系统的配置,模板定制修改,以及如何创建自己的模板给个简要的指南。由于系统使用Django开发,使用者最好能有一定的Django基础。

使用Django的开发服务器将系统跑起来

  • clone DPress的代码库(git://github.com/vicalloy/DPress.git)
  • 运行scripts/create_env.py,该脚本将为你创建python虚拟环境,并自动安装相关依赖包。
  • 执行scripts/env.bat(. scripts/env.rc),进入刚创建的python虚拟环境。
  • %mg%($mg in linux) 是 “python manage.py ” 的快捷方式,用于方便的执行Django命令。
  • %mg% syncdb
  • %mg% migrate
  • %mg% runserver
  • DPress Admin http://127.0.0.1:8000/admin/
  • DPress http://127.0.0.1:8000/

配置

  • 复制 sites /settings/pre.samplepre.py 。修改其中的SETTINGS设置,确定使用哪个配置(默认可选production/dev)。
  • 复制 sites /settings/local.samplelocal.py 。并修改相关配置。
  • DISQUS_SHORTNAME以及GOOGLE_ANALYTICS_CODE这两个参数需要在正确设置后,DISQUS的评论功能以及GOOGLE ANALYTICS才可正常生效使用。

模板的配置与修改

  • DPress自带的模板在 sites/dpress/templates/ 目录。自定义模板放在 sites/templates/ 目录。系统将自动优先使用自定义模板目录的模板,实现对模板的重写。
  • dpress/include/footer.html 为页面的底部。可重写该文件,修改版权增加定义链接等。
  • dpress/include/sidebar.html 页面的侧边栏。重写该文件对侧边栏内容进行配置。
  • dpress/widgets/ 该目录为侧边栏小工具的模板。如果你需要创建自定义的侧边栏工具,请遵守约定将小工具模板放到该目录。
  • dpress自带的静态资源文件放在 sites /dpress/static/ 目录。自定义的静态资源文件放在 sites/static/ 目录。
  • 静态资源目录中 /dpress/themes/ 为主题目录。当前的默认主题为 default 。你可创建一个新文件夹用于存放你的新主题。
  • 重写 dpress/include/base_style.html 使用新主题的css文件。

SAE Storage for Django

DPress 修正后想着要部署一个在线的演示程序。问题是我自己虚拟主机的资源已经捉襟见肘,于是只能打SAE的主意了。
为保证文件上传功能的正常使用需要将Django默认的Storage实现替换为SAE的storage实现。SAE的官方并没有提供Django的storage实现,需要自己另外实现。在github:gist上有人贴出了SAE Storage for Django的实现(SAE Storage for Django)。github:gist上的这个SAE Storage实现有些bug,我修正后的版本见saestorage
注:

  • SAE Storage单节点的最大容量为2G(注:SAE Storage 服务限制)。这对于一些小站点来说是没什么问题,但如果是一个大型的商业站点这必然会有些不便。难道你需要配置一个storage列表,让程序自行去寻找可用的storage?
  • SAE Storage似乎不太稳定,上传的文件经常会打不开。

“DPress”原地满血复活

GitHub地址: DPress(GitHub)
演示地址: DPress(SAE)

DPress 是我在2009用django写的一个博客系统。此后年久失修,已经跑不起来了。
这两天花了些时间将项目重新修整一下,现在项目又可以重新跑起来了。功能方面新版的DPress有了些变化。

  • 提供对 Markdown 的支持(也只支持Markdown)。
  • 使用 EpicEditor 实现Markdown的实时预览。
  • 使用 DISQUS 实现文章的评论功能。(注:既然已经有了这么好用的评论服务,为什么还要自己写代码呢)
  • 支持代码高亮度。相关的语法说明见:Fenced Code Blocks
  • 支持Tag
  • 支持RSS
  • 使用 Django FileBrowser 提供文件上传的支持。
  • 使用 flatpages 提供对About等自定义页面的管理。
  • 内置GOOGLE ANALYTICS的支持
  • 代码量非常的小
  • 模板和代码分离的比较清晰,要创建一套自己的模板会是一件比较容易的事。

已知bug:直接从网页复制文本时EpicEditor的编辑框内会自动的添加一些看不见的html标签,将导致文本显示不正常。需要粘贴文本时最好先将文本粘贴到写字板中,再重新复制粘贴。

WP7开发初体验 — WP7版“百度.ting”开发记录


项目地址: lb.ting(github)
如果你有WP7手机,可以下载XAP文件体验一下:lb.ting.xap

感觉已经有段时间没有接触过什么新技术了,或许也是想看看自己接触一项全新的技术需要多少时间来熟悉。近来想看看WP7开发。
上周在MSDN简单的看过一些WP7开发文章后决定动手做自己的地一个WP7应用。因为只是想简单的体验一下WP7开发,因此跳过系统学习的阶段直接动手。
这次想做的是百度.ting的WP7客户端。虽然虾米电台、豆瓣电台等电台网站/软件已经一大堆了,但百度.ting还是有自己的优势。百度电台的的音乐码率普遍为128k,比其他电台要好出不少。大多音乐电台支持直接手机访问,直接浏览器访问无法实现音乐的后台播放。
C#刚出时大家评价C#是Delphi和Java的杂交产物。我虽没什么C#的开发经验,但相信凭自己的Java与Delphi经验应付一般的C#代码还是没多少问题的。电台软件的功能以及技术点都不多,我很乐观的想周末在家宅个两天,折腾出地一个基础版本。显然,这个计划已经失败。接触一项新技术的遇到的问题远比我想象的要多,中间也走了不少弯路。
目前第一个初步可用的版本已经完成。我会将代码放到github上。我希望在接下来一段时间里对这个应用再进行一些优化,然后上线到WP7的商店。
下面的文章里会我记录下一些我遇到的问题。

准备工作,知识储备

微软在帮助文档方面做的非常的好,你可以很容易找到自己需要的资料。

开发过程中遇到的相关问题以及解决方案

百度.ting API

直接用FireBug对百度播放器的请求进行分析,可以很轻松的得到大部分API。这些API中唯独缺少电台列表的API。该问题最简单的解决方案是直接分析网页获取到电台列表,然后在程序里写死。另外还可以让程序对电台首页的html代码进行分析,从中提取电台列表。方案一,感觉有些傻。方案二实现起来又过麻烦。于是有了方案三。
百度.ting有官方的Android客户端,而Android程序是比较容易反编译的。使用 Dedexer 反编译后,得到相关API。Android客户端和web版本电台使用的并不是同一套API,而且从接口的参数类型上看服务端似乎用的是Java。

//主要接口
//获取频道列表
http://tingapi.ting.baidu.com/v1/restserver/ting?method=baidu.ting.radio.getCategoryList&format=json
//获取频道歌曲列表
http://tingapi.ting.baidu.com/v1/restserver/ting?method=baidu.ting.radio.getChannelSong&format=json
//获取专辑的歌曲列表
http://tingapi.ting.baidu.com/v1/restserver/ting?method=baidu.ting.radio.getArtistChannelSong&format=json
//获取歌曲的详细信息
http://ting.baidu.com/data/music/links?songIds=

JSON解析

最初我希望JSON能被自动解析成LIST/MAP类型的结构,查了一轮并没有找到比较好的解决方案。在C#中JSON都需要和对象进行绑定。如果手动为所有JSON数据创建相关的数据类,无疑是意见很麻烦的时。我相信我并不是遇到该困扰的第一人。果然网上已经有不少C#的JSON工具。
json2csharp 只要你输入json,改网站会自动帮你生成相关的数据类。

配置文件的存储

大多应用程序都需要保存一些自定义的配置数据。在WP7.1后,本地数据的使用变得非常的简单。本地数据库的使用可以参考 如何使用 MVVM 为 Windows Phone 创建本地数据库应用程序
lb.ting最终方案中并没有使用本地数据库。我采用了直接将JSON数据持久化的做法进行数据存储。直接持久化JSON的方案在数据的可靠性比较差,且配置文件格式的修改会成问题。JSON持久化的方案胜在够简单。

后台音频播放

WP7不支持后台进程,为了保证音频的后台播放需要为应用创建对应的后台音频播放代理。按照通常的理解,动态更新播放列表是一个必须的功能。WP7的后台播放代理还就没有更新播放列表的API。在MSDN的例子中播放列表直接写死在程序里。
去网上转了一圈也并没有找到比较好的解决方案。网上的建议是将播放列表保存在数据库或本地文件中,通过创建一个“中间层”的方式同前台UI进行交互。lb.ting最终采用了将播放列表持久化到本地存储区的方案。

baidu图片获取

专辑封面在浏览器可以正常显示,客户端则无法显示专辑图片。怀疑是代码的问题,于是将图片源换为豆瓣,图片正常显示。一通折腾,发现是百度的防盗链引起。将图片的加载换为WebClient实现。

public static void SetImageUrl(Image img, Uri uri, Uri defaultUri)
{
    WebClient wc = new WebClient();
    wc.Headers["Referer"] = "http://www.baidu.com";
    BitmapImage bi = new BitmapImage();
    img.Source = bi;
    wc.OpenReadCompleted += (s, e) =>
    {
        try
        {
            bi.SetSource(e.Result);
        }
        catch (Exception)
        {
            //bi.UriSource = defaultUri;
        }
    };
    wc.OpenReadAsync(uri);
}

替换博客的代码高亮插件为“Crayon Syntax Highlighter”

此前一直对博客的代码高亮插件不是很满意。以前用的插件,默认配色方案不是太美观,而且配色方案的修改还不是一件容易的事。
将代码高亮插件换到 Crayon Syntax Highlighter 。现在的这个插件还是让我比较满意的。

插件演示

# -*- coding: UTF-8 -*-
import os
from contextlib import contextmanager as __ctxmgr
from fabric.api import *
from fabric.decorators import runs_once
import fabsettings as cfg
#host settings
env.hosts = ['vicalloy@jstwind.com']
env.password = cfg.PASSWORD
#env.passwords = fabsettings.PASSWORDS
#custom settings
env.deploy_dir = '/home/vicalloy/webapps/jstwind/timeline-site'
env.activate = 'source %s' % os.path.join(env.deploy_dir, 'env/bin/activate')
env.mg = 'python %s' % os.path.join(env.deploy_dir, 'sites', 'manage.py ')
@__ctxmgr
def __virtualenv():
    with cd(env.deploy_dir):
        with prefix(env.activate):
            yield
def reload():
    wsgi = os.path.join(env.deploy_dir, 'deploy', 'dj_scaffold.wsgi')
    run("touch %s" % wsgi)
def update():
    with __virtualenv():
        run("git pull")
        run('%s syncdb' % env.mg)
        run('%s migrate' % env.mg)
        run('%s compress --force' % env.mg)
        reload()

“似水流年”近期情况

推广情况

网站在6月1日上线,并在上线后创建了一个乔布斯的时间线作为网站使用演示。网站上线后将乔布斯的时间线分享到新浪微薄。在博客上写博客公布网站。python.cn网站将“似水流年”作为django项目进行推荐。由于我的博客以及微薄的关注人数并不多,宣传效果一般。python.cn为网站带来的流量相对来说还不错。

网站现状分析

让人比较尴尬的一点是用户创建时间线的积极性并不是太高。即使只是简单创建,并未添加内容的时间线也没几个。我想这应当和网站的访客类型有这不小的关系。我的博客与python.cn的访客都以技术人员为主,这在一定程度上和“似水流年”的目标用户是不匹配的。就我个人对网站的预期定位以粉丝群体与历史爱好者为主。创建和管理好一个时间线是非常花精力的一件事,如果缺乏一定的热情是很难坚持做下去是。对偶像的热爱可以很好的支撑时间线的维护热情。对历史爱好者而言,时间线良好的视觉效果对历史事件的整理有着先天的优势。
就我的实际使用而言,尽管我花了不少的精力在时间线的编辑功能上,但时间线的创建成本还是太高。为创建一个时间线你需要花费不少的时间收集相关的资料,除此之外资料的录入也并不省心。要想降低时间线的创建成本似乎只能用些自动方法抓取内容生成时间线,但我并不太想这么做。过多自动生成的内容会降低网站内容的质量。一个内容质量过低的网站只是单纯的增加网络上的信息噪声而已。

近期开发计划

  • 社会化分享按钮(已添加)
    • 微博有着超强的信息传播能力。虽然不确定是否真会有人使用分享功能,但感觉加上还是有些必要。
  • SEO的相关优化
    • 时间线的加载基于AJAX实现,这将导致搜索引擎无法正确抓取时间线信息。出于SEO的考虑,网站讲增加文字版的timeline查看页面。
  • 协作编辑功能
    • 一人编辑过于辛苦,如果是团队维护则要轻松不少。感觉类似功能对粉丝团体将比较有用。
  • 自动生成微博的时间线
    • 输入微博用户名,自动抓取微博数据生成时间线。作为网站的一个工具应用出现,相关数据不混入网站首页。

时间线网站“似水流年”上线

网站地址: http://jstwind.com
在很早前就想做这么一个关于时间线的网站了,并在今天年初开始真正开始行动。中途因为各种原因将这件事情给搁置了,直到最近才重新启动。目前还只是完成了基础功能,细节方面也未能调教到自己满意的程度。不过不管怎么说,网站总算是基本可用了。欢迎大家上去看看,去制作自己感兴趣的时间线。
目前网站上只有一个关于 乔布斯 的时间线。事件的编辑比我预想的还要花时间,这也让我更希望能早些加入时间线的协作编辑功能。
这是我在继 LBForum 之后真正有在用心做的一个私人项目。项目后台代码方面的工作量倒还好,主要的工作都花在了前端上。事件的编辑是一项非常繁琐的工作,因此花费了不少时间来使用AJAX来提高事件编辑的易用性。项目代码托管在 github 上。项目地址在以前的博客里发布过,如果你感兴趣的话可以去找找。
最后把用到的主要技术和服务列一下,接下来一段时间可能会将其中用到一些技术写成博客:

  • 网站部署在 webfaction ,采用apache+mod_wsgi的方式进行部署。
  • 由于webfaction在国内的访问速度并不理想,静态资源托管在sina的 SAE 平台上。因为申请了SAE的开发者认证,每月有1.5w的免费云豆资源,闲着也是闲着。
  • 域名在 godaddy 购得。在使用优惠码后,一年的费用不足$2。
  • 域名的DNS解析用的是 DNSPod 。 DNSPod在易用性方面确实做的很不错。
  • 使用 腾讯企业邮箱 。 或许很多人对腾讯比较反感,但腾讯的产品确实都还做的不错。使用腾讯企业邮箱的重要原因之一是免费。
  • 服务端的开发技术依旧用的是 Django 。使用自己熟悉的技术可以大大的加快开发进度。
  • 前端用的是 twitter-bootstrap 。bootstrap目前已经有烂大街的趋势了,不过这东西确实好用。为减少bootstrap的痕迹,下一步考虑给jstwind换个配色方案。
  • JS的基础库用 JQuery 。现在JQuery基本上已经是JS标准的一部分了。
  • 时间线的JS控件用的是 Timeline JS 。虽然这个JS组件还有不少让我不太满意的地方,但这个组件胜在漂亮,而且作者非常勤奋,github上提的issue基本上在一天内就会有回复。
  • 文件上传用的是 jQuery-File-Upload 。纯JS实现,不依赖Flash即可实现文件的批量上传。缺点是如果客户用的浏览器版本太老就无法使用批量上传功能了。
  • Django的第三方APP方面用的就比较多了,其中包括 django-userena、django-taggit等,以及部分我自己写的与修改的APP。第三方APP的详细列表可以查看项目中的 requirements.txt 文件