# Laravel lang バリデーションメッセージを多言語対応

Laravel のバリデーションメッセージを多言語に対応するために、Laravel と Nuxtjs 修正手順を紹介します。

環境

  • Laravel 10
  • Nuxtjs

# Laravel-lang パッケージのインストール

まず、Laravel-lang パッケージをインストールします。言語ファイルを管理するための便利なツールが提供されます。

# Laravel-lang インストール
composer require laravel-lang/common --dev

必要な言語ファイルの追加
Laravel-lang パッケージをインストールした後、必要な言語ファイルを追加します。以下のコマンドを使用して、英語(en)、日本語(ja)、中国語(zh_CN)の言語ファイルを追加できます。

php artisan lang:add en ja zh_CN

これにより、次のようなディレクトリ構造が作成され、各言語用の言語ファイルが格納されます。

lang
├── en
│   ├── auth.php
│   ├── http-statuses.php
│   ├── pagination.php
│   ├── passwords.php
│   └── validation.php
├── en.json
├── ja
│   ├── auth.php
│   ├── http-statuses.php
│   ├── pagination.php
│   ├── passwords.php
│   └── validation.php
├── ja.json
├── zh_CN
│   ├── auth.php
│   ├── http-statuses.php
│   ├── pagination.php
│   ├── passwords.php
│   └── validation.php
└── zh_CN.json

# Middleware 作成

次に、言語を切り替えるためのミドルウェアを作成します。このミドルウェアでは、リクエストが受信された際に Accept-Language ヘッダーを解析し、サポートされている言語かどうかを確認して、デフォルトの言語を設定します。

以下は、SetLocale ミドルウェアの例です。

app/Http/Middleware/SetLocale.php











 




 









<?php
namespace App\Http\Middleware;

use Closure;
use Illuminate\Http\Request;

class SetLocale
{
    public function handle(Request $request, Closure $next)
    {
        $acceptLanguage = $request->header('Accept-Language');

        $supportedLocales = ['en', 'ja', 'zh_CN'];

        if (in_array($acceptLanguage, $supportedLocales)) {
            app()->setLocale($acceptLanguage);
        } else {
            app()->setLocale('en');
        }

        return $next($request);
    }

}

# Nuxtjs mounted に axios   header 追加

最後に、Nuxt.js アプリケーション内で Axios 通信時に Accept-Language ヘッダーを追加する必要があります。これにより、リクエストがサーバーに送信される際に選択された言語が送信されます。

以下は、Nuxt.js のレイアウトファイルである layout/default.vue 内で mounted メソッドを使用して Accept-Language ヘッダーを設定する例です。

layout/default.vue

  mounted() {
    this.$axios.setHeader('Accept-Language', this.$i18n.locale)
  },

これにより、各リクエストに適切な言語設定が含まれるようになり、多言語対応が実現されます。

2023-10-07

同じタグを持つ記事をピックアップしました。