Remote debugging of mobile Web pages using Weinre (Nodejs, PhoneGap)

This debug mode requires WiFi environment and WebKit browser.

Weiner Home: http://people.apache.org/~pmuellr/weinre/docs/latest/Home.html

First, configure the debug server

(a), Nodejs build Debug Server (take Windows as an example)
1. Install node. js
Installer Download: http://nodejs.org/#download
This article is installed in the "f:/nodejs/" directory.

2, test the installation is successful
Open cmd and switch to the installation directory where Nodejs is located. Enter the following command to test whether node. js and NPM are installed successfully. The default Windows latest installation package, which contains NPM, is installed manually if NPM is not installed.

C:\users\jason>F:F:\>cd nodejsf:\nodejs>-vv0 . 10.0F:\nodejs>-v1.2.                    - 

3. Install weinre using NPM and enter the following command in the node. JS installation directory

NPM Install Weinre

4. Start Weinre Server

Node.       --All-

Under Windows, the System firewall may pop up the prompt to allow it to access the network, click to fill.

5. Browser Open

http://localhost:8080

If the access is normal, the server is configured successfully.

(ii), direct use of PhoneGap Debug server
If you feel the server configuration is troublesome, you can also use PhoneGap ready-made debug server.
PhoneGap Debug Server address: http://debug.phonegap.com/(equivalent to native installed http://localhost:8080)

Second, weinre use method
1, need to debug the page added JS script
Such as:

<scriptsrc="http ://Your debug server/target/target-script-min. " JS#anonymous"></script>          

1.1 Use the harvesting clip to quickly add a debug script to the page you want to debug.
Add the following code to the bookmark, access the page to be debugged, access the bookmark, that is, you can add the debug script through JS to the current page, but some browsers do not support!

Javascript:(function(e) {e. Setattribute ( "src" , "HTTP//Your debug server address/ Target/target-script-min.js#anonymous "); document. ( "body" ) [0 appendchild (edocument. Createelement "script" 0         

2. Open the console using the WebKit browser on the PC side

http://10.18.252.111:8080/client/#anonymous

#后面为识别码

Tips: The identification code is used only to identify multiple items that need to be debugged and is available for multi-user operation.

In the console, you can easily debug the mobile Web page!

Remote debugging of mobile Web pages using Weinre (Nodejs, PhoneGap)