[Ruby on Rails系列]4、專題：Rails應用的國際化［i18n］

標籤：des   style   blog   http   color   io   os   ar   for   

1. 什麼是internationalization（i18n）？

國際化，英文簡稱i18n，按照維基百科的定義：國際化是指在設計軟體，將軟體與特定語言及地區脫鉤的過程。當軟體被移植到不同的語言及地區時，軟體本身不用做內部工程上的改變或修正。

當然，官方的定義總是十分高大上。實際上，今天我們要做的並沒有那麼複雜。任務是為上次的系列3裡的Web網站提供多語言支援。比如上次是英語網站，這次我們可以根據使用者地點自動提供中文網站或其他語言網站。

 

2.如何?i18n？2.1 Step1: 登入Cloud9，進入上次的開發環境

cd firstDemo

2.2 Step2:準備多語言字典（locale material）

進入該網站：https://github.com/svenfuchs/rails-i18n/tree/master/rails/locale

該網站提供了各種語言的locale模版，這裡我們需要以下2個檔案（當然如果你需要支援其他國家語言，還需要準備其他檔案）：

［1］en.yml  （英語版本）

［2］zh-CN.yml  （簡體中文版本）

2.3 Step3:編輯config／locales檔案夾(1)

如，在該檔案夾下我們看到只有一個檔案：en.yml，將其開啟發現只有2行代碼如下：

en:  hello: "Hello world"

這是一個yml檔案模版，現在我們需要講其換成上面的en.yml

點擊進入：en.yml 開啟檔案，然後複製粘貼網頁內容，將原來的en.yml檔案內容覆蓋

［注意點：正確的複製方法與錯誤的複製方法］

YML檔案是通過key－value格式定義資料的檔案，它是Ruby on Rails裡的資料定義檔案，特點是空格敏感！錯誤的複製方法會忽略空格進而導致語法錯誤。因此這裡的操作非常重要。

［正確的複製方法］

如，點擊紅色地區的按鈕，進入新的頁面，然後再進行複製，即可保留空格。如果直接在該頁面複製，會忽略空格導致語法錯誤！

2.4 Step3:編輯config／locales檔案夾(2)

en.yml搞定以後，在config／locales檔案夾下建立檔案：zh.yml,再將zh-CN.yml下的內容同樣複製過去

注意，zh.yml檔案第一行應將zh-CN改成zh（去掉－CN）

 

接下來：我們需要對以上2個檔案（en.yml和zh.yml）進行編輯，以適應我們的Web應用。

對於en.yml，我們需要在en：下一行，date：上一列區域輸入以下代碼（注意空格）：

en:  memo_title: My Memopad  show: Show  edit: Edit  destroy: Destroy  list_memo: Listing memos  new_memo: New Memo  date:

對於zh.yml，插入如下代碼：

zh:  memo_title: 我的記錄  show: 展示  edit: 編輯  destroy: 刪除  list_memo: 列表  new_memo: 建立  date:

2.5 Step4:修改views分頁檔

[1]app/views/memos/index.html.erb檔案第17~19行

將該3行代碼改為如下代碼：

<td><%= link_to (t ‘show‘), memo %></td><td><%= link_to (t ‘edit‘), edit_memo_path(memo) %></td><td><%= link_to (t ‘destroy‘), memo, method: :delete, data: { confirm: ‘Are you sure?‘ } %></td>

<% (ruby運算式) %> 該符號表明可在標記中間插入ruby語句

<% =(ruby輸出) %> 該符號可將ruby運算式的值轉換成html輸出結果

(t ‘xxxx‘) t代表翻譯函數，是translate的簡寫形式。該函數將輸出引號所對應的值（參考前面的yml檔案索引值對理解）

[2]app/views/layouts/application.html.erb檔案第4行

將改行改為下列代碼：

<title><%= t ‘memo_title‘ %></title>

[3]app/views/memos/index.html.erb檔案第3行

將改行改為下列代碼：

<h1><%=t ‘memo_title‘ %></h1>

[4]app/views/memos/index.html.erb檔案第27行

將改行改為下列代碼：

<%= link_to (t ‘new_memo‘), new_memo_path %>

2.6 修改config/application.rb檔案

取消第20行，第21行注釋；並將‘my‘改為‘config‘,將:de改為:zh，並添加一行代碼config.encoding = ‘utf-8‘，代碼如下:

config.i18n.load_path += Dir[Rails.root.join(‘config‘, ‘locales‘, ‘*.{rb,yml}‘).to_s]config.i18n.default_locale = :zhconfig.encoding = ‘utf-8‘

這樣，頁面的預設顯示語言就變為中文。

2.7 修改app/controllers/application_controller.rb檔案

將檔案代碼改為以下代碼：

class ApplicationController < ActionController::Base     protect_from_forgery         before_filter :set_locale         def set_locale       I18n.locale = params[:locale] || I18n.default_locale     end end 

至此，i18n配置完畢，現在已經實現了中英雙語支援！

 

3 測試網頁3.1 啟動伺服器

$ rails server -b $IP -p $PORT 

3.2 測試預設網頁

https://rails-tutorial-c9-lichcnpul.c9.io/memos，注意預設網頁會自動轉為中文頁

3.3 測試英文網頁

https://rails-tutorial-c9-lichcnpul.c9.io/memos?locale=en

3.4 測試中文網頁

https://rails-tutorial-c9-lichcnpul.c9.io/memos?locale=zh

 

測試成功，至此本次國際化專題也就告一段落。敬請期待[Ruby on Rails系列]5（待定）

[Ruby on Rails系列]4、專題：Rails應用的國際化［i18n］