Posted on

CakePHPで携帯サイト作成時に注意したところ

今回、携帯サイトを作るにあたって各携帯会社によって挙動が違うくて詰まった箇所や携帯サイト独自の作り方をしたところをメモで残そうと思います。

まず携帯会社によって入力フォームの入力文字をデフォルトで切り替える方法です。
app/app_controller.phpのbeforeFilter()で
各携帯メーカーによってモードを変えます

//  DoCoMo 用
if (ereg( "DoCoMo", $_SERVER["HTTP_USER_AGENT"] )) {
$mode = "istyle";
$mode_1 = 1;
$mode_2 = 2;
$mode_3 = 3;
$mode_4 = 4;
//  ezweb 用
} elseif (ereg( "UP\.Browser", $_SERVER["HTTP_USER_AGENT"] )) {
$mode = "format";
$mode_1 = "*M";
$mode_2 = "*M";
$mode_3 = "*m";
$mode_4 = "*N";
//  J-Phone 用
} elseif (ereg( "J-PHONE", $_SERVER["HTTP_USER_AGENT"] )
|| ereg( "SoftBank", $_SERVER["HTTP_USER_AGENT"] )
|| ereg( "Vodafone", $_SERVER["HTTP_USER_AGENT"] )) {
$mode = "mode";
$mode_1 = "hiragana";
$mode_2 = "katakana";
$mode_3 = "alphabet";
$mode_4 = "numeric";
//  L-mode 用
} elseif (ereg( "L-mode", $_SERVER["HTTP_USER_AGENT"] )) {
$mode = "istyle";
$mode_1 = 1;
$mode_2 = 2;
$mode_3 = 3;
$mode_4 = 4;
//  その他用
} else {
$mode = "istyle";
$mode_1 = 1;
$mode_2 = 2;
$mode_3 = 3;
$mode_4 = 4;
}

上の記述で出来たモードを$this->setでビューに渡して、ビュー側でフォームの属性に上のモードを持たすとデフォルトの入力文字が各携帯会社で「漢」「ア」「1」という形で出るようになります。
ビュー側の例:<?php echo $form->text(‘Delivery.name1’, array(“size”=>8, $mode=>$mode_1)) ?>

次に携帯会社によってgifが使えたりpngが使えたりと違うので携帯会社によってgifを使うかpngを使うか切り替えます。
app/app_controller.phpのbeforeFilter()で

//携帯機種によって画像拡張子を切り替える
$ua = $_SERVER["HTTP_USER_AGENT"];
if(ereg("J-PHONE|Vodafone|UP\.Browser",$ua)){
$this->set("extension", "png");;
}else{
$this->set("extension", "gif");;
}

と振り分けてビューに拡張子を渡してファイル名と拡張子を合体させて出力します。
(注)pngの場合テーブルサイズが指定されていなかったらauの場合に自動で画像を横長にしてしまったのでテーブル幅は指定しておきます。

最後に各携帯会社のブラウザの独自仕様で詰まったところを記述していきます。
・auではラジオボタンの二つの候補の間に他のフォームが入ると二つのラジオの関係性が無くなってしまうので他のフォームを挟まないようにしました。
・docomoで検索をした値をセッションに持たしておいて他のページにいった後に戻って検索をもう一度すると半角スペースを最後に付加する現象が起こって検索が引っ掛からなくなったので検索前に検索文字列をtrim関数で両端の半角スペースを除去しておきました。
・auではブラウザを閉じてもセッションを開放しないので最後のページもしくは最初のページでセッションをdestroyしておきました。