スマートフォン実機でPC(Mac)と画面共有 / 検証ツールを使用する方法

いずれの方法もPCスマホ間のUSB接続が必要です。

  画面共有 開発者ツール
iOS / Safari

iPhoneの画面をMacで見る方法」

https://qiita.com/ken0nek/items/19012424e454e1bf286f

  1. QuickTimeを起動
  2. ファイル>新規画面収録を選択
  3. 録画ボタン右のメニューから「iPhone」を選択

iOSSafariのWebインスペクタを使ってみる」
 

https://www.tam-tam.co.jp/tipsnote/html_css/post12114.html

  1. iOSの設定画面で「Safari」>「詳細」の「webインスペクタ」をON
  2. MacSafariで「Safari」>「環境設定」>「詳細」の最下行「メニューバーに開発メニューを表示」をON
  3. MacSafariで「開発」>「iPhone」から見たいページを選択
iOS / Chrome

外部ソフトなしでは不可能

WeInReというソフトを使えば出来る?(未確認)

"iOS Remote Debugging"

https://stackoverflow.com/questions/11262236/ios-remote-debugging/22047495#22047495

Android / Chrome

AndroidChrome で開発者ツールを使う方法」
 

https://qiita.com/hojishi/items/12b726f8b02ef3d713e4

  1. 設定 > 開発者向けオプション > USBデバッグ にチェック

  2. 開発者向けオプションが表示されていなければ、 設定 > 端末情報 > ビルド番号 を連打して表示させる

  3. PCのChromeで chrome://inspect/#devices を開く

  4. Devices の下にある Discover USB devices にチェックを入れる

  5. PC の ChromeAndroid で表示しているサイトURLが表示され、下にある inspect をクリックすると開発者ツールが表示される