Hatena::ブログ(Diary)

遙かへのスピードランナー RSSフィード

Firefoxを簡単に携帯シミュレータにするアドオン「FireMobileSimulator」公開中です!
PHP×携帯サイト デベロッパーズバイブル
モバイル開発者必携!
Firefox利用者必携!
Firefox 3 Hacks Mozillaテクノロジ徹底活用テクニック

2008-08-16

Firefoxでモバイル端末をシミュレートする独自アドオン「FireMobileSimulator」を公開します

重要★2008/11/15追加:公式サイトFireMobileSimulator.org開設にともない、この記事の更新ストップします。今後のアップデート情報は公式サイトで行いますのでよろしくお願いします。


モバイルサイトをPCで閲覧するために、従来からある方法として、キャリアの提供するシミュレータの使用、Proxyの使用、Firefoxのuseragentswitcher+modify headersの組み合わせ等、色々と手段はありましたが、これらの方法は、それぞれに不足している機能があったり、またITに詳しくない人とかだと導入段階でつまづいてしまったりします。
そこで、もっと簡単にモバイルサイトをPCで見るために便利なツールを作成しました。

Firefoxを簡単に携帯シミュレータにできるアドオンです。モバイル端末のHTTPリクエストや絵文字表示をシミュレートすることができます。3ヶ月くらい前からこっそり開発していたのですが、ようやく機能も揃ってきて安定してきているので、そろそろ公開しようかと。

概要

FireMobileSimulatorは、DoCoMo/Au/SoftBank3キャリアのHTTPリクエスト・絵文字表示などをシミュレートして、モバイルサイト開発を容易にするために作成されたFirefoxのアドオンです。

ダウンロード

Mozillaのサンドボックスとして登録しています。
Mozillaサイトからダウンロード
Mozillaのユーザー登録をすでにされている方、あるいはユーザー登録の手間をかけていただける方はこちらからダウンロードしてください。

Mozillaのアカウント取得の予定がない方は以下からダウンロード可能です。

主な機能

使い方

  • メニューバーの[ツール]->[FireMobileSimulator]、あるいは、ツールバー上に配置したボタンからシミュレートしたい端末を選択してください。
  • シミュレートを解除したいときは、[ツール]->[FireMobileSimulator]から[default]を選択してください。また、ブラウザ終了時に端末の選択は自動的にクリアされます。
  • UIDなどの設定値を変更したい場合は、Optionsメニュー->全般から編集してください。
  • 端末を追加したり端末情報を変更したい場合は、Optionsメニュー->デバイス設定から編集してください。
  • 位置情報の設定値を変更したい場合は、Optionsメニュー->位置情報設定から編集してください。

スクリーンショット

こんな感じでサイトを閲覧できます。

f:id:thorikawa:20081001124512j:image

アップデートについて

Firefoxの自動アップデートには対応していません。
バージョンアップ時は適宜本ブログにて報告しますので、継続して使いたいという方は適当にチェックしてみて下さい。

今後の拡張予定

  • 携帯端末の追加・編集機能Ver0.0.3にて実装済
  • キャリアの未実装のHTTP送信ヘッダに対応
  • 未対応の絵文字記載方法に対応Ver0.1.0にて実装済
  • 着メロ・着うたなど各種コンテンツに対応
  • HDML表示
  • WML表示(Ver0.1.0にて一部実装済)
  • 各端末のCookie対応/非対応をシミュレート(Ver0.1.0にて一部実装済)

既知の問題と対処

Firefox3で端末の設定をしたまま当アドオンをアンインストールすると、端末の設定が元に戻らない(戻せない)という不具合が起きています。対処法はこちらを参照してください。Ver0.1.0以降、ブラウザ終了時に端末の選択をクリアするようになりましたので同様の問題は発生しないはずです。

フィードバックについて

フィードバックは当ブログやメールでも受け付けていますが、Mozillaアカウントをお持ちの方は、上記記載のMozillaダウンロードページからいただけると嬉しいです。
改善要望やバグ報告については歓迎しますが、今のところ個人で開発していますので、対応しきれない可能性があることを予めことわっておきます。(CodeReposにでもアップしようかな・・・)

ソースコードについて

CodeReposにてソースを公開しています。

コミット大歓迎!

ライセンスについて

ライセンスMPLライセンスにて提供しています。

バージョン0.1.4以降GPLライセンスにて提供しています。

使用ライブラリなど

本アドオンを作るにあたり、MobilePictogramConverterをjavascript版としてカスタマイズして使用しています。(id:rysterさんに感謝!)

これはjavascript版の携帯絵文字ライブラリとして、また後日公開する予定です。

参考サイト

携帯の文字コードと絵文字の基礎知識
は絵文字表示機能を実装するときに大いに参考にさせていただきました。多謝!

みのるみのる 2008/09/06 12:48 スクリーンショットのはてなページをみると、[1]と[3]の表示がおかしくなっています。私の携帯サイトでも同じでした。SB端末を持ってないので実際の表示でもこのようになっているのか、それともFireMobileSimulatorだけでこうなっているのか、どちらなのでしょう。

thorikawathorikawa 2008/09/06 17:36 うわ、本当ですね!
自分でスクリーンショット貼り付けて何で気づかなかったんだろう。。。
絵文字変換ロジックのバグでしたので、修正した0.0.5をリリースしました。
ご報告ありがとうございました!

みのるみのる 2008/09/06 22:42 0.0.5ありがとうございます。ちゃんと表示されました。
とっても重宝しています。これからも期待してます!

なまえなまえ 2008/09/08 10:55 FireFox3.0.1 WinXP SP3なんですが、
「ファイルのハッシュが正しくありません -261」
というエラーでインストールできません。
自分だけでしょうか?

まついまつい 2008/09/08 12:39 公式サイトより抜粋
「SSL通信時は、iモードIDは付与できません。 」これって対応される予定ありますか?

thorikawathorikawa 2008/09/08 14:22 >なまえさん
ご報告ありがとうございます。
ちょと調べたところ、Firefoxの設定によっては、Mozillaのサイトからダウンロードがうまくできないようです。
Firefoxのメニューバーから「ツール->オプション->プライバシー->サードパーティーのCookieも保存する」の項目にチェックが入っていないと思われますので、こちらにチェックを入れて、再度試してみていただけますか?

>まついさん
はい、他の人からも要望があり対応予定です。1〜2週間以内に対応したバージョンをリリースできると思いますので、お待ちください。

まついまつい 2008/09/08 14:36 >thorikawaさん
わぁ。すごい楽しみです。これからも頑張ってください。

thorikawathorikawa 2008/09/10 09:43 >シメサバさん
すいません、昨日いただいたコメントの内容に他サイトのセキュリティに関する問題を含んでいたため、あまり公の場でやりとりをするのはよくないかなと判断してコメントを削除させていただきました。もしよろしければ直接メールをいただけますか?horikawa.takahiro@gmail.comになります。

とおりすがりとおりすがり 2008/09/18 16:23 自動アップデートに対応してほしいのですが、何か理由があるのでしょうか?

kpkp 2008/09/23 14:15 インストールをしたのですが、
ツール>FireMobileSimulator>
から表示されるメニューに端末が現れません。
オプションメニューからは登録されているのが見えます。
Mozillaサイトやこのサイトからダウンロードしてみているのですが、
どのバージョンでもうまくいきません。
インストールする際は、削除してから再度行っています。
当方環境は、WinXP + FF3.0.1です。
試した、バージョンは、0.0.2〜0.1.4です。
ここ数ヶ月バージョンアップされるごとに試しているのですが。。。

thorikawathorikawa 2008/09/24 10:18 >とおりすがりさん
9/22のエントリーにも記載しましたが、本来Mozillaの add-onsサイトで公開していると、自動でupdateに対応するはずなんですが、どうもうまく機能していないようで、いろいろと試行錯誤しています。お手数かけてすいませんが、もうしばし、猶予を下さい。。。

thorikawathorikawa 2008/09/24 10:21 >kpさん
すいません、お手数かけます。当方も同じ環境ですが、再現しないのでもう少し情報を下さい。
ツール>エラーコンソールを開いて、ツール>FireMobileSimulatorから端末を表示しようとしたときに、何かエラーか警告が表示されませんでしょうか?もし表示されている場合はその内容を貼り付けて頂けると助かります。

なまえなまえ 2008/09/24 19:35 ライブドアのモバイルブログを閲覧できません。
無理なのでしょうか?

kpkp 2008/09/24 21:32 早速のお返事ありがとうございます。
特に何も表示されません。
よろしければ、現象を画面をキャプチャしてお伝えしたいのですが、
キャプチャした画像を共有する方法はありませんか。
※メール等で送付できますか。

ツール>FireMobileSimulator>
から開くメニューは下記のような感じです。
┏━━━━━┓
┃ default ┃
┃----------┃
┃----------┃
┃Options ┃
┃About ┃
┗━━━━━┛
お手数をお掛けしますが、何か分かればご回答ください。

thorikawathorikawa 2008/09/25 11:11 >kpさん
URL欄にabout:configと打って、
javascript.options.showInConsole
の値をtrueにしてみてください。
その後、同様に端末一覧を表示しようとすると、エラーコンソールに何か表示されませんでしょうか?

またそれでも何も表示されないようでしたら、導入されているほかのFirefoxアドオンと競合している可能性もあります。導入アドオン一覧を教えて頂くことは可能でしょうか?

コメント欄だと拙いようでしたら、以下のメールアドレスに直接連絡を下さい。
horikawa.takahiro@gmail.com
です。

よろしくお願いします。

thorikawathorikawa 2008/09/25 11:11 あとキャプチャした画像も上記のアドレスに送付OKです。
よろしくお願いします。

kpkp 2008/09/25 12:21 上記設定でエラーコンソールに出力されました。
内容は、
エラー: pref.copyUnicharPref is not a function
ソースファイル: chrome://msim/content/overlay.js
行: 98
です。
導入しているadd-onは、
Context Search 0.4.3
Cooliris 1.8.2.4690
Domain Datails 2.2.1
DOM Inspector 2.0.0
Dummy Lipsum 2.3.0
Firebug 1.2.1
Fire Dictionary 0.9.12
Firefly 0.4.1
FireMobileSimulator 0.1.4
FoxyProxy 2.8.5
Google Toolbar for Firefox 3.1.20080730W
goo辞書 1.0.1
HttpFox 0.8.2
IE NetRenderer 0.8
IE View 1.3.7
IE View Lite 1.3.3
KGen 0.4
Link Widgets 1.6
Live HTTP headers 0.14
Make Link 8.07
MeasureIt 0.3.8
Modify Headers 0.6.4
New Tab Button Tab Right 0.5.4
Nigthly Tester Tools 2.0.2
qtl 1.2.3
RankQuest SEO Toolbar 3.9.2
Redirect Remover 2.5.5
RestTest 1.0
ScarpBook 1.3.3.7
SeleniumIDE 1.0b2
Server Switcher 0.5
Tab Mix Plus 0.3.6.1.080416
Table2Clipboard 0.1.1
Total Validator 5.3.3
UserAgen Switcher 0.6.11 (競合すると思い無効化しています)
ViewSourceWith 0.3
Web Developer 1.1.6
XUL/Migemo 0.11.2
以上です。
どうぞ、よろしくお願いいたします。

thorikawathorikawa 2008/09/25 14:04 >kpさん
大体原因推測がつきました。おそらく他アドオンと変数名が競合していると思われます。
原因と思われる箇所を修正した暫定版を作ってみたので、こちらで試してみてもらえますか?
https://ss1.xrea.com/poly.s49.xrea.com/dev.ohirune.net/firefox/firemobilesimulator_0.1.4.1b.xpi
これで問題なければ、こちらの修正を次のリリース時に取り込みます。

thorikawathorikawa 2008/09/25 15:45 >なまえさん
ライブドアのモバイルブログですが、IPアドレス制限がされているようで、閲覧することはできません。
申し訳ないですが、今のところPCで閲覧している限りではどうしようもないです。。。

blichoblicho 2008/09/25 18:19 ページ内に<img src=”http://hoge.jp/?uid=NULLGWDOCOMO”>とあるとそちらのページが表示されるようですね。

kpkp 2008/09/25 18:22 すみません。
シミュレーターを有効にしていたら、コメントが文字化けしちゃいました。
消してください。
お詫びすると共に、再送させていただきます。
ありがとうございます!!
無事端末リストが表示され、正常に動作しました。
OpenwaveSDKがUnicode絵文字に対応してないなどで困っていたので、
大変助かります!

わがままついでに、こんな機能があったらいかがでしょう?を
提案させてください。
※自分で作ってFeedBackしろとか、他のadd-onとうまく組み合わせろは
ご容赦ください。いつかお手伝いできたらいいなとは思ってます。(^_^.)
・端末登録時に画面の有効サイズを入力できる
・オプションでウィンドウ幅を強制的に上記サイズに変更(横幅のみ、縦横強制)
・HTTPヘッダ、HTML全体、画像全体、その他全体、合計の各サイズ(byte単位)
・強制的に文字を等幅フォントに変更
いかがでしょうか。ご検討ください。

重ね重ね、早急なご対応ありがとうございました。

BuyBuy 2008/09/26 10:45 FireMobileSimulatorを使用させて頂いています。
0.0.4を使用していましたが、リリースノートを拝見する限り、0.1.0で修正されたのでしょうか…?、Firefoxを終了しても設定が残っている仕様(?)を重宝していました。
今となっては不具合であった様ですが、別途、デバイスの追加/編集で、任意のデバイス(新規追加分を含む)をDefaultとして指定できる様にできませんでしょうか。
ご検討下さい。
(ちなみに、Fifefox2を使用しています。)

thorikawathorikawa 2008/09/26 10:52 >blichoさん
ご報告ありがとうございます。
たしかになりますね・・・そうかこういうケースもあるのか、考慮不足でした。
ちょっと修正に時間がかかるかも知れませんがなんとか対策してみます。

>kpさん
ご報告ありがとうございます。
無事動いてよかったです。こちらもいろいろと参考になりました。
ご提案いただいた内容ですが、1・2・4点目については、同じような要望を他の方からも頂いていますので優先度高で検討していきます。
3点目は、、、他のadd-onとの組み合わせではダメですかね〜(約束違反でごめんなさい)
他のadd-onと組み合わせられるというのが、シミュレータをadd-onとして実装することのメリットでもあるので、この辺りの機能は取り込まないでおきたいという感じが今はしています。
例えば自分はHTTPヘッダはLive http headersで見ていたりするんですが、やっぱり使い手としては全部1個のアドオンにまとまっていた方が便利なんですかね。。。

#あ、あとabout:configのjavascript.options.showInConsoleの値はfalseに戻されていますよね?あまり影響はないと思いますが、trueのままだと若干動作が重くなるようなので念のため。

thorikawathorikawa 2008/09/26 10:55 >Buyさん
ああああそうだったんですか。。
ご指摘の通り、設定が残していると他の箇所で不具合の原因になりやすいようだったので、0.1.0以降は設定が残らないようになっています。
設定で残る/残らないを切り替えられるようにするのはそれほど難しいことではないので、次バージョンで検討してみます。

kpkp 2008/09/26 11:42 ありがとうございます。
おっしゃるとおりです。。。。私もHttpFoxやアドオンではありませんがburpproxyなどと連携して見てます。
about:config直しました。FF歴が浅く無知で申し訳ありません。

すっかり気に入ってしまい、使い倒し中で気づいたのですが、
titleタグ内の絵文字ってこういうツールの場合、どう処理するのがユーザーさんにとって売れしいのでしょうかね。
※外字に絵文字を登録している人なら無変換でも良い気がします。

thorikawathorikawa 2008/09/26 14:58 >kpさん
>>titleタグ内の絵文字
なるほど、そういうケースもありましたか。。。(太陽)みたいなテキストに変換してしまうのもいいかも知れませんね。ただその対応でも、実装がちょっと難しいので取り込むまで時間がかかると思います。
ちなみに、一応現状のFireMosileSimulatorでも、Optionsから特定キャリアの絵文字変換をOffにすることは可能です。
おっしゃるとおり、既に外字が入ってる人はOffでもいいんでしょうね。。

MugeSoMugeSo 2008/09/30 14:06 便利なものをありがとうございます。

0.1.4で、
ファイルの最後にあるコメント<!-- hoge -->が複?示されてしまう問題があります。

thorikawathorikawa 2008/09/30 16:27 すいません、再現ができませんので、もう少し状況を教えてください。たとえば以下のようなHTMLがあるときに、<!-- hoge -->が表示されてしまうということでしょうか?
あと文字コードと、問題が発生するキャリアを教えて頂けると助かります。
---
<html>
<head>
<title>comment test</title>
</head>
<body>
<div>comment test</div>
<!-- hoge -->
</body>
</html>
---

ちゃあちゃあ 2008/10/02 10:50 便利なものをありがとうございます。活用させていただきます!

MugeSoMugeSo 2008/10/03 12:54 ---
<html>
<head>
<title>comment test</title>
</head>
<body>
<div>comment test</div>
</body>
</html>
<!-- hoge -->
---
です。文字コードはUTF-8です。

thorikawathorikawa 2008/10/07 13:11 >ちゃあさん
コメントありがとうございます!これからもよろしくです。

>MugeSoさん
すいません、やはり再現しません。こちらでは正常に表示されます。
HTMLの内容によってそういう現象がおこりえるかもしれませんので、もしこちらをごらんいただけたら、HTMLソースを私宛に送っていただけないでしょうか?(もしくは該当するURLを教えていただくのでも大丈夫です。)
よろしくお願いします。

トモトモ 2008/10/11 03:55 はじめまして堀川様
トモと申します
超初心者ですがよろしくお願いいたします

FireMobileSimulator昨日ダウンロードして使わせて頂きました
オプションのID情報はそのままで操作しましたが
PCから勝手サイトを満喫できました^^
ありがとうございます

オプションのID情報欄にあります
UID、端末製造番号、FOMAカード製造番号、iモードIDとは
何なのかわからないんですけど
公式サイトにログインするのに必要なのでしょうか?
(このID情報とかはdocomoに問い合わせて本人確認したら教えて貰えるのかな?)

iモード公式サイトのページ表示させるとトップページは見れるんですけど
会員情報とかは見れませんでした
どのようにすればiモード公式サイトにログイン操作でますか?

それから、このページの「余談ですが」に記載されています
>有料メニュー登録をシミュレートできるバージョン
これ物凄く興味あります!
個人的に連絡下さいと記載されていますので
もしよろしければお時間のあるときにでもメールくださればとても嬉しいです
tomo111hana0001アットマークmail.goo.エヌエー.ジェイピー

thorikawathorikawa 2008/10/13 16:29 >トモさん
ツールを活用していただいてありがとうございます!
質問に回答する前にまず理解していただきたいのが、FireMobileSimulatorは「携帯サイトで遊ぶことを目的としたツールではない」ということです。あくまで携帯サイトを個人あるいは法人として開発されている方に対して、そのサイトの動作確認やテストをしてもらうことを目的としています。

iモード公式サイトのようなログインを必要とする携帯サイトでは、通常、IPアドレス制限で本物の携帯端末以外からアクセスできないようになっているはずですので、FireMobileSimulatorを利用したとしてもログインできません。仮にサイト側でそのような制限がかかっていなかったとしても、自分と全く関わりのない携帯サイトに対して、ID情報などを詐称してログインするなどの行為は問題があります。(ID情報とはトモさんのおっしゃる通りログイン認証するのに必要な情報です。)

ですので、トモさんの試そうとしているログイン操作や、IDの問い合わせ等は控えていただいた方がよいです。

有料メニュー登録可能バージョンについても、上記と同じ理由により、有料メニュー登録可能なサイトを開発している個人または法人以外の方への開示はしていません。

要望にお応えできず申し訳ないですが、よろしくお願いします。

なまえなまえ 2008/10/13 18:59 お世話になりますトモです^^
了解です
お忙しい中、詳しいレスありがとうございました
よくわかんないんですけど
自分が正式に会員になっているサイトへ
自分の携帯情報でログインしたかったんです
携帯からでは操作しにくいのでパソコンから操作できればいいなあって思って
探していたところへ堀川さんの開発されたツールを見たんです
もう少し聞いてみたいことがあったので
ちょっと残念ですが失礼します
お時間とらせてしまい申し訳なかったですm( _ _ )m
開発頑張ってください応援してます!
ありがとうございました

KuroKuro 2008/10/13 19:44 はじめまして。FireMobileSimulator使わせていただいてます。キャリアが提供しているエミュレータより全然使いやすくてすばらしいです。と,褒めちぎっておいてナンですが,2点ほど要望しておきますので考えてみてもらえると嬉しいです。

・タグ,あるいはウィンドウごとに違う設定に出来ないでしょうか?
・ユーザーが作成したデバイス設定を掲示板とかで共有できる仕組みを造りませんか?

thorikawathorikawa 2008/10/13 22:27 >トモさん
なるほど、お気持ちはわかります^^
ただ、たとえ自分自身の携帯のID情報であっても、自分が開発に関わっていないようなサイトに、ID情報を設定してPCでログインするのは望ましくありませんし、普通のサイトであればそのようなことはできないようにしています。(PCだと他の人の携帯の情報も簡単に偽装できてしまいますから)

お力になれずにすいません。ただそういった要望もあるということを教えていただいただけでもうれしいです。ありがとうございます!

>Kuroさん
コメントありがとうございます。前者の要望については、複数の方から既にいただいているのですが技術的な障壁が高く、なかなか実現できていない状況です。ただ最近糸口がつかめてきましたので近いうちに実装できるかも...知れません(汗)

後者の要望は確かにあると便利ですね!機能も増えてきたので現在ドキュメントを整備しようとしています。その一環としてそういうコミュニティ作りみたいなものも検討してみますね。
ありがとうございます!

あきたあきた 2008/10/26 18:42 うちに、いた,
ボーリーに似てる、年令もあってるし、ひょっとして本人か?

thorikawathorikawa 2008/10/26 21:27 >あきたさん
お久しぶりです、本人です。メールしときました!

むしむし 2008/11/09 15:12 いつも使わせていただいています。
むしと申します。
ちょっと問題がござまして、下記ご確認いただけますでしょうか?

docomoをシュミレートして、下記のようなソースでフォームをサブミットすると、
formのポスト送信内容がクリアされてしまう様です。
?uid=NULLGWDOCOMOが無い状況では正常に送信できます。

<form action="hoge.php?uid=NULLGWDOCOMO" method="post">
<iput type="submit" value="送信">
<input type="hidden" name="id" value="aaaa">
</form>

とはいえ、無償で使わせていただいているので、恐縮ですが、何卒よろしくお願います!

thorikawathorikawa 2008/11/11 00:21 >むしさん
ご報告ありがとうございます。
内容につき確認しました。
uid=NULLGWDOCOMOの変換の処理については結構無理矢理に実装しているところがあり、その副作用のようです。今後のバージョンで修正は検討しますが、私の考えではこのような場合は、uid=NULLGWDOCOMOもPOST送信内容に含めてしまうのもありなのかな、とも思います。(そして、そうすればFireMobileSimulatorでも不具合はおきないはずです。ただ、どうしてもURLに?uid=NULLGWDOCOMOを含めなければいけない理由があるのであればしょうがないですが。)

ご確認いただけますでしょうか?
よろしくお願いします。

rhsyrhsy 2008/11/11 21:01 Macでも動きました!

キャリアからはMac版のシミュレーターは出ていなかったので、かなり助かります。

むしむし 2008/12/03 18:34 ご検討ありがとうございます。

torikawaさんのおっしゃる

>uid=NULLGWDOCOMOもPOST送信内容に含めてしまうのもあり

にて対応いたしました。
ご確認ありがとうございました。

今後も使わせていただきます。

gg 2009/02/11 16:46 すばらしい!
凄く助かります

kns_1234kns_1234 2009/08/05 14:40 携帯サイトの開発に、いつも重宝させて頂いております。
こちらのアドオンは、「特定のタブのみに有効にする」機能はございませんでしょうか?
タブを右クリックして、「このタブのみ>DC P903i」など選択できれば、PCサイトの閲覧と携帯サイト開発が平行できて便利だと思います。
ご検討頂けると幸いです。

D-B-SEOD-B-SEO 2010/08/05 00:06 初めまして。
非常に理想的なシミュレーターに出会えて感動しています。
早速、ブログで紹介記事をアップロードさせて頂きました。
http://www.divinely.biz/topics/firefox-mobile-simulator.html
今後とも、よろしくお願いします。

スパム対策のためのダミーです。もし見えても何も入力しないでください
ゲスト


画像認証

トラックバック - http://d.hatena.ne.jp/thorikawa/20080816/1218908754