• HOME
• Webキャッシュ
• viewer
• マイページ
• アップロード

スライド1: copyright(C) memokami 2008 all rights reserved.『PHP PHP PHPで作る携帯PHP 携帯 携帯サイト 携帯 サイト サイト』 サイトmemokami荒木 稔memokami家族のためのケータイサイト「ファミリーモバイル」

スライド2: copyright(C) memokami 2008 all rights reserved.自己紹篷介memokami家族のためのケータイサイト「ファミリーモバイル」

スライド3: copyright(C) memokami 2008 all rights reserved.荒木 稔　(あらき みのるㄦㄮ.ㄫホテルマンンㄯ.ㄫ基幹システムエンンジニア㄰.ㄫWebサービスㄱ.ㄫ携帯サービス→ NEXT??memokami家族のためのケータイサイト「ファミリーモバイル」

スライド4: copyright(C) memokami 2008 all rights reserved.執筆/講演/インンタビュー　・Web担当者 現場のノウハウ　・Web+DB Press　・Web Designingインンタビュー　・ITmedia Biz IDインンタビュー　・ThinkITモバイル特集　・Markezinインンタビュー・企業様向け携帯ビジネス講演　・PHPカンンファレンンス・モバイル勉強会　などmemokami家族のためのケータイサイト「ファミリーモバイル」

スライド5: copyright(C) memokami 2008 all rights reserved.ファミリーモバイル~ㅻ家族のケータイサイト・Yㅖㅞhoㅬoㅬ!ニュース・ライブドアニュース・週間アスキー・@保育・ITmedia・Mㅊㅞrㅯkㅨezinmemokamiなど掲載多数家族のためのケータイサイト「ファミリーモバイル」

スライド6: ↓本来ここにいる予定だったcopyright(C) memokami 2008 all rights reserved.ルミネ the よしもとmemokami家族のためのケータイサイト「ファミリーモバイル」

スライド7: copyright(C) memokami 2008 all rights reserved.M-1グランンプリㄯㄭㄭ8ㄵmemokami家族のためのケータイサイト「ファミリーモバイル」

スライド8: ケータイサイトとPㅍㅀサイトの違いcopyright(C) memokami 2008 all rights reserved.memokami家族のためのケータイサイト「ファミリーモバイル」

スライド9: ケータイで考慮しなければならないこと○ HTML(XHTML)、cssの表現の違い→Pㅍㅀなら基本的に共通的に作れる(ㄱ大ブラウザチェッックㄦ○ 表示最大容量による制限→PCなら大容量でも基本的に問題なし○ キャリア・端末に応じた処理→Pㅍㅀなら差異がさほどない○ 文字コードの扱い→PCなら基本的に問題になりにくい○ 絵簒文字の取り扱い→PCなら外字相当は弾いても痛くない○ セッッションンの取り扱い　　　　→PCならセッッションンを比較的容易に扱えるcopyright(C) memokami 2008 all rights reserved.memokami家族のためのケータイサイト「ファミリーモバイル」

スライド10: 逆に言えば・必要最低限のHTML・小さい容量のサイトしか作らない・もしくは見れない端末は全切捨て・絵簒文字なんて使わせない・セッッションン使うサイトなんてやらないなサイトだったらPCサイトと同じように作って基本的に問題ありません。copyright(C) memokami 2008 all rights reserved.memokami家族のためのケータイサイト「ファミリーモバイル」

スライド11: PHPに密接に関わるところ○ HTML(XHTML)、cssの表現の違い○ 表示最大容量による制限○ キャリア・端末に応じた処理○ 文字コードの扱い○ 絵簒文字の取り扱い○ セッッションンの取り扱い　　　　copyright(C) memokami 2008 all rights reserved.memokami家族のためのケータイサイト「ファミリーモバイル」

スライド12: アジェンンダcopyright(C) memokami 2008 all rights reserved.キャリア判別キャリア判別 文字コード絵簒文字 セッッションンmemokami家族のためのケータイサイト「ファミリーモバイル」

スライド13: フェーズ1 : キャリア判別簡箎単にキャリア判別が出来るPEARパッッケージPEAR::Net_UserAgent_Mobilecopyright(C) memokami 2008 all rights reserved.memokamihttp://pear.php.net/package/Net_UserAgent_Mobile/version 1.0.0 RC1[Beta] released on 2008-05-10家族のためのケータイサイト「ファミリーモバイル」

スライド14: フェーズ1 : キャリア判別copyright(C) memokami 2008 all rights reserved.require_oncerequire_once('Net/require_oncerequire_once('Net/('Net/UserAgent('Net/ UserAgent UserAgent/Mobile./Mobile.php'/Mobile. php' php'); php' );//factory() //factory()ではなくて//factory() ではなくて ではなくて、singletonではなくて singleton singletonを利用singleton 利用 利用する 利用 する$agent agent = = Net_UserAgent_MobileNet_UserAgent_Mobile::singleton();Net_UserAgent_Mobile ::singleton();// // docomodocomoif if ( ( $agent $agent->isDoCoMo$agent isDoCoMo isDoCoMo()()){ㅸ ()// FOMAif if ( ( $agent $agent->isFOMA() $agent >isFOMA() ))}//au//auif if ( ( $agent $agent->isEZweb() $agent >isEZweb() ){){}//SoftBank//SoftBankif if ( ( $agent $agent-> $agent > isSoftBank isSoftBank () () ){){//3GC//3GCif if ( ( $agent $agent-> $agent > isType3GC isType3GC () () ))}//WILLCOM//WILLCOMif if ( ( $agent $agent-> $agent > isWillcom isWillcom () () ){){}memokami家族のためのケータイサイト「ファミリーモバイル」

スライド15: フェーズ1 : キャリア判別PEAR::Net_UserAgent_Mobile・端末タイプも取れる　→　FOMA, WIN, WAP2.0,3GC型 W型 P型 C型など・表示情報も取れる→　幅、高さ、表示色数、カラーか白黒か【留意点】新機種対応が早くないので、新しい機種が出たら自前で付け加える必要があるGPS対応機種、利用できる画像フォーマッット、Flash Lite対応ver等筈他に必要な情報は別途持つ必要がある。copyright(C) memokami 2008 all rights reserved.memokami家族のためのケータイサイト「ファミリーモバイル」

スライド16: copyright(C) memokami 2008 all rights reserved.文字コードキャリア判別 文字コード絵簒文字 セッッションンmemokami家族のためのケータイサイト「ファミリーモバイル」

スライド17: フェーズ2:　文字コード　・携帯ウェブは基本的に　 「ㅐhㅦㅣtㅱ_JIS」　・SoftBank 3GCは　　　　　「UTF-8」copyright(C) memokami 2008 all rights reserved.memokamiしかも内部文字コードはㅂUㅀを使ってたりすることも。文字コードを考えるポインント　「Weㅟ入力」　「Weㅟ出力」　「ㅁㄿとの入出力」家族のためのケータイサイト「ファミリーモバイル」

スライド18: フェーズ2:　文字コード文字コード変換の処理を最初の段階で行うcopyright(C) memokami 2008 all rights reserved.【php.ini】ケータイ、PC両方を考えた設定【Pㅍㅀサイト】文字コードに関する処理【ケータイサイト】文字コードに関する処理各処理へ 各処理へmemokami家族のためのケータイサイト「ファミリーモバイル」

スライド19: フェーズ2:　文字コードphp.iniの設定mbstring.http_input mbstring.http_input = = passpassmbstring.http_output mbstring.http_output = = passpassmbstring.encoding_translation mbstring.encoding_translation = = OffOffcopyright(C) memokami 2008 all rights reserved.memokami家族のためのケータイサイト「ファミリーモバイル」

スライド20: フェーズ2:　文字コード入力文字コード変換フィルターcopyright(C) memokami 2008 all rights reserved.memokamiif if ( ( $agent $agent-> $agent > isType3GC isType3GC () () ) ) {{mb_convert_variables(ini_get('mbstring.internal_encoding'), mb_convert_variables(ini_get('mbstring.internal_encoding'),'UTF UTF UTF-8', UTF ', $_POST);$_POST);mb_convert_variables(ini_get('mbstring.internal_encoding'), mb_convert_variables(ini_get('mbstring.internal_encoding'),'UTF UTF UTF-8', UTF ', $_GET);$_GET);} } else else {{mb_convert_variables(ini_get('mbstring.internal_encoding'), mb_convert_variables(ini_get('mbstring.internal_encoding'),'Shift_JIS Shift_JIS Shift_JIS', Shift_JIS ', $_POST);$_POST);mb_convert_variables(ini_get('mbstring.internal_encoding'), mb_convert_variables(ini_get('mbstring.internal_encoding'),'Shift_JIS Shift_JIS Shift_JIS', Shift_JIS ', $_GET);$_GET);}家族のためのケータイサイト「ファミリーモバイル」

スライド21: フェーズ2:　文字コード絵簒文字が入ってきたときに処理できない【絵簒文字に対応する方法】ㄮ.ㄫ文字コード変換前に　　内部文字に変換する絵簒文字 → 内部絵簒文字&#xE63E → {emoji d12}文字コード変換処理copyright(C) memokami 2008 all rights reserved.ㄯ.ㄫ文字コード変換を　　なんとかやる文字コード変換処理memokami家族のためのケータイサイト「ファミリーモバイル」

スライド22: フェーズ2:　文字コード【解決方法】mbstringエクステンンションンの「SJIS-win」　「eucJP-win」を利用するcopyright(C) memokami 2008 all rights reserved.memokami家族のためのケータイサイト「ファミリーモバイル」

スライド23: フェーズ2:　文字コード【解決方法】mbstringエクステンンションンの「SJIS-win」　「eucJP-win」を利用する入力文字コード変換フィルター(正式版ㄦcopyright(C) memokami 2008 all rights reserved.memokamiif if ( ( $agent $agent-> $agent > isType3GC isType3GC () () ) ) {{mb_convert_variables(ini_get('mbstring.internal_encoding'), mb_convert_variables(ini_get('mbstring.internal_encoding'),'UTF UTF UTF-8', UTF ', $_POST);$_POST);mb_convert_variables(ini_get('mbstring.internal_encoding'), mb_convert_variables(ini_get('mbstring.internal_encoding'),'UTF UTF UTF-8', UTF ', $_GET);$_GET);} } else else {{mb_convert_variables(ini_get('mbstring.internal_encoding'), mb_convert_variables(ini_get('mbstring.internal_encoding'),'SJIS SJIS SJIS-win SJIS win win', win ', $_POST);$_POST);mb_convert_variables(ini_get('mbstring.internal_encoding'), mb_convert_variables(ini_get('mbstring.internal_encoding'),'SJIS SJIS SJIS-win SJIS win win', win ', $_GET);$_GET);}家族のためのケータイサイト「ファミリーモバイル」

スライド24: フェーズ2:　文字コードそれに伴い内部エンンコードや他の設定も見直すmbstring.internal_encoding mbstring.internal_encoding = = eucJP eucJP-win eucJP wincopyright(C) memokami 2008 all rights reserved.memokami家族のためのケータイサイト「ファミリーモバイル」

スライド25: フェーズ2:　文字コードそれに伴い内部エンンコードや他の設定も見直すmbstring.internal_encoding mbstring.internal_encoding = = eucJP eucJP-win eucJP winmbstring.detect_orderも見直すmbstring.detect_order mbstring.detect_order = = autoauto→"auto" "auto" は "ASCII,JIS,UTFASCII,JIS,UTFASCII,JIS,UTF-8,EUCASCII,JIS,UTF 8,EUC 8,EUC-JP,SJIS"8,EUC JP,SJIS"mbstring.detect_order mbstring.detect_order = = SJIS SJIS-win,eucJPSJIS win,eucJP win,eucJP-win,JIS,UTFwin,eucJP win,JIS,UTFwin,JIS,UTF-8,ASCIIwin,JIS,UTF 8,ASCIIcopyright(C) memokami 2008 all rights reserved.memokami家族のためのケータイサイト「ファミリーモバイル」

スライド26: copyright(C) memokami 2008 all rights reserved.絵簒文字キャリア判別 文字コード絵簒文字 セッッションンmemokami家族のためのケータイサイト「ファミリーモバイル」

スライド27: フェーズ3:　絵簒文字【絵簒文字を出力する方法】　・各キャリアによって、出力方法が違う　・キャリアに応じて出力を変える必要があるcopyright(C) memokami 2008 all rights reserved.memokami家族のためのケータイサイト「ファミリーモバイル」

スライド28: フェーズ3:　絵簒文字docomo・Shift_JISコードを使ってバイナリで入力する・Shift_JISコードを文字参照でテキスト入力する・Unicodeを使ってテキスト入力する。au・Shift_JISを使ってバイナリコードで入力する・絵簒文字番号を使ってHDML記述で入力する・絵簒文字番号を使ってXHTML(HTML)記述で入力するSoftbank・Webコードを利用して入力する・Unicodeを使ってテキストで入力をするcopyright(C) memokami 2008 all rights reserved.memokami家族のためのケータイサイト「ファミリーモバイル」

スライド29: フェーズ3:　絵簒文字【留意点】・バイナリコードを利用する方が良い　バイナリでいれるのと、<img localsrc=“1”>　で入れるのは意味が違うため。【au】入力文字copyright(C) memokami 2008 all rights reserved.pack('H4',dechex(63072));各キャリア文字に変換バイナリから作成キャリア絵簒文字マッッピンング表【docomo】【au】【SoftBank】【WILLCOM】【PC】各キャリアの絵簒文字が出せるカスタムタグを作ると便利memokami家族のためのケータイサイト「ファミリーモバイル」

スライド30: copyright(C) memokami 2008 all rights reserved.次はセッッションンですキャリア判別 文字コード絵簒文字 セッッションンmemokami家族のためのケータイサイト「ファミリーモバイル」

スライド31: フェーズ4:　セッッションン【セッッションン管筬理】PㅍㅀのようにセッッションンIㅁを、Cookieで持って対応するか?ㄼau・cookie利用可能・端末ではなくサーバー保存注意※SSL通信時はローカルdocomo・cookieが使えないcopyright(C) memokami 2008 all rights reserved.SoftBank・ㅀ型、Pㅍ型不可能・W型、3GC型可能WILLCOM・cookie利用可能memokami家族のためのケータイサイト「ファミリーモバイル」

スライド32: フェーズ4:　セッッションン【セッッションン管筬理】・一番いいのは、各キャリアごとに対応方法を変えること。・全キャリアに同じ対応するには、URL埋め込みが基本。ini_set('session.use_cookies', ini_set('session.use_cookies', 0); );ini_set('session.use_only_cookies', ini_set('session.use_only_cookies', 0); );ini_set('session.use_trans_sid', ini_set('session.use_trans_sid', 1); );copyright(C) memokami 2008 all rights reserved.memokamiセキュリティの問題はきっちりと考えておくことが重要家族のためのケータイサイト「ファミリーモバイル」

スライド33: そもそも携帯って何だろう?ㄼcopyright(C) memokami 2008 all rights reserved.memokami家族のためのケータイサイト「ファミリーモバイル」

スライド34: 携帯ってなんだろう?ㄼ携帯はPㅍㅀをミニマイズでしかないというとらえ方copyright(C) memokami 2008 all rights reserved.memokami頑張ってPㅍㅀに近づくことだけが果たして正解なのか?ㄼ?ㄼ携帯だから出来ることはきっとあるはず!ㄠ!ㄠ家族のためのケータイサイト「ファミリーモバイル」

スライド35: 『携帯 "魔法の杖" プロジェクト』copyright(C) memokami 2008 all rights reserved.memokami presentsmemokami家族のためのケータイサイト「ファミリーモバイル」

スライド36: RVㅐ(リアルタイムビジョニンングシステムㄦRVS(リアルタイムビジョニンングシステムㄦcopyright(C) memokami 2008 all rights reserved.memokamidemo家族のためのケータイサイト「ファミリーモバイル」

スライド37: RVSが生まれたわけ『RVㅐ(リアルタイムビジョニンングシステム)』・ 携帯を飛び出るという発想・ 携帯はミニPㅍㅀでしかないという呪縛からの脱却copyright(C) memokami 2008 all rights reserved.memokami・ 携帯という「個」から、リアル空間のソソーシャルの「場」 へ・ 「特許申請中」家族のためのケータイサイト「ファミリーモバイル」

スライド38: RVSがやろうとしていること　・ 渋谷ビジョンンジャッック　・ イベンント/コンンサート/ファッッションンショー　・ 店舗再来店　・ 家電連携copyright(C) memokami 2008 all rights reserved.memokami家族のためのケータイサイト「ファミリーモバイル」

スライド39: 使っている技術・　PㅍHPㅍでサーバーをゴリゴリ作るという荒技・　スレッッド　→　プロセス・　fork → 親子の処理区別・　各々のプロセスを制御　・　メモリに注意　・　24時間安定稼働させる　・　確かに限界はあるが作り込み続簚けることで対応copyright(C) memokami 2008 all rights reserved.memokami家族のためのケータイサイト「ファミリーモバイル」

スライド40: 携帯を取り巻く技術テスト位置情報キャリア/端末判別ユーザーエージェンントcopyright(C) memokami 2008 all rights reserved.デコメール簡箎単ログインン携帯メール空メールmemokamiQRコード最適な画面絵簒文字家族のためのケータイサイト「ファミリーモバイル」

スライド41: PㅍHPㅍ x 携帯サイト デベロッッパーズバイブルcopyright(C) memokami 2008 all rights reserved.Chapter.1 携帯サイトを作るための基礎知識1-1 携帯サイトとPCサイト1-2 携帯サイトを作る前に1-3 開発ポリシーを決める1-4 開発環境を整える1-5 本書のゴールChapter.2 簡箎易的なページの作成と確認方法2-1 本章のゴール2-2 簡箎単な携帯対応ページを作る2-3 携帯端末でサイトを確認する2-4 携帯端末以外での確認方法Chapter.3 キャリア/機種を判別する3-1 本章のゴール3-2 なぜキャリア/機種判別が必要か3-3 キャリア/機種を判別する方法3-4 ユーザーエージェンントを理解する3-5 Net_UserAgent_Mobileを利用して判別する3-6 ユーザーエージェンント以外から取得できる情報3-7 携帯端末の詳細篳情報をデータとして持つ3-8 IPアドレスからキャリアを判別する3-9 携帯以外からのアクセスを制限するChapter.4 端末に最適な画面で表示する4-1 本書のゴール4-2 HTMLとXHTMLでの表現方法4-3 携帯端末に最適な画像を出力するChapter.5 絵簒文字を取り扱う5-1 本章のゴール5-2 絵簒文字とは5-3 サイトに絵簒文字を出力する5-4 各キャリアに対応した絵簒文字を出力する方法5-5 絵簒文字の入力を取得する方法5-6 絵簒文字が使える掲示板を作成するmemokamiChapter.6 携帯メールを実装する6-1 本章のゴール6-2 携帯メールを理解する6-3 携帯へメールを送信する6-4 絵簒文字入りメールを送信する6-5 携帯から絵簒文字入りメールを送信する6-6 デコメールを送信する6-7 空メールを実装するChapter.7 ログインン状態の管筬理7-1 本章のゴール7-2 携帯を使ったログインン7-3 個体識別情報を理解する7-4 ログインン状態を維簣持する方法7-5 かんたんログインンを実装するChapter.8 位置情報を取得する8-1 本章のゴール8-2 位置情報を理解する8-3 docomoの位置情報取得8-4 auの位置情報取得8-5 SoftBankの位置情報取得8-6 現在位置をGoogleMapで表示するChapter.9 動的にQRコードを作成する9-1 本章のゴール9-2 QRコードとは9-3 QRコードを作成する9-4 携帯電話に特化したデータを作成する付録家族のためのケータイサイト「ファミリーモバイル」

スライド42: PㅍHPㅍで携帯をもっと面白くcopyright(C) memokami 2008 all rights reserved.memokami家族のためのケータイサイト「ファミリーモバイル」

スライド43: ご静聴ありがとうございました・PHPユーザー会の皆様・カンンファレンンス運営の皆様・発表をお聞きくださった皆様感謝しております。ご静聴ありがとうございました。copyright(C) memokami 2008 all rights reserved.memokami荒木 稔memokamimemokami@gmail.com家族のためのケータイサイト「ファミリーモバイル」