時間戳的問題

我們的微博應用的一個忽略了很久的問題就是日間和日期的顯示。

直到現在，我們在我們的User和Post對象中使用Python它自己的方式來渲染時間對象，但這并不是一個好的解決方案。

考慮下這樣的例子。我正在寫這篇文章，此時正是12月31號下午3:54。我的時區是PST（或者你們更習慣的：UTC-8)。 在Python解釋器中運行，我得到下面輸出：
 

>>> from datetime import datetime>>> now = datetime.now()>>> print now2012-12-31 15:54:42.915204>>> now = datetime.utcnow()>>> print now2012-12-31 23:55:13.635874

在我所在的地方，now()方法返回了正確的時間，但是now()調用返回的時間是UTC單位。

那么，使用哪個更好呢？

如果我們用now()，所有數據庫里的時間戳將會與服務器運行的當地時間一致，這將會產生一些問題。

比如，如果有一天，我們需要將服務器放到別的地方（不在一個時區），那么在重啟服務器之前，數據庫里的時間都需要更新到與新地點保持一致。

還會有更為重要的問題。不同時區的用戶將會很難知道什么時候發送郵件，如果用戶看到的是PST時區的時間，他們就很難知道郵件是什么時候發送的，這就需要用戶根據這個時間做相應的調整。

很顯然這不是一個好的選擇，這也是我們為什么在創建數據庫時就使用UTC時區保存時間戳。

在標準化時間戳為UTC時，解決了移動服務器的問題。但是他不能解決第二個問題，數據和時間在世界上不同地方使用UTC展現給用戶。

假設一個用戶在PST時區下午3點發送了一封郵件，這封郵件立刻顯示在他面前，上面寫著11:00pm，或者更具體點（23：00）。

我寫這個文章的目的也就是讓我們的用戶不再因為數據和時間的顯示而困惑。

使用具體的時間戳

通常的解決方法是，每一個用戶都從UTC轉化到當地的時間。這就需要我們動態變化，從而使數據庫的UTC與之保持一致。

但是我們怎么知道用戶在哪呢？

許多網站都有一個設置頁面設置他們的時區。這就需要我們添加一個新的頁面，并在表單上提供下拉框讓用戶選擇時區，用戶第一次登錄的時候需要設置時區，并把它作為注冊的一部分。

這是一個正常的解決方法，但是這對于用戶來說有點累贅，用戶需要輸入一條他們已經在操作系統中配置過的信息。所以如果我們能抓取到用戶電腦里設置的時區那解決問題會變得更有效率。

出于安全因素，瀏覽器不允許我們進入用戶操作系統獲取信息。即使它允許，我們也得知道在Windows，Linux，Mac，iOS，Android中從哪兒能獲得到時區，這還不包括其他非主流操作系統。

在瀏覽器中得到用戶的時區，然后通過標準的Javascript API獲取到。在Web 2.0世界中用戶允許Javascript執行(很少有網站不使用Javascript)，所以通過Javascript獲取用戶時區是可行的。

我們用Javascript有兩種方式配置可用的時區：

    老派的做法：當用戶第一次登錄服務器時讓瀏覽器以某種方式發送時區信息給我們。這個可以通過Ajax調用，或者更簡單的通過meta refresh tag來實現。一旦服務器知道了時區信息，它就能保存它在用戶session中，然后調整所有頁面的時間顯示。
    新派的做法：不改變服務器端的任何東西，但仍然會發送UTC時間戳到客戶端瀏覽器。轉換UTC到本地時間的工作通過Javascript在客戶端執行。

兩種方法都是有效的，但第二種更有優勢一點。瀏覽器能依照系統本地配置最好滴完成時間轉換。像上午/下午 vs 24小時制，日/月/年 vs 月/日/年 還有其他各種文化的格式，這些格式都是瀏覽器可訪問的，但服務器就不一定了。

如果這些還不夠，那新派的做法還有一個更大的優勢，而且別人已經為我們做了這件事(moment.js要登場了)!

moment.js簡介

Moment.js 是一個小、免費、開源的Javascript庫，它將日期和事件提升到另一個等級。它提供了能想象到的所有的時間日期格式，下面就是一些。

要在我們的應用中使用moment.js就需要在我們的模板文件中寫那么一丟丟的Javascript代碼。我們先來通過ISO 8601 時間來創建一個moment對象。例如：通過上面Python例子的UTC時間來創建一個moment對象，就像這樣：
 

moment("2012-12-31T23:55:13 Z")

一旦對象被創建，它就可以被轉化成各種各樣格式類型的string。例如，將一個灰常冗長的時間顯示轉換為本地系統的時間：
 

moment("2012-12-31T23:55:13 Z").format('LLLL');

下面就是轉換以后的時間顯示:

Tuesday, January 1 2013 7:55 AM

這兒有更多的例子將同樣的時間戳轉化為不同的格式：

這個類庫對轉化選項的支持不止這些。除了format()之外，它還提供了fromNow()和calendar()這些更友好的時間戳轉化方法： 

 注意上面所有的例子中服務器轉換相同的UTC時間，而你自己的本地瀏覽器則會轉換不同的時間。

最后我們補上漏掉的一點Javascript小技巧，在頁面中顯而易見的是，代碼實際上由moment返回了string類型。最簡單的完成方式是用Javascript的document.write方法：
 

<script>document.write(moment("2012-12-31T23:55:13 Z").format('LLLL'));</script>

通過使用Javascript的document.write是灰常簡單和直接的方式來生成一部分HTML代碼，然而需要注意的是這種方式有一些限制。最需要主義的一點就是document.write方法只能在document被加載時使用，當document加載完成后，它便不能修改document了。這個限制的結果就是當通過 Ajax 來加載數據時這種解決方案就失效了。
 
整合moment.js

這兒我們需要做一點點事把moment.js添加到我們的微博客中.

首先，我們需要下載moment.min.js這個庫到/app/static/js這個文件夾中，這樣它就可以作為靜態文件為客戶端服務。

然后我們在我們的模板文件(fileapp/templates/base.html)中添加這個庫(moment.min.js)的引用:

<script src="/static/js/moment.min.js"></script>

現在我們可以在模板文件中添加<script>標簽來顯示我們想要的時間戳。但我們想替換這種方法，于是我們給moment.min.js加了一層包裝來更好的從模板中調用它。這樣將節約我們將來修改時間戳代碼的時間，因為這樣我們只要在一個地方修改它就好了。

我們的包裝是一個灰常簡單的Python類(fileapp/momentjs.py):
 

from jinja2 import Markup class momentjs: def __init__(self, timestamp): self.timestamp = timestamp  def render(self, format):  return Markup("<script>/ndocument.write(moment(/"%s/").%s);/n</script>" % (self.timestamp.strftime("%Y-%m-%dT%H:%M:%S Z"), format))  def format(self, fmt):  return self.render("format(/"%s/")" % fmt)  def calendar(self):  return self.render("calendar()")  def fromNow(self):  return self.render("fromNow()")

注意這兒的render方法沒有直接返回一個string類型而是返回一個由我們的模板引擎Jinja2提供的Markup對象。這么做的原因是Jinja2默認會轉義所有string，舉例來說，我們的<script>標簽不能被傳到客戶端，而會被替換成<script>("<"">"這些符號被轉義了，譯者注)。所以，用Markup對象來包裝這些string會告訴Jinja2這些string不能被轉義。

現在我們有了一個包裝器，我們需要通過Jinja2來連接，這樣我們的模板就可以來調用它(fileapp/__init__.py):
 

from momentjs import momentjsapp.jinja_env.globals['momentjs'] = momentjs

這樣Jinja2就會把我們的類當做全局變量來暴露給所有的模板。

現在我們準備開始修改我們的模板。在我們的應用中有兩個地方來顯示日期和事件。一個是在用戶屬性頁面，我們顯示”最后看過“的時間。對于這個時間戳我們將用calendar()方法來轉換(fileapp/templates/user.html):
 

{% if user.last_seen %}<p><em>Last seen: {{momentjs(user.last_seen).calendar()}}</em></p>{% endif %}

第二個地方是post的子模板中，它被index，user和search頁面調用。在這兒我們用fromNow()方法來轉換，因為post是多久前被創建的比它具體是哪一個時刻被創建的重要。要提取轉換以后的post時間到子頁面，我們只需要改動一個地方就可以影響所有需要轉換的post時間(fileapp/templates/post.html):

<p><a href="{{url_for('user', nickname = post.author.nickname)}}">{{post.author.nickname}}</a> said {{momentjs(post.timestamp).fromNow()}}:</p><p><strong>{{post.body}}</strong></p>

隨著這些模板的改動，我們便解決了所有的時間戳問題。我們不需要單獨的去修改服務器端的代碼！
 
結束語

不知不覺中，今天我們通過做一些客戶端時間日期配置的改變，已經朝使微博客變得更受多國用戶青睞邁出重要一步。

在這個系列的下一部分中，我們將要使微博客支持多國語言(國際化)，從而讓它不同國家用戶的更受歡迎。

同時，這兒提供了集成moment.js的應用得下載鏈接：

下載 microblog-0.13.zip。