Mac Safari とケーブル直結して iPhone Safari の HTML やパフォーマンス、リクエスト、レスポンスなどをデバッグする方法♪
- Mac と iPhone を有線ケーブルでつなぐ
- iPhone で 設定 > Safari > 詳細 > Webインスペクタ、「オン」にする
- iPhone の Safari でデバッグしたいウェブページを開く
- Mac で Safari を起ち上げ、上部メニューの Safari > 環境設定… > 詳細 > メニューバーに”開発”メニューを表示、のチェックを打つ
- 上部メニューの開発 > iPhone5S > iPhone で表示したウェブページを選択
Mac 上部メニューの開発では、「iPhone5S」と記しましたけれども、iPhone の種類によって変わってくるのだと存じます。
なお、iPhone の設定アプリの説明には次のようにありましたわ。
Webインスペクタを使うにはコンピュータにケーブル接続し、コンピュータのSafariで”開発”メニューからiPhoneにアクセスします。”開発”メニューはSafariの”詳細”環境設定で有効にできます。
こちらの説明でも充分ですけれども、少し詳細に手順を記しましたの。
Webインスペクタで気がついた点♪
- Mac で左側のリソースコンテンツ右側のリロードアイコンをクリックすると、iPhone の Safari が連動してウェブページをリロードする。
- Mac の左側のリソースコンテンツ右側のリロードアイコンをクリックすると、iPhone 側 Safari のウェブページはスーパーリロードされる。
- 逆に iPhone の Safari を操作してページ移動すると、Mac の Safari の Webインスペクタも連動してソースやリクエスト、レスポンスが読み込まれる
- iPhone の Safari をホームボタンで閉じたら、Mac の Safari がエラーとなって落ちた。「Safari が予期しない理由で終了しました。」ウインドウが表示された。たまたまかもしれない。
おわりに
本投稿では、iPhone の Safari では text/html もキャッシュされるのかしら？スマートフォンでトップページを表示しましても、最新の投稿が表示されませんの。。。その原因を探るために今回の手順をお試しいたしました。
結果、、、、
Mac Safari から操作しましたら、スーパーリロードされ、よくわからなくなってしまいました＞＜。
ただし、レスポンスヘッダを見てみますと、Expires の日時は 1984 年とキャッシュされておりません。
やはり mod_expire で無差別にキャッシュしても html はキャッシュされないはずっ！との思惑は正しかった、、、のかしら。。。でも現実は、最新の投稿が表示されませんでしたのよね。。。
今回のきっかけは、iPhone の Safari のウェブページの HTML や 読み込みスピード、エラー、ワーニング、リクエスト、レスポンスなどのデベロッパーツールがあったと、確か風の便りに聞いた記憶でした。
詳しく調べるに辺り、次のページが参考になりましたの！ありがとう存じます。
以上です。