説明

デバッグシステム及びデバッグ方法

【課題】携帯端末の画面表示に係るデバッグを効率よく行うことができるデバッグシステム及びデバッグ方法を提供する。
【解決手段】デバッグシステム1は、転送サーバ4とのコネクションを維持した状態で、検出されたイベントを転送サーバ4に送信するとともに転送サーバ4からイベントを受信する第1通信制御部244と、受信したイベントを第1表示部22に表示されているデバッグ対象のWebページのイベントとして第1ブラウザに通知する第1通知部245とを有するスマートフォン2と、転送サーバ4とのコネクションを維持した状態で、検出されたイベントを転送サーバ4に送信するとともに転送サーバ4からイベントを受信する第2通信制御部343と、受信したイベントを第2表示部32に表示されているデバッグ対象のWebページのイベントとして、第2ブラウザに通知する第2通知部344とを有するデバッグ用端末3と、を備える。

【発明の詳細な説明】
【技術分野】
【0001】
本発明は、携帯端末のデバッグシステム及びデバッグ方法に関する。
【背景技術】
【0002】
近年、携帯端末の性能が急速に向上していることに伴い、携帯端末で動作するプログラムの開発が盛んに行われている。携帯端末で動作するプログラムをデバッグするには、PC等に仮想の携帯端末の環境を構築して、当該環境でプログラムをデバッグする方法があるが、より正確にデバッグを行うには、携帯端末上でプログラムを動作させてデバッグを行うことが好ましい。
【0003】
しかしながら、携帯端末が備えている表示部は、PC等の可搬性を有さない端末に比べて小さいため、ログ等のデバッグ情報を携帯端末の表示部で確認することは困難である。このような問題に対応するために、携帯端末におけるデバッグ情報を無線通信を用いて外部装置に送信する方法が提案されている(例えば、特許文献1参照)。
【先行技術文献】
【特許文献】
【0004】
【特許文献1】特開2010−250407号公報
【発明の概要】
【発明が解決しようとする課題】
【0005】
ところで、携帯端末のデバッグでは、Webページを構成するスクリプト等のプログラムによって携帯端末の表示部に表示される内容をデバッグする場合がある。このようなWebページを構成するスクリプト等のプログラムには、ユーザの操作に応じて発生したイベントに基づいて処理を行うものがある。そして、このようなWebページを構成するスクリプト等のプログラムを、タッチパネルを備えるスマートフォン等の携帯端末でデバッグする場合、タッチパネルを頻繁に操作する必要が生じ、デバッグ作業が煩雑になってしまう。
【0006】
しかしながら、特許文献1に示されている方法は、デバッグ情報を外部装置に送信することに留まるため、タッチパネルを頻繁に操作する必要が依然として生じ、デバッグ作業が煩雑になってしまう。
【0007】
本発明は、携帯端末の画面表示に係るデバッグを効率よく行うことができるデバッグシステム及びデバッグ方法を提供することを目的とする。
【課題を解決するための手段】
【0008】
(1)携帯端末と、デバッグ用端末と、前記携帯端末及び前記デバッグ用端末に通信可能に接続された転送サーバと、を備え、前記携帯端末に表示されるデバッグ対象のWebページのデバッグを行うデバッグシステムであって、前記携帯端末は、第1表示手段と、Webページを前記第1表示手段に表示させる第1ブラウザと、前記第1ブラウザにより前記デバッグ対象のWebページが前記第1表示手段に表示されている場合に、前記第1ブラウザがイベントを検出したことを検出する第1イベント検出手段と、前記転送サーバとのコネクションを維持した状態で、前記第1イベント検出手段により検出された前記イベントを前記転送サーバにリアルタイムに送信するとともに前記デバッグ用端末が備える第2通信制御手段から送信されたデータを前記転送サーバを介してリアルタイムに受信する第1通信制御手段と、前記第1通信制御手段により受信したデータがイベントである場合に、当該イベントを前記第1表示手段に表示されている前記デバッグ対象のWebページのイベントとして、前記第1ブラウザに通知する第1通知手段と、を備え、前記デバッグ用端末は、前記第1表示手段に比べて表示領域が大きい第2表示手段と、Webページを前記第2表示手段に表示させる第2ブラウザと、前記第2ブラウザにより前記デバッグ対象のWebページが前記第2表示手段に表示されている場合に、前記第2ブラウザがイベントを検出したことを検出する第2イベント検出手段と、前記転送サーバとのコネクションを維持した状態で、前記第2イベント検出手段により検出された前記イベントを前記転送サーバにリアルタイムに送信するとともに前記携帯端末が備える前記第1通信制御手段から送信されたデータを前記転送サーバを介してリアルタイムに受信する前記第2通信制御手段と、前記第2通信制御手段により受信したデータがイベントである場合に、当該イベントを前記第2表示手段に表示されている前記デバッグ対象のWebページのイベントとして、前記第2ブラウザに通知する第2通知手段と、を備え、前記転送サーバは、前記携帯端末及び前記デバッグ用端末とコネクションを維持した状態で、前記携帯端末からデータを受信して前記デバッグ用端末に転送するとともに、前記デバッグ用端末からデータを受信して前記携帯端末に転送する第3通信制御手段を備える、デバッグシステム。
【0009】
(1)のデバッグシステムは、携帯端末の第1通信制御手段により、転送サーバとのコネクションを維持した状態で、第1イベント検出手段が検出したイベントを転送サーバにリアルタイムに送信するとともにデバッグ用端末から送信されたデータを転送サーバを介してリアルタイムに受信し、携帯端末の第1通知手段により、第1通信制御手段が受信したデータがイベントである場合に、当該イベントを第1表示手段に表示されているデバッグ対象のWebページのイベントとして、第1ブラウザに通知する。
【0010】
また、(1)のデバッグシステムは、デバッグ用端末の第2通信制御手段により、転送サーバとのコネクションを維持した状態で、検出されたイベントを転送サーバにリアルタイムに送信するとともに携帯端末から送信されたデータを転送サーバを介してリアルタイムに受信し、第2通知手段により、第2通信制御手段が受信したデータがイベントである場合に、当該イベントを第2表示手段に表示されているデバッグ対象のWebページのイベントとして、第2ブラウザに通知する。
【0011】
また、(1)のデバッグシステムは、第3通信制御手段により、携帯端末及びデバッグ用端末とコネクションを維持した状態で、携帯端末からデータを受信してデバッグ用端末に転送するとともに、デバッグ用端末からデータを受信して携帯端末に転送する。
【0012】
よって、(1)のデバッグシステムでは、第1表示手段及び第2表示手段において、同一内容のデバッグ対象のWebページが表示されている場合、双方向にイベントの通信がリアルタイムに行われることにより、第1表示手段及び第2表示手段に表示されているデバッグ対象のWebページの状態を常に同期させることができる。したがって、(1)のデバッグシステムでは、デバッグ用端末側において第2表示手段に表示されたデバッグ対象のWebページに対する操作によって、実質的に携帯端末の第1表示手段に表示されているデバッグ対象のWebページの表示状態に係るデバッグを行うことができる。ここで、第2表示手段は、第1表示手段に比べて表示領域が大きく、視認性に優れていることから、デバッグ対象のWebページの確認がしやすく、結果として、デバッグシステムは、携帯端末の画面表示に係るデバッグを効率よく行うことができる。
【0013】
(2)前記デバッグ対象のWebページは、デバッグログを生成し、前記第1通信制御手段は、前記第1表示手段に表示された前記デバッグ対象のWebページによってデバッグログが生成されたことに応じて、前記転送サーバとのコネクションを維持した状態で、生成されたデバッグログを前記転送サーバにリアルタイムに送信し、前記デバッグ用端末は、前記第2通信制御手段により受信したデータがデバッグログである場合に、当該デバッグログを前記第2表示手段にリアルタイムで表示させるログ表示制御手段を備える、(1)に記載のデバッグシステム。
【0014】
(2)のデバッグシステムは、携帯端末の第1通信制御手段により、第1表示手段に表示されたデバッグ対象のWebページによってデバッグログが生成されたことに応じて、転送サーバとのコネクションを維持した状態で、生成されたデバッグログを転送サーバにリアルタイムに送信し、デバッグ用端末のログ表示制御手段により、第2通信制御手段により受信したデータがデバッグログである場合に、当該デバッグログを第2表示手段にリアルタイムで表示させる。
【0015】
このようにすることで、(2)のデバッグシステムでは、携帯端末の第1表示手段に表示されたデバッグ対象のWebページによって生成されたデバッグログを、デバッグ用端末においてリアルタイムに確認することができる。
【0016】
(3)前記携帯端末は、前記第1ブラウザにおいて使用されるAPIであって外部サーバから所定情報を取得する所定APIを、擬似APIに置換するAPI置換手段を備え、前記第1通信制御手段は、前記擬似APIが前記第1ブラウザにアクセスされたことに応じて、前記転送サーバとのコネクションを維持した状態で、前記所定情報の取得要求情報を前記転送サーバに送信し、前記デバッグ用端末は、前記第2通信制御手段により受信したデータが前記取得要求情報である場合に、当該取得要求情報の入力を受け付ける取得要求情報受付手段とを備え、前記第2通信制御手段は、前記転送サーバとのコネクションを維持した状態で、取得要求情報受付手段により受け付けられた入力情報を前記転送サーバにリアルタイムに送信し、前記第1通知手段は、前記第1通信制御手段により受信したデータが前記入力情報である場合に、当該入力情報を前記擬似APIに通知する、(1)又は(2)に記載のデバッグシステム。
【0017】
(3)のデバッグシステムは、携帯端末のAPI置換手段により、第1ブラウザにおいて使用されるAPIであって外部サーバから所定情報を取得する所定APIを、擬似APIに置換し、携帯端末の第1通信制御手段により、擬似APIが第1ブラウザにアクセスされたことに応じて、転送サーバとのコネクションを維持した状態で、所定情報の取得要求情報を転送サーバに送信する。そして、(3)のデバッグシステムは、デバッグ用端末の取得要求情報受付手段により、第2通信制御手段が受信したデータが取得要求情報である場合に、当該取得要求情報の入力を受け付け、携帯端末の第1通知手段により、第1通信制御手段により受信したデータが入力情報である場合に、当該入力情報を前記擬似APIに通知する。
【0018】
このようにすることで、(3)のデバッグシステムでは、外部サーバから所定情報を取得する代わりに、デバッグ用端末において入力された当該所定情報に基づいてデバッグを行うことができる。例えば、外部サーバから取得する所定情報が、時間や携帯端末の位置に依存するものであっても、デバッグ用端末において任意の値を所定情報として入力することによって、(3)のデバッグシステムでは、柔軟にデバッグを行うことができる。
【0019】
(4)第1表示手段を有する携帯端末と、前記第1表示手段に比べて表示領域が大きい第2表示手段を有するデバッグ用端末と、前記携帯端末及び前記デバッグ用端末に通信可能に接続された転送サーバと、を備えたデバッグシステムが、前記携帯端末に表示されるデバッグ対象のWebページのデバッグを行うデバッグ方法であって、前記携帯端末が、前記第1表示手段に対してWebページを表示させる第1ブラウザにより、前記デバッグ対象のWebページが前記第1表示手段に表示されている場合に、前記第1ブラウザがイベントを検出したことを検出するステップと、前記携帯端末が、前記転送サーバとのコネクションを維持した状態で、前記第1ブラウザにおいて検出された前記イベントを前記転送サーバにリアルタイムに送信するステップと、前記携帯端末が、前記転送サーバとのコネクションを維持した状態で、前記デバッグ用端末から送信されたデータを前記転送サーバを介してリアルタイムに受信するステップと、前記携帯端末が、受信したイベントを前記第1表示手段に表示されている前記デバッグ対象のWebページのイベントとして、前記第1ブラウザに通知するステップと、前記デバッグ用端末が、前記第2表示手段に対してWebページを表示させる第2ブラウザにより、前記デバッグ対象のWebページが前記第2表示手段に表示されている場合に、前記第2ブラウザがイベントを検出したことを検出するステップと、前記デバッグ用端末が、前記転送サーバとのコネクションを維持した状態で、前記第2ブラウザにおいて検出された前記イベントを前記転送サーバにリアルタイムに送信するステップと、前記デバッグ用端末が、前記転送サーバとのコネクションを維持した状態で、前記携帯端末から送信されたデータを前記転送サーバを介してリアルタイムに受信するステップと、前記デバッグ用端末が、受信したイベントを前記第2表示手段に表示されている前記デバッグ対象のWebページのイベントとして、前記第2ブラウザに通知するステップと、前記転送サーバが、前記携帯端末及び前記デバッグ用端末とコネクションを維持した状態で、前記携帯端末からデータを受信して前記デバッグ用端末に転送するステップと、前記転送サーバが、前記携帯端末及び前記デバッグ用端末とコネクションを維持した状態で、前記デバッグ用端末からデータを受信して前記携帯端末に転送するステップと、を含むデバッグ方法。
【0020】
(4)のデバッグ方法によれば、(1)に係る発明と同様の効果を奏する。
【発明の効果】
【0021】
本発明によれば、携帯端末の画面表示に係るデバッグを効率よく行うことができるデバッグシステム及びデバッグ方法を提供することができる。
【図面の簡単な説明】
【0022】
【図1】本実施形態に係るデバッグシステムの機能概要を示す図である。
【図2】本実施形態に係るスマートフォンにおいて発生したデータをデバッグ用端末にリアルタイムに送信する処理の流れを示すフローチャートである。
【図3】図2に続くフローチャートである。
【図4】図3に続くフローチャートである。
【図5】本実施形態に係るデバッグ用端末において発生したデータをスマートフォンにリアルタイムに送信する処理の流れを示すフローチャートである。
【図6】図5に続くフローチャートである。
【発明を実施するための形態】
【0023】
以下、本発明の実施形態について説明する。
図1は、本実施形態に係るデバッグシステム1の機能概要を示す図である。デバッグシステム1は、スマートフォン等の携帯端末に表示されたWebページの画面デバッグを行うためのシステムである。
デバッグシステム1は、携帯端末としてのスマートフォン2と、転送サーバ4と、デバッグ用端末3とを備える。
【0024】
本実施形態は、コンピュータ(スマートフォン2、転送サーバ4及びデバッグ用端末3)及びその周辺装置に適用される。本実施形態における各部は、コンピュータ及びその周辺装置が備えるハードウェア並びに当該ハードウェアを制御するソフトウェアによって構成される。
【0025】
上記ハードウェアには、制御部としてのCPU(Central Processing Unit)の他、記憶部、通信装置、表示装置及び入力装置が含まれる。記憶部としては、例えば、メモリ(RAM:Random Access Memory、ROM:Read Only Memory等)、ハードディスクドライブ(HDD:Hard Disk Drive)及び光ディスク(CD:Compact Disk、DVD:Digital Versatile Disk等)ドライブが挙げられる。通信装置としては、例えば、各種有線及び無線インターフェース装置が挙げられる。表示装置としては、例えば、液晶ディスプレイやプラズマディスプレイ等の各種ディスプレイが挙げられる。入力装置としては、例えば、キーボード、タッチパッド及びポインティング・デバイス(マウス、トラッキングボール等)が挙げられる。
【0026】
上記ソフトウェアには、上記ハードウェアを制御するコンピュータ・プログラムやデータが含まれる。コンピュータ・プログラムやデータは、記憶部により記憶され、制御部により適宜実行、参照される。また、コンピュータ・プログラムやデータは、通信回線を介して配布されることも可能であり、CD−ROMや可搬性メモリ等のコンピュータ可読媒体に記録して配布されることも可能である。
【0027】
スマートフォン2は、第1操作部21と、第1表示部22と、第1記憶部23と、第1制御部24とを備える。
【0028】
第1操作部21は、例えば、タッチパッドやスマートフォン2の筐体に設けられている各種ボタンにより実装され、操作者からの操作入力を受け付ける。
第1表示部22は、例えば、液晶ディスプレイ等の各種ディスプレイにより実装される。
【0029】
第1記憶部23は、Webページを第1表示部22に表示させるための第1ブラウザや、第1ブラウザにおいて使用される複数のAPIやスマートフォン2に係る機能を実行するプログラム(図示省略)等を記憶する。
【0030】
第1制御部24は、スマートフォン2に係る各機能を統括的に制御する。第1制御部24は、第1ブラウザ実行部241と、API置換手段としてのAPI置換部242と、第1イベント検出手段としての第1検出部243と、第1通信制御手段としての第1通信制御部244と、第1通知手段としての第1通知部245とを備える。
【0031】
第1ブラウザ実行部241は、第1操作部21により第1記憶部23に記憶されている第1ブラウザを実行する操作を受け付けたことに応じて、当該第1ブラウザを実行する。
【0032】
第1ブラウザは、第1操作部21を介してWebページのアドレスを受け付け、Webページを構成するhtml(Hypertext Markup Language)文書や、JavaScript(登録商標)等のスクリプトを解析して、このWebページを第1表示部22に表示させる。本実施形態では、この第1ブラウザによって、デバッグ対象のWebページが第1表示部22に表示されているものとする。ここで、デバッグ対象のWebページでは、イベントの発生を検出する1又は複数のスクリプトであって、デバッグログを出力するためのコードを有するスクリプトが含まれているものとする。そして、第1ブラウザ実行部241によって実行された第1ブラウザは、デバッグ対象のWebページが第1操作部21によって操作されたことに応じて発生したイベントを検出する。
【0033】
API置換部242は、第1ブラウザにおいて使用されるAPIであって、外部サーバから所定情報を取得する所定のAPIを、擬似APIに置換する。例えば、API置換部242は、位置取得APIを、この位置取得APIと同一名称の擬似位置取得APIに置換する。ここで、第1ブラウザにおいて使用されるAPIは、第1記憶部23に記憶されているAPIが複製されたものであり、API置換部242は、複製されたAPIのうち、外部サーバから所定情報を取得するAPIを、擬似APIに置換する。なお、スマートフォン2において、置換するAPIを適宜選択できるようにしてもよい。
【0034】
第1検出部243は、第1ブラウザにおいてハンドルされたイベントを検出する。具体的には、第1検出部243は、第1ブラウザによりデバッグ対象のWebページが第1表示部22に表示されている場合に、第1ブラウザが、デバッグ対象のWebページに含まれるスクリプトによりイベントを検出したことを検出する。
また、第1検出部243は、第1ブラウザによりデバッグ対象のWebページが第1表示部22に表示されている場合に、当該デバッグ対象のWebページの内容が変更されたことを検出する。デバッグ対象のWebページの内容の変更とは、例えば、デザイン情報の変更や、タグ等の構成要素の削除や変更等である。
【0035】
第1通信制御部244は、転送サーバ4とのコネクションを維持した状態で、各種通信を行う。
具体的には、第1通信制御部244は、転送サーバ4とのコネクションを維持した状態で、第1検出部243により検出されたイベント及び変更情報を転送サーバ4にリアルタイムに送信するとともに、デバッグ用端末3から送信されたデータを転送サーバ4を介してリアルタイムに受信する。ここで、第1通信制御部244は、変更情報を転送サーバ4に送信する場合、当該変更情報がバイナリデータである場合には、予め規定された文字列表記(例えば、XML Path Language)に変換してから変更情報を送信する。このようにすることで、スマートフォン2における変更情報をデバッグ用端末3のデバッグ対象のWebページに反映することができる。
【0036】
また、第1通信制御部244は、第1表示部22に表示されたデバッグ対象のWebページによってデバッグログが生成されたことに応じて、転送サーバ4とのコネクションを維持した状態で、生成されたデバッグログを転送サーバ4にリアルタイムに送信する。
【0037】
また、第1通信制御部244は、API置換部242により置換された擬似APIが第1ブラウザにアクセスされたことに応じて、転送サーバ4とのコネクションを維持した状態で、所定情報の取得要求情報を転送サーバ4に送信する。
【0038】
第1通知部245は、第1通信制御部244により受信したデータがイベントである場合、当該イベントを、第1表示部22に表示されているデバッグ対象のWebページのイベントとして、第1ブラウザに通知する。すると、第1ブラウザは、このイベントに対応するスクリプトを実行して、実行結果に基づいてデバッグ対象のWebページを第1表示部22に表示させる。
【0039】
また、第1通知部245は、第1通信制御部244により受信したデータが、擬似APIに対応する入力情報である場合に、当該入力情報を擬似APIに通知する。
また、第1通知部245は、第1通信制御部244により受信したデータが、変更情報である場合に、当該変更情報をデバッグ対象のWebページに反映させる。
【0040】
デバッグ用端末3は、第2操作部31と、第2表示部32と、第2記憶部33と、第2制御部34とを備える。
【0041】
第2操作部31は、例えば、キーボードやマウス等により実装され、操作者からの操作入力を受け付ける。
第2表示部32は、表示領域が第1表示部22の表示領域が比べて大きく、例えば、液晶ディスプレイ等の各種ディスプレイにより実装される。
【0042】
第2記憶部33は、Webページを第2表示部32に表示させるための第2ブラウザや、第2ブラウザにおいて使用される複数のAPIや、デバッグ用端末3に係る機能を実行するプログラム(図示省略)等を記憶する。
【0043】
第2制御部34は、デバッグ用端末3に係る各機能を統括的に制御する。第2制御部34は、第2ブラウザ実行部341と、第2イベント検出手段としての第2検出部342と、第2通信制御手段としての第2通信制御部343と、第2通知手段としての第2通知部344と、取得要求情報受付手段としての取得要求情報受付部345と、ログ表示制御手段としてのログ表示制御部346とを備える。
【0044】
第2ブラウザ実行部341は、第2操作部31により第2記憶部33に記憶されている第2ブラウザを実行する操作を受け付けたことに応じて、当該第2ブラウザを実行する。
【0045】
第2ブラウザは、第2操作部31を介してWebページのアドレスを受け付け、Webページを構成するhtml文書や、JavaScript等のスクリプトを解析して、このWebページを第2表示部32に表示させる。本実施形態では、この第2ブラウザによって、デバッグ対象のWebページが第2表示部32に表示されているものとする。つまり、同一のデバッグ対象のWebページが、スマートフォン2の第1表示部22と、デバッグ用端末3の第2表示部32とに表示されているものとする。そして、第2ブラウザ実行部341によって実行された第2ブラウザは、デバッグ対象のWebページが第2操作部31によって操作されたことに応じて発生したイベントを検出する。
【0046】
第2検出部342は、第2ブラウザにおいてハンドルされたイベントを検出する。具体的には、第2検出部342は、第2ブラウザによりデバッグ対象のWebページが第2表示部32に表示されている場合に、第2ブラウザが、デバッグ対象のWebページに含まれるスクリプトによりイベントを検出したことを検出する。
また、第2検出部342は、第2ブラウザによりデバッグ対象のWebページが第2表示部32に表示されている場合に、当該デバッグ対象のWebページの内容が変更されたことを検出する。
【0047】
第2通信制御部343は、転送サーバ4とのコネクションを維持した状態で、各種通信を行う。
具体的には、第2通信制御部343は、転送サーバ4とのコネクションを維持した状態で、第2検出部342により検出したイベントを転送サーバ4にリアルタイムに送信するとともに、スマートフォン2から送信されたデータを転送サーバ4を介してリアルタイムに受信する。ここで、第2通信制御部343は、変更情報を転送サーバ4に送信する場合、当該変更情報がバイナリデータである場合には、予め規定された文字列表記に変換してから変更情報を送信する。このようにすることで、デバッグ用端末3における変更情報をスマートフォン2のデバッグ対象のWebページに反映することができる。
【0048】
また、第2通信制御部343は、転送サーバ4とのコネクションを維持した状態で、後述の取得要求情報受付部345により受け付けられた入力情報を転送サーバ4にリアルタイムに送信する。
【0049】
第2通知部344は、第2通信制御部343により受信したデータがイベントである場合に、当該イベントを第2表示部32に表示されているデバッグ対象のWebページのイベントとして、第2ブラウザ実行部341によって実行された第2ブラウザに通知する。すると、第2ブラウザ実行部341によって実行された第2ブラウザは、このイベントに対応するスクリプトを実行して、実行結果に基づいてデバッグ対象のWebページを第2表示部32に表示させる。
また、第2通知部344は、第2通信制御部343により受信したデータが、変更情報である場合に、当該変更情報をデバッグ対象のWebページに反映させる。
【0050】
取得要求情報受付部345は、第2通信制御部343により受信したデータが擬似APIに対応する取得要求情報である場合に、当該取得要求情報の入力を受け付けるための入力画面を第2表示部32に表示させ、当該取得要求情報の入力を受け付ける。
【0051】
ログ表示制御部346は、第2表示部32に表示されたデバッグ対象のWebページによって生成されたデバッグログを前記第2表示手段にリアルタイムで表示させる。また、ログ表示制御部346は、第2通信制御部343により受信したデータがデバッグログである場合に、当該デバッグログを第2表示部32にリアルタイムで表示させる。
【0052】
転送サーバ4は、第3記憶部43と、第3制御部44とを備える。
第3記憶部43は、転送サーバ4に係る機能を実行するプログラム(図示省略)等を記憶する。
第3制御部44は、転送サーバ4に係る各機能を統括的に制御する。第3制御部44は、第3通信制御部441を備える。
【0053】
第3通信制御部441は、一部にNode.js(登録商標)及びHTML5のWebSocket機能を利用することによって、スマートフォン2と、デバッグ用端末3とのそれぞれとコネクションを維持した状態でデータをリアルタイムで送受信する。
【0054】
具体的には、第3通信制御部441は、スマートフォン2とコネクションを維持した状態で、スマートフォン2から送信されたデータ(イベント、デバッグログ、擬似APIの取得要求情報)を受信する。そして、第3通信制御部441は、スマートフォン2から受信したデータを、デバッグ用端末3とコネクションを維持した状態で、デバッグ用端末3にリアルタイムで転送する。
【0055】
また、第3通信制御部441は、デバッグ用端末3とコネクションを維持した状態で、デバッグ用端末3から送信されたデータ(イベント、入力情報)を受信する。そして、第3通信制御部441は、デバッグ用端末3から受信したデータを、スマートフォン2とコネクションを維持した状態で、スマートフォン2にリアルタイムで転送する。
【0056】
続いて、デバッグシステム1における処理の流れの一例について説明する。
図2は、本実施形態におけるスマートフォン2において発生したデータをデバッグ用端末3にリアルタイムに送信する処理の流れを示すフローチャートである。なお、本フローチャートの開始時には、第1表示部22及び第2表示部32において、同一内容のデバッグ用のWebページが表示されているものとする。
【0057】
ステップS1において、第1制御部24(API置換部242)は、外部サーバから所定情報を取得するAPIを、擬似APIに置換する。
【0058】
ステップS2において、第1制御部24(第1検出部243)は、第1ブラウザが、デバッグ対象のWebページに含まれるスクリプトによりイベントを検出したか否かを判定する。第1制御部24(第1検出部243)は、この判定がYESの場合、ステップS6に処理を移し、この判定がNOの場合、ステップS3に処理を移す。
ステップS3において、第1制御部24(第1検出部243)は、デバッグ対象のWebページの内容が変更されたか否かを判定する。第1制御部24(第1検出部243)は、この判定がYESの場合、ステップS6に処理を移し、この判定がNOの場合、ステップS4に処理を移す。
【0059】
ステップS4において、第1制御部24(第1通信制御部244)は、第1表示部22に表示されたデバッグ対象のWebページによってデバッグログが生成されたか否かを判定する。第1制御部24(第1通信制御部244)は、この判定がYESの場合、ステップS6に処理を移し、この判定がNOの場合、ステップS5に処理を移す。
ステップS5において、第1制御部24(第1通信制御部244)は、ステップS1において置換された擬似APIが第1ブラウザにアクセスされたか否かを判定する。第1制御部24(第1通信制御部244)は、この判定がYESの場合、ステップS6に処理を移し、この判定がNOの場合、ステップS2に処理を移す。
【0060】
ステップS6において、第1制御部24(第1通信制御部244)は、転送サーバ4とのコネクションを維持した状態で、ステップS2において検出されたイベント、ステップS3において検出された変更情報、ステップS4において生成されたデバッグログ、又はステップS5のアクセスに対応する取得要求情報を転送サーバ4にリアルタイムに送信する。なお、第1制御部24(第1通信制御部244)は、ステップS6においてデータを送信した後、ステップS2に移り、次のデータを送信する処理を継続する。
【0061】
ステップS7において、第3制御部44(第3通信制御部441)は、スマートフォン2とコネクションを維持した状態で、スマートフォン2から送信されたイベント、変更情報、デバッグログ又は取得要求情報を受信する。
【0062】
図3に移り、ステップS8において、第3制御部44(第3通信制御部441)は、デバッグ用端末3とコネクションを維持した状態で、ステップS7において受信したイベント、変更情報、デバッグログ又は取得要求情報を、デバッグ用端末3にリアルタイムで転送する。
【0063】
ステップS9において、第2制御部34(第2通信制御部343)は、転送サーバ4とのコネクションを維持した状態で、スマートフォン2から送信されたデータを転送サーバ4を介してリアルタイムに受信する。
【0064】
ステップS10において、第2制御部34(第2通知部344)は、ステップS9において受信したデータがイベントであるか否かを判定する。第2制御部34(第2通知部344)は、この判定がYESの場合、ステップS11に処理を移し、この判定がNOの場合、ステップS12に処理を移す。
ステップS11において、第2制御部34(第2通知部344)は、ステップS9において受信したイベントを第2表示部32に表示されているデバッグ対象のWebページのイベントとして、第2ブラウザに通知する。すると、第2ブラウザは、このイベントに対応するスクリプトを実行して、実行結果に基づいてデバッグ対象のWebページを第2表示部32に表示させる。
【0065】
ステップS12において、第2制御部34(第2通知部344)は、ステップS9において受信したデータが変更情報であるか否かを判定する。第2制御部34(第2通知部344)は、この判定がYESの場合、ステップS13に処理を移し、この判定がNOの場合、ステップS14に処理を移す。
ステップS13において、第2制御部34(第2通知部344)は、ステップS9において受信した変更情報を第2表示部32に表示されているデバッグ対象のWebページに反映させる。すると、第2ブラウザは、この変更情報に基づいて、デバッグ対象のWebページを第2表示部32に表示させる。
【0066】
ステップS14において、第2制御部34(ログ表示制御部346)は、ステップS9において受信したデータがデバッグログであるか否かを判定する。第2制御部34(ログ表示制御部346)は、この判定がYESの場合、ステップS15に処理を移し、この判定がNOの場合、ステップS16に処理を移す。
ステップS15において、第2制御部34(ログ表示制御部346)は、ステップS9において受信したデバッグログを第2表示部32に表示させる。
【0067】
図4のステップS16に移る。ステップS16に移る場合、受信したデータは、擬似APIに対応する取得要求情報となる。そこで、ステップS16において、第2制御部34(取得要求情報受付部345)は、第2通信制御部343により受信したデータが擬似APIに対応する取得要求情報である場合に、当該取得要求情報の入力を受け付けるための入力画面を第2表示部32に表示させ、当該取得要求情報の入力を受け付ける。
ステップS17において、第2制御部34(第2通信制御部343)は、転送サーバ4とのコネクションを維持した状態で、ステップS16において受け付けられた入力情報を転送サーバ4にリアルタイムに送信する。
【0068】
ステップS18において、第3制御部44(第3通信制御部441)は、デバッグ用端末3とコネクションを維持した状態で、デバッグ用端末3から送信された入力情報を受信する。
ステップS19において、第3制御部44(第3通信制御部441)は、スマートフォン2とコネクションを維持した状態で、ステップS18において受信した入力情報を、スマートフォン2にリアルタイムで転送する。
【0069】
ステップS20において、第1制御部24(第1通信制御部244)は、転送サーバ4とのコネクションを維持した状態で、デバッグ用端末3から送信された入力情報を転送サーバ4を介してリアルタイムに受信する。
ステップS21において、第1制御部24(第1通信制御部244)は、第1通知部245は、ステップS20において受信した入力情報を擬似APIに通知する。すると、擬似APIは、入力情報を第1ブラウザに出力し、第1ブラウザにおいて、擬似APIから出力された入力情報に基づいて処理が行われる。
【0070】
図5は、本実施形態に係るデバッグ用端末3において発生したデータをスマートフォン2にリアルタイムに送信する処理の流れを示すフローチャートである。
【0071】
ステップS31において、第2制御部34(第2検出部342)は、第2ブラウザが、デバッグ対象のWebページに含まれるスクリプトによりイベントを検出したか否かを判定する。第2制御部34(第2検出部342)は、この判定がYESの場合、ステップS33に処理を移し、この判定がNOの場合、ステップS32に処理を移す。
ステップS32において、第2制御部34(第2検出部342)は、デバッグ対象のWebページの内容が変更されたか否かを判定する。第2制御部34(第2検出部342)は、この判定がYESの場合、ステップS33に処理を移し、この判定がNOの場合、ステップS31に処理を移す。
【0072】
ステップS33において、第2制御部34(第2通信制御部343)は、転送サーバ4とのコネクションを維持した状態で、ステップS31において検出されたイベント、ステップS32において検出された変更情報を転送サーバ4にリアルタイムに送信する。なお、第2制御部34(第2通信制御部343)は、ステップS33においてデータを送信した後、ステップS31に移り、次のデータを送信する処理を継続する。
【0073】
ステップS34において、第3制御部44(第3通信制御部441)は、デバッグ用端末3とコネクションを維持した状態で、デバッグ用端末3から送信されたイベント又は変更情報を受信する。
【0074】
図6に移り、ステップS35において、第3制御部44(第3通信制御部441)は、スマートフォン2とコネクションを維持した状態で、ステップS34において受信したイベント又は変更情報を、スマートフォン2にリアルタイムで転送する。
【0075】
ステップS36において、第1制御部24(第1通信制御部244)は、転送サーバ4とのコネクションを維持した状態で、デバッグ用端末3から送信されたデータを転送サーバ4を介してリアルタイムに受信する。
【0076】
ステップS37において、第1制御部24(第1通知部245)は、ステップS36において受信したデータがイベントであるか否かを判定する。第1制御部24(第1通知部245)は、この判定がYESの場合、ステップS38に処理を移し、この判定がNOの場合、ステップS39に処理を移す。
ステップS38において、第1制御部24(第1通知部245)は、ステップS36において受信したイベントを第1表示部22に表示されているデバッグ対象のWebページのイベントとして、第1ブラウザに通知する。すると、第1ブラウザは、このイベントに対応するスクリプトを実行して、実行結果に基づいてデバッグ対象のWebページを第1表示部22に表示させる。
【0077】
ステップS39に移る場合、受信したデータは、変更情報となる。そこで、ステップS39において、第1制御部24(第1通知部245)は、ステップS36において受信した変更情報を第1表示部22に表示されているデバッグ対象のWebページに反映させる。すると、第1ブラウザは、この変更情報に基づいて、デバッグ対象のWebページを第1表示部22に表示させる。
【0078】
以上、本実施形態によれば、デバッグシステム1は、スマートフォン2の第1通信制御部244により、転送サーバ4とのコネクションを維持した状態で、第1検出部243が検出したイベントを転送サーバ4にリアルタイムに送信するとともにデバッグ用端末3から送信されたデータを転送サーバ4を介してリアルタイムに受信し、スマートフォン2の第1通知部245により、第1通信制御部244が受信したデータがイベントである場合に、当該イベントを第1表示部22に表示されているデバッグ対象のWebページのイベントとして、第1ブラウザに通知する。
【0079】
また、デバッグシステム1は、デバッグ用端末の第2通信制御部343により、転送サーバ4とのコネクションを維持した状態で、検出されたイベントを転送サーバ4にリアルタイムに送信するとともに、スマートフォン2から送信されたデータを転送サーバ4を介してリアルタイムに受信し、第2通知部344により、第2通信制御部343が受信したデータがイベントである場合に、当該イベントを第2表示部32に表示されているデバッグ対象のWebページのイベントとして、第2ブラウザに通知する。
【0080】
また、デバッグシステム1は、第3通信制御部441により、スマートフォン2及びデバッグ用端末3とコネクションを維持した状態で、スマートフォン2からデータを受信してデバッグ用端末3に転送するとともに、デバッグ用端末3からデータを受信してスマートフォン2に転送する。
【0081】
よって、デバッグシステム1では、第1表示部22及び第2表示部32において、同一内容のデバッグ対象のWebページが表示されている場合、双方向にイベントの通信がリアルタイムに行われることにより、第1表示部22及び第2表示部32に表示されているデバッグ対象のWebページの状態を常に同期させることができる。したがって、デバッグシステム1では、デバッグ用端末3側において第2表示部32に表示されたデバッグ対象のWebページに対する操作によって、実質的にスマートフォン2の第1表示部22に表示されているデバッグ対象のWebページの表示状態に係るデバッグを行うことができる。ここで、第2表示部32は、第1表示部22に比べて表示領域が大きく、視認性に優れていることから、デバッグ対象のWebページの確認がしやすく、結果として、デバッグシステム1は、スマートフォン2の画面表示に係るデバッグを効率よく行うことができる。
【0082】
また、デバッグシステム1は、スマートフォン2の第1通信制御部244により、第1表示部22に表示されたデバッグ対象のWebページによってデバッグログが生成されたことに応じて、転送サーバ4とのコネクションを維持した状態で、生成されたデバッグログを転送サーバ4にリアルタイムに送信し、デバッグ用端末3のログ表示制御部346により、第2通信制御部343によって受信したデータがデバッグログである場合に、当該デバッグログを第2表示部32にリアルタイムで表示させる。
【0083】
このようにすることで、デバッグシステム1では、スマートフォン2の第1表示部22に表示されたデバッグ対象のWebページによって生成されたデバッグログを、デバッグ用端末3においてリアルタイムに確認することができる。
【0084】
また、デバッグシステム1は、スマートフォン2のAPI置換部242により、第1ブラウザにおいて使用されるAPIであって外部サーバから所定情報を取得する所定APIを、擬似APIに置換し、スマートフォン2の第1通信制御部244により、擬似APIが第1ブラウザにアクセスされたことに応じて、転送サーバ4とのコネクションを維持した状態で、所定情報の取得要求情報を転送サーバに送信する。そして、デバッグシステム1は、デバッグ用端末3の取得要求情報受付部345により、第2通信制御部343が受信したデータが取得要求情報である場合に、当該取得要求情報の入力を受け付け、スマートフォン2の第1通知部245により、第1通信制御部244により受信したデータが入力情報である場合に、当該入力情報を擬似APIに通知する。
【0085】
このようにすることで、デバッグシステム1では、外部サーバから所定情報を取得する代わりに、デバッグ用端末3において入力された当該所定情報に基づいてデバッグを行うことができる。例えば、外部サーバから取得する所定情報が、時間やスマートフォン2の位置に依存するものであっても、デバッグ用端末3において任意の値を所定情報として入力することによって、デバッグシステムでは、柔軟にデバッグを行うことができる。
【0086】
以上、本発明の実施形態について説明したが、本発明は前述した実施形態に限るものではない。また、本発明の実施形態に記載された効果は、本発明から生じる最も好適な効果を列挙したに過ぎず、本発明による効果は、本発明の実施形態に記載されたものに限定されるものではない。
【符号の説明】
【0087】
1 デバッグシステム
2 スマートフォン
3 デバッグ用端末
4 転送サーバ
21 第1操作部
22 第1表示部
23 第1記憶部
24 第1制御部
31 第2操作部
32 第2表示部
33 第2記憶部
34 第2制御部
43 第3記憶部
44 第3制御部
241 第1ブラウザ実行部
242 API置換部
243 第1検出部
244 第1通信制御部
245 第1通知部
341 第2ブラウザ実行部
342 第2検出部
343 第2通信制御部
344 第2通知部
345 取得要求情報受付部
346 ログ表示制御部
441 第3通信制御部

【特許請求の範囲】
【請求項1】
携帯端末と、デバッグ用端末と、前記携帯端末及び前記デバッグ用端末に通信可能に接続された転送サーバと、を備え、前記携帯端末に表示されるデバッグ対象のWebページのデバッグを行うデバッグシステムであって、
前記携帯端末は、
第1表示手段と、
Webページを前記第1表示手段に表示させる第1ブラウザと、
前記第1ブラウザにより前記デバッグ対象のWebページが前記第1表示手段に表示されている場合に、前記第1ブラウザがイベントを検出したことを検出する第1イベント検出手段と、
前記転送サーバとのコネクションを維持した状態で、前記第1イベント検出手段により検出された前記イベントを前記転送サーバにリアルタイムに送信するとともに前記デバッグ用端末が備える第2通信制御手段から送信されたデータを前記転送サーバを介してリアルタイムに受信する第1通信制御手段と、
前記第1通信制御手段により受信したデータがイベントである場合に、当該イベントを前記第1表示手段に表示されている前記デバッグ対象のWebページのイベントとして、前記第1ブラウザに通知する第1通知手段と、を備え、
前記デバッグ用端末は、
前記第1表示手段に比べて表示領域が大きい第2表示手段と、
Webページを前記第2表示手段に表示させる第2ブラウザと、
前記第2ブラウザにより前記デバッグ対象のWebページが前記第2表示手段に表示されている場合に、前記第2ブラウザがイベントを検出したことを検出する第2イベント検出手段と、
前記転送サーバとのコネクションを維持した状態で、前記第2イベント検出手段により検出された前記イベントを前記転送サーバにリアルタイムに送信するとともに前記携帯端末が備える前記第1通信制御手段から送信されたデータを前記転送サーバを介してリアルタイムに受信する前記第2通信制御手段と、
前記第2通信制御手段により受信したデータがイベントである場合に、当該イベントを前記第2表示手段に表示されている前記デバッグ対象のWebページのイベントとして、前記第2ブラウザに通知する第2通知手段と、を備え、
前記転送サーバは、
前記携帯端末及び前記デバッグ用端末とコネクションを維持した状態で、前記携帯端末からデータを受信して前記デバッグ用端末に転送するとともに、前記デバッグ用端末からデータを受信して前記携帯端末に転送する第3通信制御手段を備える、
デバッグシステム。
【請求項2】
前記デバッグ対象のWebページは、デバッグログを生成し、
前記第1通信制御手段は、前記第1表示手段に表示された前記デバッグ対象のWebページによってデバッグログが生成されたことに応じて、前記転送サーバとのコネクションを維持した状態で、生成されたデバッグログを前記転送サーバにリアルタイムに送信し、
前記デバッグ用端末は、前記第2通信制御手段により受信したデータがデバッグログである場合に、当該デバッグログを前記第2表示手段にリアルタイムで表示させるログ表示制御手段を備える、
請求項1に記載のデバッグシステム。
【請求項3】
前記携帯端末は、前記第1ブラウザにおいて使用されるAPIであって外部サーバから所定情報を取得する所定APIを、擬似APIに置換するAPI置換手段を備え、
前記第1通信制御手段は、前記擬似APIが前記第1ブラウザにアクセスされたことに応じて、前記転送サーバとのコネクションを維持した状態で、前記所定情報の取得要求情報を前記転送サーバに送信し、
前記デバッグ用端末は、
前記第2通信制御手段により受信したデータが前記取得要求情報である場合に、当該取得要求情報の入力を受け付ける取得要求情報受付手段とを備え、
前記第2通信制御手段は、前記転送サーバとのコネクションを維持した状態で、取得要求情報受付手段により受け付けられた入力情報を前記転送サーバにリアルタイムに送信し、
前記第1通知手段は、前記第1通信制御手段により受信したデータが前記入力情報である場合に、当該入力情報を前記擬似APIに通知する、
請求項1又は2に記載のデバッグシステム。
【請求項4】
第1表示手段を有する携帯端末と、前記第1表示手段に比べて表示領域が大きい第2表示手段を有するデバッグ用端末と、前記携帯端末及び前記デバッグ用端末に通信可能に接続された転送サーバと、を備えたデバッグシステムが、前記携帯端末に表示されるデバッグ対象のWebページのデバッグを行うデバッグ方法であって、
前記携帯端末が、前記第1表示手段に対してWebページを表示させる第1ブラウザにより、前記デバッグ対象のWebページが前記第1表示手段に表示されている場合に、前記第1ブラウザがイベントを検出したことを検出するステップと、
前記携帯端末が、前記転送サーバとのコネクションを維持した状態で、前記第1ブラウザにおいて検出された前記イベントを前記転送サーバにリアルタイムに送信するステップと、
前記携帯端末が、前記転送サーバとのコネクションを維持した状態で、前記デバッグ用端末から送信されたデータを前記転送サーバを介してリアルタイムに受信するステップと、
前記携帯端末が、受信したイベントを前記第1表示手段に表示されている前記デバッグ対象のWebページのイベントとして、前記第1ブラウザに通知するステップと、
前記デバッグ用端末が、前記第2表示手段に対してWebページを表示させる第2ブラウザにより、前記デバッグ対象のWebページが前記第2表示手段に表示されている場合に、前記第2ブラウザがイベントを検出したことを検出するステップと、
前記デバッグ用端末が、前記転送サーバとのコネクションを維持した状態で、前記第2ブラウザにおいて検出された前記イベントを前記転送サーバにリアルタイムに送信するステップと、
前記デバッグ用端末が、前記転送サーバとのコネクションを維持した状態で、前記携帯端末から送信されたデータを前記転送サーバを介してリアルタイムに受信するステップと、
前記デバッグ用端末が、受信したイベントを前記第2表示手段に表示されている前記デバッグ対象のWebページのイベントとして、前記第2ブラウザに通知するステップと、
前記転送サーバが、前記携帯端末及び前記デバッグ用端末とコネクションを維持した状態で、前記携帯端末からデータを受信して前記デバッグ用端末に転送するステップと、
前記転送サーバが、前記携帯端末及び前記デバッグ用端末とコネクションを維持した状態で、前記デバッグ用端末からデータを受信して前記携帯端末に転送するステップと、
を含むデバッグ方法。

【図1】
image rotate

【図2】
image rotate

【図3】
image rotate

【図4】
image rotate

【図5】
image rotate

【図6】
image rotate


【公開番号】特開2013−12038(P2013−12038A)
【公開日】平成25年1月17日(2013.1.17)
【国際特許分類】
【出願番号】特願2011−144358(P2011−144358)
【出願日】平成23年6月29日(2011.6.29)
【出願人】(500257300)ヤフー株式会社 (1,128)
【Fターム(参考)】