18
16

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

端末のWebViewの詳細を調べる方法(Safariインスペクタ)

Last updated at Posted at 2016-05-26

アプリやスマホwebページでwebViewに問題があるけど、詳細が見れなくて困った方へ。

Safariに便利な機能があります!
スクリーンショット 2016-05-27 10.29.50.png

#1:端末のWebインスペクタをON
iOS端末の設定Safari詳細にてWebインスペクタをON
IMG_0234.jpg

#2:Safari開発ツールをON
PCでSafariを立ち上げて環境設定詳細からメニューバーに開発メニューを表示をON
スクリーンショット 2016-05-26 14.23.15.png

#3:立ち上げ

  • アプリの場合→見たいアプリをビルドします。
    (立ち上げた後は調べたいwebViewページを開いておきましょう。)
  • Webの場合→見たいページをSafariなどで開いておきます

#4:Safari開発メニューから対象の端末とアプリを選択
するとドーーーン。
スクリーンショット 2016-05-27 10.29.50.png

cssを軽くいじったりとかもできます
スクリーンショット 2016-05-26 15.01.41.png

エラーがあった時はデバッガとかで観れるようです。

これは端末でsafariを立ち上げている時に関わらず、アプリ内webviewも見ることができます。
便利!

18
16
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
18
16

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?