iOS

【Swift】インスペクタを利用してWKWebViewの表示内容を確認

投稿日:

はじめに

こんにちはsuzukiです。今回はWKWebViewの表示内容をSafariで確認する方法をまとめます。
Webの表示内容をアプリから確認する時や、テストを行う際などに利用することもあるかなと思います。

アプリの設定

インスペクタを利用するには下記の2点が必要です。
・開発用のビルドであること
・WebViewの設定でインスペクタの利用を許可すること

開発用のビルドであること

配布用のプロビジョニングではインスペクタ機能を利用することができません。
開発用のプロビジョニングでビルドされている必要があります。
開発用のプロビジョニングでIPAを作る場合は、テストフライトが使えないため注意です。

WebViewの設定でインスペクタの利用

下記のコードでインスペクタを有効にします。
webViewのインスタンスに対する設定のため、もし複数のWebViewを利用している場合はインスペクタで確認したいWKWebViewに対してそれぞれ行う必要があります。
※iOS16.4より前のバージョンでは不要です。

インスペクタ

Safariの設定

Safariの設定で開発メニューが表示されていない場合下記の手順で開発を表示してください。
メニュー→設定→詳細たぶ→Webデベロッパ用の機能を表示
※OSにより詳細異なる場合があります。

インスペクタの利用

表示された開発メニューを選択すると下記のように接続されている端末が表示されます。

実際に対象の端末を選択するとインスペクタが開かれ、WKWebViewの表示している内容が確認できます。

さいごに

インスペクタを利用してWKWebViewの表示内容を確認する方法についてまとめました。インスペクタとCharlesでWKWebViewの内で起きていることの解析に少しでも役に立てれたらと思います。

おすすめ書籍

[改訂新版]Swift実践入門 ── 直感的な文法と安全性を兼ね備えた言語 WEB+DB PRESS plus 詳解 Swift 第4版 [改訂新版]Swiftポケットリファレンス (POCKET REFERENCE)

blog-page_footer_336




blog-page_footer_336




-iOS
-

執筆者:

免責事項

このブログは、記事上部に記載のある投稿日時点の一般的な情報を提供するものであり、投資等の勧誘・法的・税務上の助言を提供するものではありません。仮想通貨の投資・損益計算は複雑であり、個々の取引状況や法律の変更によって異なる可能性があります。ブログに記載された情報は参考程度のものであり、特定の状況に基づいた行動の決定には専門家の助言を求めることをお勧めします。当ブログの情報に基づいた行動に関連して生じた損失やリスクについて、筆者は責任を負いかねます。最新の法律や税務情報を確認し、必要に応じて専門家に相談することをお勧めします。


comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA


関連記事

Moya vs APIKit

1 はじめに2 MoyaとAPIKitの概要2.1 Githubの比較2.2 機能比較3 実装の比較3.1 リクエスト定義3.2 レスポンスstruct3.3 リクエスト送信3.4 出力結果4 さいご ...

swift

[Swift3] SwitchとEnumを使ってSectionやCellを指定する

1 はじめに1.1 環境2 Enumの用意3 Tableの用意4 Cellの返却にEnumを使用する5 さいごに はじめに どうも、はじめです。 今回はSectionやCellの指定にSwitchとE ...

iOS13で発生するUICollectionviewのカクつきを解消する

iOS13でCollectionViewの動作が少し変わりました。 Cellの入れ替え時にデータの更新を行う際にはどのように作成すれば良いか、関係のあるデリゲートを含め説明させていただいております。 おまけとして、Xcode11.3対応を行った際に対応した内容を簡単にですが記述しております。Xcode11対応をされる方の参考になればと思います。

【Xcode15】プライバシーマニフェスト対応に備えて

1 はじめに2 プライバシーマニフェストとは2.1 アプリで利用しているAPIの宣言2.2 サードパーティSDKでの PrivacyInfo.xcprivacy 対応2.3 「アプリのプライバシー」の ...

【Swift】Tesseract-OCR-iOSを使って文字の読み取り

1 はじめに2 導入準備2.1 ライブラリのインポート2.2 言語モデルのインポート2.3 カメラを利用する準備3 レイアウト作成4 カメラ撮影5 データ解析5.1 UIImageのエクステンション5 ...

フォロー

blog-page_side_responsive

2024年7月
 123456
78910111213
14151617181920
21222324252627
28293031  

アプリ情報

私たちは無料アプリもリリースしています、ぜひご覧ください。 下記のアイコンから無料でダウンロードできます。