GithubHelp home page GithubHelp logo

kryndex / ios-webkit-debug-proxy Goto Github PK

View Code? Open in Web Editor NEW

This project forked from google/ios-webkit-debug-proxy

0.0 2.0 0.0 574 KB

A DevTools proxy (Chrome Remote Debugging Protocol) for iOS devices (Safari Remote Web Inspector).

License: BSD 3-Clause "New" or "Revised" License

Makefile 0.88% Shell 0.18% M4 0.92% C 98.02%

ios-webkit-debug-proxy's Introduction

iOS WebKit Debug Proxy

The ios_webkit_debug_proxy (aka iwdp) proxies requests from usbmuxd daemon over a websocket connection, allowing developers to send commands to MobileSafari and UIWebViews on real and simulated iOS devices.

Installation

Linux and OS X are currently supported. The fantastic ios-webkit-debug-proxy-win32 project implements Windows support.

On a Mac, it's easiest to install with homebrew:

brew install ios-webkit-debug-proxy

On Linux or Mac:

sudo apt-get install autoconf automake libusb-dev libusb-1.0-0-dev libplist-dev libplist++-dev usbmuxd libtool libimobiledevice-dev

git clone https://github.com/google/ios-webkit-debug-proxy.git
cd ios-webkit-debug-proxy

./autogen.sh
make
sudo make install

Usage

On Linux, you must run the usbmuxd daemon. The above install adds a /lib/udev rule to start the daemon whenever a device is attached. To verify that usbmuxd can list your attached device(s), run idevice_id -l

Start the simulator or device

The iOS Simulator is supported, but it must be started before the proxy. The simulator can be started in XCode, standalone, or via the command line:

# Xcode changes these paths frequently, so doublecheck them
SDK_DIR="/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs"
SIM_APP="/Applications/Xcode.app/Contents/Developer/Applications/Simulator.app/Contents/MacOS/Simulator"
$SIM_APP -SimulateApplication $SDK_DIR/iPhoneSimulator8.4.sdk/Applications/MobileSafari.app/MobileSafari

Enable the inspector

Your attached iOS devices must have โ‰ฅ1 open browser tabs and the inspector enabled via: Settings > Safari > Advanced > Web Inspector = ON

Start the proxy

ios_webkit_debug_proxy
  • --debug for verbose output.
  • --frontend to specify a frontend
  • --help for more options.
  • Ctrl-C to quit. Also, the proxy can be left running as a background process.

View and inspect debuggable tabs

Navigate to localhost:9221. You'll see a listing of all connected devices.

Click through to view tabs available on each, and click through again to open the DevTools for a tab.

Configuration

Setting the DevTools UI URL

Chrome DevTools UI used as a default frontend:

http://chrome-devtools-frontend.appspot.com/static/27.0.1453.93/devtools.html

You can use the -f argument to specify different frontend source, like Chrome's local DevTools, a local Chromium checkout or another URL:

# examples:
ios_webkit_debug_proxy -f chrome-devtools://devtools/bundled/inspector.html
ios_webkit_debug_proxy -f ~/chromium/src/third_party/WebKit/Source/devtools/front_end/inspector.html
ios_webkit_debug_proxy -f http://foo.com:1234/bar/inspector.html

If you use -f chrome-devtools://devtools/bundled/inspector.html, you won't be able to click the links shown in localhost:9222 as Chrome blocks clicking these URLs. However, you can copy/paste them into the address bar.

Just the same, you can apply the appropriate port (9222) and page (2) values below.

chrome-devtools://devtools/bundled/inspector.html?ws=localhost:9222/devtools/page/1

The -f value must end in ".html". Due to security reasons, https URLs will not work; use http or force-allow with the URL bar's shield icon. As of Chrome 45, the primary URL changed from devtools.html to inspector.html.

To disable the frontend proxy, use the --no-frontend argument.

Devtools note

In recent versions of Chrome and Safari there're major discrepancies between Chrome Remote Debugging Protocol and Apple's Remote Web Inspector service, this is why latest Chrome tools are not very functional with this utility. Maintaining compatibility of devtools is out of scope of the current project, in this regard you could find RemoteDebug/remotedebug-ios-webkit-adapter project useful. Another option is mozilla/valence remote debugging protocol adapter or Webkit devtools extracted from Webkit sources, e.g. artygus/webkit-webinspector.

Port assigment

The default configuration works well for most developers. The device_id-to-port assignment defaults to:

:9221 for the device list
:9222 for the first iOS device that is attached
:9223 for the second iOS device that is attached
...
:9322 for the max device

If a port is in use then the next available port will be used, up to the range limit.

The port assignment is first-come-first-serve but is preserved if a device is detached and reattached, assuming that the proxy is not restarted, e.g.:

  1. start the proxy
  2. the device list gets :9221
  3. attach A gets :9222
  4. attach B gets :9223
  5. detach A, doesn't affect B's port
  6. attach C gets :9224 (not :9222)
  7. reattach A gets :9222 again (not :9225)

The port assignment rules can be set via the command line with -c. The default is equivalent to:

ios_webkit_debug_proxy -c null:9221,:9222-9322

where "null" represents the device list. The following example restricts the proxy to a single device and port:

ios_webkit_debug_proxy -c 4ea8dd11e8c4fbc1a2deadbeefa0fd3bbbb268c7:9227

Troubleshooting

undefined reference to symbol 'log10@@GLIBC_2.2.5'
/usr/bin/ld: ios_webkit_debug_proxy-char_buffer.o: undefined reference to symbol 'log10@@GLIBC_2.2.5'
//lib/x86_64-linux-gnu/libm.so.6: error adding symbols: DSO missing from command line

Run this before make: ./configure LIBS="-lm"

error while loading shared libraries: libimobiledevice.so.6
ios_webkit_debug_proxy: error while loading shared libraries: libimobiledevice.so.6: cannot open shared object file: No such file or directory

Run sudo ldconfig

idevice_id not found

The idevice_id executable may be found as part of the libimobiledevice-utils package.

could not start com.apple.webinspector! success

Remove and rebuild libimobiledevice.

Could not connect to lockdownd (or doesn't work with iOS10+)

Could not connect to lockdownd. Exiting.: No such file or directory. Unable to attach inspector ios_webkit_debug_proxy

Check the device for a prompt to trust the connected computer. Choose "Trust" and try again.

Could not connect to lockdownd. Exiting.: Broken pipe. Unable to attach inspector

Please upgrade libimobiledevice to version from master and rebuild ios-webkit-debug-proxy. Upcoming 1.2.1 has many fixes but not marked for release just yet. If you're on OS X:

brew update
brew reinstall --HEAD libimobiledevice
brew reinstall -s ios-webkit-debug-proxy
Can not see Simulator
  • Make sure you started simulator before the proxy
  • Check that webinspector switch is enabled (Settings -> Safari -> Advanced -> Web Inspector)
  • Most likely simulator's web inspector daemon listens on ipv6 interface, check that you have ::1 localhost line in /etc/hosts
If no luck so far...

Lastly, always try replugging in the USB cable.

IWDP Clients

JSON-formatted APIs are provided for programmatic clients.

See the examples/README for example clients: NodeJS, C, clientside JS, websocket and more.

Design

Alt overview

View the design document for an overview of the source layout and architecture.

License and Copyright

Google BSD license https://developers.google.com/google-bsd-license Copyright 2012 Google Inc. [email protected]

The proxy uses the following open-source packages:

ios-webkit-debug-proxy's People

Contributors

artygus avatar paulirish avatar jchuong avatar pmeenan avatar vincentbernat avatar carsonmcdonald avatar tsekityam avatar sprt avatar tobli avatar ssynix avatar gingerbear avatar laguana avatar djebbz avatar auchenberg avatar nghiadhd avatar argelius avatar cyrus-and avatar addyosmani avatar

Watchers

James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.