PythonのFlask-Babelで言語を切り替える!多言語サイト制作の仕組みを完全解説
生徒
「先生、翻訳ファイルは作れましたが、どうやって日本語と英語を切り替えるんですか?」
先生
「Flask-Babelには、ユーザーがどの言語を使いたいかを判断する『セレクター』という仕組みがあります。」
生徒
「セレクター……難しそうですね。自動で切り替わるんですか?それともボタンで作るんですか?」
先生
「両方できますよ!ブラウザの設定を見て自動で選ぶ方法と、URLに言語を含めて強制的に切り替える方法があります。順番に見ていきましょう!」
1. 言語切り替えの要となるロケールセレクターとは
多言語対応のWebサイトにおいて、一番大切なのは「今このページを見ている人に何語を表示するか」を決めることです。この判断を行う仕組みを、Flask-Babelでは「ロケールセレクター」と呼びます。「ロケール」とは、言語や国、地域の設定をまとめた情報のことを指します。
例えば、日本に住んでいる人が日本語の設定にしているスマホでサイトを見たら日本語を出し、アメリカの人が英語設定のパソコンで見たら英語を出す、といった交通整理のような役割をこのプログラムが担当します。
未経験の方にとって、プログラムが自動で判断すると聞くと魔法のように感じるかもしれませんが、実際には「ブラウザが送ってくるリクエスト情報」の中に答えが書いてあります。Flask-Babelは、その答えを読み取って、私たちが事前に用意した翻訳ファイルの中から適切なものを選んでくれるのです。
2. ブラウザの設定から自動で言語を判別する方法
もっとも親切な方法は、ユーザーが何もしなくても自動で最適な言語が表示される設定です。これには、Flaskが提供する「request.accept_languages」という機能を使います。
ブラウザ(Google ChromeやSafariなど)は、サイトにアクセスするときに「私は日本語が第一希望で、英語が第二希望です」という名刺のようなデータを送っています。プログラムでその名刺を読み取るコードを書いてみましょう。
from flask import Flask, request
from flask_babel import Babel
app = Flask(__name__)
# ここで言語を決定するルールを決めます
def get_locale():
# ブラウザが希望する言語の中から、アプリが対応している「ja」か「en」を選びます
return request.accept_languages.best_match(['ja', 'en'])
# アプリに多言語化のルールを教えます
babel = Babel(app, locale_selector=get_locale)
この「best_match」という命令がとても優秀で、もしユーザーが「フランス語」を希望していても、こちらのアプリが「日本語」と「英語」しか用意していなければ、より優先度の高い方や、デフォルトの設定を選んでくれます。
3. URLのパラメータで言語を強制的に指定する
自動判別は便利ですが、時には「日本語設定のパソコンを使っているけれど、英語の勉強のために英語ページで見たい」という場合もあります。そんなときのために、URLの後ろに「?lang=en」のような文字をつけて言語を切り替える仕組みを作っておくと親切です。
これを実現するために、先ほどの「get_locale」関数を少しパワーアップさせてみましょう。
def get_locale():
# URLに「lang=xx」という文字が入っていないか確認します
arg_lang = request.args.get('lang')
if arg_lang in ['ja', 'en']:
return arg_lang
# URLに指定がなければ、ブラウザの設定を優先します
return request.accept_languages.best_match(['ja', 'en'])
このコードのおかげで、例えば「http://localhost:5000/?lang=en」と入力すれば、どんな環境の人でも強制的に英語の翻訳ファイルが読み込まれるようになります。これが手動切り替えの第一歩です。
4. 言語切り替えボタンをHTMLに設置する
URLを直接手で入力するのは一般のユーザーには難しいので、画面上に「日本語」「English」という切り替えボタン(リンク)を作ってあげましょう。
HTMLファイルの中で、先ほど決めた「lang」というパラメータを付けたリンクを配置します。Bootstrapというデザインの道具を使っている場合は、以下のように書くと綺麗に見えます。
<div class="btn-group" role="group">
<a href="/?lang=ja" class="btn btn-outline-primary">日本語</a>
<a href="/?lang=en" class="btn btn-outline-primary">English</a>
</div>
<p>
{{ _('Hello World') }}
</p>
ユーザーが「English」ボタンを押すと、URLに「lang=en」が付与され、プログラムがそれを検知して翻訳データを切り替えます。とてもシンプルで分かりやすい仕組みですね。
5. セッションを使って言語の設定を保存する
URLに毎回「lang=en」を付けるのは、ページを移動するたびに消えてしまうという欠点があります。一度選んだ言語を、サイトを閉じたり移動したりしても覚えておいてほしいときは「セッション(Session)」という仕組みを使います。
セッションとは、サーバー側に一時的にユーザーの情報を保存しておく「記憶の引き出し」のようなものです。
from flask import session
def get_locale():
# 1. まずURLの指定があるか見る
lang = request.args.get('lang')
if lang:
session['selected_lang'] = lang
return lang
# 2. セッションに保存された記憶があるか見る
return session.get('selected_lang', request.accept_languages.best_match(['ja', 'en']))
こうすることで、一度「English」を選べば、その後どのページに移動してもずっと英語のまま表示されるようになります。ユーザー体験(使いやすさ)がぐっと良くなりますね。
6. 翻訳が見つからない場合の挙動を理解する
もし、プログラムが「この言葉を翻訳して!」と命令されたのに、翻訳ファイルの中にその言葉が見つからなかったらどうなるでしょうか?
安心してください。Flask-Babelは、翻訳が見つからない場合は「元の言葉」をそのまま表示します。例えば、プログラムに「_('Welcome')」と書いてあって、日本語の翻訳ファイルにその訳語が登録されていなければ、画面にはそのまま「Welcome」と出ます。
そのため、まずは英語でサイトを作っておき、少しずつ日本語の翻訳を追加していくという進め方も可能です。いきなり全てを完璧にする必要はありません。
7. 複数の言語コードに対応させるための工夫
「ja(日本語)」や「en(英語)」以外にも、世界にはたくさんの言語コードがあります。例えば、中国語は「zh」、スペイン語は「es」です。
将来的に対応する言語を増やしたい場合は、アプリの設定ファイルなどに「SUPPORTED_LANGUAGES = ['ja', 'en', 'es', 'zh']」のようにリストを作っておくと管理が楽になります。
プログラムが複雑になっても、基本は「ユーザーの希望を聞く」→「対応できるか確認する」→「翻訳データを出す」という三つのステップに変わりはありません。
8. 日付や数値の形式も自動で切り替える
Flask-Babelのすごいところは、文字の翻訳だけではありません。日付の書き方や数字の区切り方も、言語に合わせて変えてくれます。
日本では「2026年3月26日」と書きますが、アメリカでは「March 26, 2026」と書くのが一般的です。これらを自分で計算して書き換えるのは大変ですが、Babelを使えばロケール情報に基づいて自動的にフォーマットを変換してくれます。
from flask_babel import format_datetime
from datetime import datetime
@app.route('/time')
def show_time():
# 現在の時刻を、ユーザーの言語に合わせた形式で表示します
return format_datetime(datetime.now())
これで、文字だけでなく、文化的な習慣に合わせた表示ができるようになります。
9. 言語切り替え機能の実装をテストする方法
正しく言語が切り替わるか確認するには、自分のブラウザの言語設定を一時的に変えてみるのが一番確実です。
Google Chromeなら「設定」の「言語」メニューから優先順位を変更できます。また、もっと簡単な方法としては、先ほど作った「?lang=en」などのURLパラメータを直接ブラウザのアドレスバーに打ち込んでみることです。
画面の文字が変わった瞬間の感動は、プログラミングを始めたばかりのときならではの喜びです。もし変わらなければ、翻訳ファイルのコンパイル(moファイルへの変換)を忘れていないか確認してみてください。
10. 世界中の人に届くサイトを目指して
多言語対応は、単に文字を置き換える作業ではありません。あなたの作ったサービスや情報を、言葉の壁を越えて届けるための架け橋を作る作業です。
Flask-Babelを使えば、小規模なサイトから大きなシステムまで、この基本的な切り替えの仕組みだけで十分対応できます。一見難しそうな「翻訳の切り替え」も、分解してみれば「条件分岐」というプログラミングの基礎の組み合わせです。
今回学んだロケールセレクターの設定をマスターすれば、あなたのサイトは一気に「国際派」の仲間入りです。焦らず、自分のペースでコードを書き換えて、サイトが多言語で動く様子を楽しんでくださいね。