ブラウザの言語設定別で表示する静的ファイルを切り替えたい
indexとして表示する静的ファイルというか
htmlファイルを切り替えたい。
そんな時はnginxとlua-nginx-moduleを使えばお手軽。
Accept-Language ヘッダの内容を見て
日本語/英語の切り分けを行う形で良い。
動作環境準備
Mac OS Xでのnginx + lua-nginx-module のインストールについてはこちら。
Accept-Languageヘッダの中身を気軽に観たい
気軽じゃないけど。nginx.confの設定を以下の形に書き換える。
80ポートは予約ポートの一部になっているので、
8080で指定しとく。(これのがrootにならなくても良いので起動が楽)
X-Accept-Languageヘッダとしてサーバーが受け取った
Accept-Languageヘッダを吐き出すように指定している。
worker_processes 1;
error_log logs/error.log;
pid logs/nginx.pid;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type text/plain;
access_log logs/access.log;
sendfile on;
keepalive_timeout 65;
gzip on;
server {
listen 8080;
server_name localhost;
access_log logs/host.access.log;
add_header X-Accept-Language $http_accept_language;
location / {
root html;
index index.html index.htm;
}
}
}
nginx.confファイルの編集が終わったら
nginxを立ちあげる。
/usr/local/sandbox/nginx-1.4.0/sbin/nginx
その後、ブラウザーにてhttp://localhost:8080/にアクセス。
Firebugなどを利用し、先ほど設定した
X-Accept-Languageヘッダの中身を見てみる。
バッチリAccept-Languageヘッダが取れている。
Accept-Languageヘッダの形式
RFC2616 (を参考)
Accept-Language: da, en-gb;q=0.8, en;q=0.7
qはquality valueというもので、どの割合で
言語を指定したいか、を先頭に指定している
言語が使えない場合は優先して、上の場合であればen-gbを利用する、
さらになければenを利用する、という形になる。
でも今回は細かいことをやるのはだるいので、
ヘッダ内文字列にある先頭に指定されている言語をみて、
jaなら日本語、それ以外なら無条件で英語、
という形でやってみよう。
コンテンツの準備
早速言語別のコンテンツの準備をしよう。
htmlディレクトリ以下にファイルを2つ、作成する。
cd /usr/local/sandbox/nginx/html
touch ja.html en.html
各ファイルの中身はこんな感じで。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>この世界へようこそ</title>
</head>
<body>
<h1>この世界へようこそ</h1>
<p>ようこそ、地下の世界へ...</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>Hello world!</title>
</head>
<body>
<h1>Hello world!</h1>
<p>Welcome to underground...</p>
</body>
</html>
できたら、nginx.confの設定を以下の形に書き換える。
worker_processes 1;
error_log logs/error.log;
pid logs/nginx.pid;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type text/html;
access_log logs/access.log;
sendfile on;
keepalive_timeout 65;
gzip on;
server {
listen 8080;
server_name localhost;
access_log logs/host.access.log;
add_header X-Accept-Language $http_accept_language;
set $set_language "";
set_by_lua $set_language "
return string.lower(string.match(ngx.arg[1], '([a-zA-Z-]+),'))
" $http_accept_language;
set $index_html "ja.html";
if ($set_language != "ja") {
set $index_html "en.html";
}
index $index_html;
location / {
root html;
try_files $uri $uri/ /index.html;
}
}
}
Accept-Languageヘッダの切り出し
string.match(ngx.arg[1], '([a-zA-Z-]+),')
ngx.arg[1]には$http_accept_languageが渡される。
で、ja, en-us;q=0.8, en;q=0.7
という形でAccept-Languageヘッダが設定されていれば
jaだけが切り出される。
index ディレクティブはif文内に書くことはできないので、
$index_htmlの初期値を"ja.html"とし、
$set_languageに代入された文字列が"ja"でなければ
$index_html に対して "en.html"を設定する。簡単だ。
表示切り替えの確認
nginxを起動して切り替わるか確認をする。
/usr/local/sandbox/nginx-1.4.0/sbin/nginx
動作確認を行うブラウザーの言語設定をen-USに設定する。
OK。
続いて言語設定を日本語優先にしてみる。
OK。日本語のコンテンツが表示された。
簡単に言語設定によるコンテンツ表示の切替が
できるようになった。
...正確にはindex指定するファイルの切り替えなので、/en.htmlとか指定すると見れちゃうけど
その他
※Ubuntuでdebパッケージ使って実現したい場合は、
nginxパッケージとnginx-extraパッケージを使えば
すぐにlua-nginx-moduleを利用することができる。