takeuchi

ブラウザの設定言語とCookieを確認して、言語切り替えをやってみた

 
日本語と英語のサイトを制作する際に、言語の切り替えをしたいという要望があると思いますが、サイト訪問時に切り替わっていたら便利かなと考え、以下を実装しました。
 

  1. PHPとjquery cookieで実装
  2. ブラウザの設定言語を確認して、日本語の設定が入っていなければ訪問時から英語の表記にする
  3. 言語切替のボタンは別途設けており、切り替えを行った方にはCookieを生成
  4. ブラウザの設定言語よりCookieの情報を優先して表示する


 

1. ブラウザの設定言語を確認する

$_SERVER['HTTP_ACCEPT_LANGUAGE']で、環境変数を調べて
日本語(ja)が入っているかどうかを調べます。

<?php

    class Language{

        private $lang;
        public function languageSet() {

            if (!empty($_SERVER['HTTP_ACCEPT_LANGUAGE'])):
                // ブラウザにより取得できる値が復数になる場合があるので、配列にします
                $arrs = explode(',', $_SERVER['HTTP_ACCEPT_LANGUAGE']);

                // array_reverseで、第一候補の言語からループでチェックできるようにします
                $arrs = array_reverse($arrs);

                // 今回は2言語しかないので、上のarray_reverseは特に必要ないですね
                foreach ($arrs as $arr) {
                    if (preg_match('/^ja/i', $arr)) {
                        $lang = 'ja';
                    } else{
                        $lang = 'en';
                    }
                }

            else: // 万が一設定言語の値が取れなかった場合は、デフォルトで日本語を表示するようにする

                $lang = 'ja';

            endif;

            return $lang;
        }
    }

?>

 

2. 意図的に言語切替のボタンを押下された場合には、Cookieを生成

こちらはjquery cookieを使って生成しました。
詳しくはTipsNote過去記事『jQueryプラグイン「jquery.cookie.js」でcookieを簡単に扱う』をご覧ください。

$.cookie('language', 'en', {expires:30, path: '/'});
$.cookie('language', 'ja', {expires:30, path: '/'});

languageというCookieの値が、jaなのか、enなのかで後程判定します。
(保持する期間は30日間になってます)
 

3. 1.2.を踏まえて、いざ表示

条件としては以下の通り

・ブラウザの設定言語に日本語が含まれており、$_COOKIE['language']の値が『en』ではない
・ブラウザの設定言語に日本語が含まれておらず、$_COOKIE['language']の値が『ja』である
→ 日本語表記

それ以外は
→ 英語表記

<?php
    if(
        ($lang -> languageSet() == 'ja' && $_COOKIE['language'] != 'en')
        ||
        ($lang -> languageSet() == 'en' && $_COOKIE['language'] == 'ja')
    ):
?>
    日本語表記
<?php
    else:
?>
    英語語表記
<?php
    endif;
?>

※ 普段このような改行は行わないのですが、見づらいので…
 
以上で、少し親切な言語切替が実現出来たかなと思います。
 
※ 尚、現在『jQuery.cookie』は、開発もメンテナンスも終了。
今は同じ作者さんが、jQuery不要なライブラリ『JS Cookie』というのを開発しています。
https://github.com/js-cookie/js-cookie
 

新しいウェブ体験を作ろう TAMのPWA開発
お問い合わせはこちら