PythonのFlaskでURLに言語コードを含める方法!多言語ルーティングの実装ガイド
生徒
「先生、WebサイトのURLで『/ja/』とか『/en/』って付いているのを見かけますが、あれはどうやって作るんですか?」
先生
「それは多言語ルーティングという仕組みです。Flaskを使えば、URLの先頭にある言葉を読み取って、表示する言語を自動で切り替えることができるんですよ。」
生徒
「URL自体に言語を含めると、何かいいことがあるんですか?」
先生
「検索エンジンが言語ごとのページを正しく認識してくれたり、ユーザーがURLを見ただけで何語のページか分かったりと、メリットがたくさんあります。詳しく見ていきましょう!」
1. URLに言語コードを含める理由とメリット
Webサイトを多言語化する際、ブラウザの設定で自動的に言語を切り替える方法もありますが、あえてURLに「/ja/」や「/en/」を含める方法がプロの世界では推奨されています。これを「多言語ルーティング」と呼びます。
最大のメリットは、Googleなどの検索エンジンに対する最適化(SEO対策)です。URLが分かれていることで、検索エンジンは「このページは日本語用」「このページは英語用」と個別に記録(インデックス)してくれます。その結果、海外のユーザーが英語で検索したときに、あなたのサイトの英語ページがヒットしやすくなるのです。
また、ユーザーが特定の言語ページをお気に入りに登録したり、友人にシェアしたりするときも、URLに言語が含まれていれば、受け取った相手も同じ言語でページを開くことができます。これは、利用者にとって非常に親切な設計と言えるでしょう。
2. ルーティングの基本とFlaskでの役割
ここで少し「ルーティング」という言葉について説明します。ルーティングとは、ユーザーが入力した住所(URL)に対して、どのプログラム(関数)を動かして、どの画面(HTML)を表示するかを決める「交通整理」のような役割です。
Flaskという道具(フレームワーク)では、この交通整理を非常に簡単に行うことができます。通常は「/index」や「/about」といった行き先を指定しますが、多言語化の場合はその手前に「言語の名前」という関門を設けるイメージになります。
「/ja/index」なら日本語の案内係を呼び出し、「/en/index」なら英語の案内係を呼び出す。この仕組みをPythonのコードでどのように実現するのか、具体的な書き方を学んでいきましょう。
3. URLから言語コードを読み取るコードの書き方
それでは、実際にPythonでURLの一部を変数として受け取る方法を見てみましょう。Flaskでは、URLの指定部分に「山括弧(< >)」を使うことで、その場所に入力された文字をプログラムの中で利用できるようになります。
from flask import Flask, render_template
app = Flask(__name__)
# URLの最初に「lang」という変数を受け取る設定です
@app.route('/<lang>/')
def index(lang):
# 受け取った言語コードによって表示を変えることができます
if lang == 'ja':
message = "こんにちは!"
elif lang == 'en':
message = "Hello!"
else:
message = "Welcome!"
return render_template('index.html', msg=message, current_lang=lang)
if __name__ == '__main__':
app.run(debug=True)
このコードでは、ブラウザで「/ja/」にアクセスすれば「こんにちは!」が表示され、「/en/」なら「Hello!」が表示されます。このように、URLの一部を「情報」として取り扱うのが多言語ルーティングの第一歩です。
4. Flask-Babelと連携させて自動で翻訳する
先ほどの例では手動でメッセージを書き換えましたが、ページ数が増えると管理が大変です。そこで、翻訳ファイルを一括管理できる「Flask-Babel」という便利な道具を組み合わせます。
「URLに含まれる言語コードを見て、Babel(翻訳担当)にその言語を使わせる」という連携プレーを行います。これには「locale_selector(ロケールセレクター)」という設定を使います。
from flask import Flask, g, request
from flask_babel import Babel
app = Flask(__name__)
babel = Babel(app)
# ページが表示される前に動く処理です
@app.before_request
def before_request():
# URLの最初の部分を取得して、gという共通の場所に保存します
# 例: /ja/about なら lang_code は 'ja' になります
lang = request.view_args.get('lang') if request.view_args else None
g.lang_code = lang if lang in ['ja', 'en'] else 'ja'
@babel.localeselector
def get_locale():
# Babelに、今使うべき言語を教えます
return g.get('lang_code', 'ja')
ここでは「g」という、一つのリクエスト(一回のアクセス)の間だけ有効な「共有メモ帳」のようなものを使っています。URLから抜き取った言語をこのメモに書いておくことで、翻訳担当のBabelがそれを見て適切な言語ファイルを選んでくれるようになります。
5. blueprintを使ってURLの設計を整理する
全てのURLに「/<lang>/」と書くのは、ページが増えてくると非常に面倒です。そこで「Blueprint(ブループリント)」という、いわば「設計図の小分け」機能を使います。
あらかじめ「この設計図の中のURLは、全部最初に言語コードがつきますよ」と宣言しておくことができます。これにより、個別のページ設定では言語のことを気にせずにコードを書くことができるようになります。
from flask import Blueprint
# 言語コード付きの設計図(Blueprint)を作成します
bp = Blueprint('main', __name__, url_prefix='/<lang_code>')
@bp.route('/home')
def home(lang_code):
# この関数は /ja/home や /en/home で呼び出されます
return f"現在の言語設定は {lang_code} です。"
app.register_blueprint(bp)
「url_prefix(URLプレフィックス)」という設定がポイントです。これは「URLの接頭辞」という意味で、全てのURLの前に共通の文字を自動で付けてくれる魔法の設定です。これを使えば、大規模なサイトでもスマートに多言語化が進められます。
6. 言語切り替えボタンをHTMLに設置する工夫
仕組みができたら、次はユーザーが自分で言語をポチポチ切り替えられるように、画面上にボタンを作りましょう。URLを直接打ち込んでもらうわけにはいかないので、リンク(aタグ)を使います。
ただリンクを貼るのではなく、今のページを維持したまま言語だけを「ja」から「en」に変えるようなリンクを作るのが親切です。
<div class="language-switcher">
<p>言語を選んでください:</p>
<ul class="nav">
<li class="nav-item">
<a href="{{ url_for('main.home', lang_code='ja') }}" class="btn btn-sm btn-outline-dark">日本語</a>
</li>
<li class="nav-item">
<a href="{{ url_for('main.home', lang_code='en') }}" class="btn btn-sm btn-outline-dark">English</a>
</li>
</ul>
</div>
このように、ボタンを押すたびにURLの「ja」の部分が「en」に書き換わってページが開き直される仕組みを作ります。これが、Webサイトを訪れた人が一番迷わずに使える、理想的な多言語切り替えの形です。
7. 無効な言語コードが入力された時の対処法
もし、ユーザーがURLを直接書き換えて「/zz/home」のように、存在しない言語コードを入力してしまったらどうなるでしょうか。プログラムが想定していない言葉が来ると、エラーが起きてしまうかもしれません。
そのため、あらかじめ「うちのサイトが対応しているのは、日本語と英語だけですよ」というガード(チェック処理)を入れておく必要があります。
もし対応していない言語コードが入力された場合は、自動的にデフォルト(標準)の言語である日本語のページに飛ばしてあげる(リダイレクトする)処理を加えるのが、プロの技です。これにより、ユーザーを迷子にさせることなく、常に正常なコンテンツを見せることができます。
8. URLの末尾や途中に言語を入れる方法との違い
今回は「/ja/index」のようにURLの先頭に言語を入れる方法を解説していますが、他にも「index?lang=ja」のように後ろに付ける方法もあります。
しかし、SEO(検索エンジンでの見つけやすさ)の観点では、今回紹介した「先頭に含める方法」が最も優れているとされています。検索エンジンのロボットは、URLの構造をディレクトリ(フォルダ)のように理解するため、先頭に言語がある方が「別の言語の独立したページだ」と認識しやすいのです。
最初は少し設定が難しく感じるかもしれませんが、FlaskのBlueprint機能を活用すれば、一度設定するだけで後は自動的に綺麗なURLが生成されるようになります。長い目で見れば、この方法が一番楽で効果的です。
9. ローカル環境での動作確認とテスト
コードが書けたら、実際に自分のパソコンで動かしてみましょう。ブラウザのアドレスバーに「http://127.0.0.1:5000/ja/home」と打ち込んで、日本語が表示されるか。次に「/en/home」に変えてみて、英語に切り替わるかを確認します。
もしうまく動かない場合は、Blueprintの登録が漏れていないか、あるいは関数の引数に「lang_code」という変数を入れ忘れていないかをチェックしてみてください。
プログラミングは、小さな間違い(タイポと言います)一つで動かなくなることがありますが、それはパソコンが非常に真面目にあなたの命令を聞こうとしている証拠です。一つずつ確認していけば、必ず解決できます。
10. 世界に広がるサイトへの第一歩
URLに言語コードを含めることができれば、あなたのWebアプリは一気に「世界標準」の仲間入りです。日本国内だけでなく、海外の友人やユーザーにも自信を持ってURLをシェアできるようになります。
Flaskには、今回紹介した以外にも多言語化を支える強力な機能がたくさんあります。まずはこのルーティング(URLの整理)をマスターして、ユーザーが使いやすく、検索エンジンにも好かれる素晴らしいサイトを作っていきましょう。
「/ja/」から始まるあなたのサイトが、世界中の誰かの役に立つ日が来るのが楽しみですね。焦らず、一歩ずつ進んでいきましょう!