その不具合、アプリ側かWebサイト側か？ WKWebView連携の正しい読み解き方 by Nao-RandD / ナオランド

WKWebViewを介してWebサイトと連携するiOSアプリを開発する場面では、「アプリのWebViewだけうまく動かない」「表示が崩れる」といったトラブルに遭遇することが珍しくありません。そんなとき、多くのiOSエンジニアがまずWebサイト側に原因を求めがちですが、本当にそれは正しいアプローチでしょうか？

本記事では、iOSアプリのWKWebViewを利用した実装で何が行われているのかを段階的に確認することの重要性をお伝えします。たとえば、CSSの上書きをevaluateJavaScriptから行っていると、意図せずDOM構造を壊し、レイアウト崩れや表示フリーズの原因となる場合があります。また、特定のドメインのみUser-Agentを上書きしていたり、MessageHandler経由で何か処理をしている実装があると、同じWebサイトであっても挙動が変わってしまうことがあります。

こうした点をまずアプリ側で整理・把握したうえで、その後にWebサイト側で意図しない挙動になっていないかを切り分けていくアプローチを、簡単な具体例とともに紹介します。

• アプリを再起動するとログイン状態が維持されない
• evaluateJavaScriptでCSSを上書きし、DOM構造が壊れて表示が崩れる
• User-Agentの上書きによってWebサイト側にアクセスを拒否される

「この不具合の原因はアプリ側？それともWebサイト側？」と迷ったとき、どこから調査を始めればよいかを、具体例を通じて掴んでいただければ幸いです。