UC Browser Developer Edition debug Phone page

Source: Internet
Author: User

1 About RI

Currently, using a browser to access a webpage on a mobile phone does not make it easy to debug the page language. Mobile phone screen is relatively small and inconvenient to operate, directly on the phone web data debugging is not very realistic.

Therefore, we use technology to separate the debugging information of the mobile phone, and realize a development tool--remoteinspector (RI) that can be used to debug a small screen and a low-profile mobile browser on a large screen and a high-profile PC.

1.1 Main functions

Android Platform UC Browser Developer Edition, mainly supports the following features:

    • Dom View and modify
    • JavaScript debugging, CSS debugging
    • Network Status View
    • Resource File View
    • Console Console
2 Preparation Work 2.1 mobile phone side

Go to the UC official website Developer Center (website address), download the Android platform UC Browser developer version, install to the phone.

2.2 PC Side

PC and install Chrome or Safari on your PC (Chrome is recommended). Supports CHROME15–CHROME21, as well as Safari5.1.4 or later versions.

Download the ADB tool into your PC.

2.3 Connecting your phone to your PC

Android Platform UC Browser Developer Edition, remote debugging supports two modes of USB connection, Wi-Fi connection. For Mac Platform Please refer to: User manual for UC browser developer (Android platform). pdf

    • Wi-Fi Connection mode

      Wi-Fi mode, make sure the phone and PC are in the same wireless network segment.

    • USB connection Mode

      USB connection mode requires a ANDROIDSDK development environment or the installation of ADB tools.

        //附Windows操作系统上的adb安装参考  1)在PC上,通过网络下载安装豌豆荚(Android手机助手);  2)在手机上打开USB调试模式:  设置>应用程序>开发>USB调试

        3)连接手机与PC,若PC无手机驱动,豌豆荚会自动下载驱动并安装;  4)将手机与PC连接,能被豌豆荚识别则为正常连接  5)将adb_tool.zip解压到C:\WINDOWS\system32目录下  6)开始>运行>输入cmd.exe进入Windows命令提示符窗口,输入adb,   如果无错误提示,并能够看到”AndroidDebugBridgeversion1.0.26”的提示,则表明adb安装成功

      After setting up the ANDROIDSDK development environment or installing the ADB tools, port mapping is done through the ADB command.

        在Windows命令提示符窗口(cmd.exe)运行:adbforwardtcp:9998tcp:9998
3 Debug mode

Launch the UC Browser developer version on your phone and open the page you want to debug. Open Chrome or Safari on your PC

    • If Wi-Fi connection mode, then enter in the Address bar: Phone ip+:9998

      example, the phone IP is 192.168.112.244, then enter 192.168.112.244:9998. At this point, the UC Browser developer version of the phone will pop up a dialog box, as follows:

      Select OK to allow debugging.

    • In the case of USB connection mode, type in the Address bar: http://localhost:9998

      Once you have successfully accessed the URL, you will see the Open index page for the UC Browser developer version:

      Next, click on any page you want to debug to debug. The debugging method is similar to the debugging method for Chrome or Safari developer Tools on your PC. Take the UC product download station as an example and click on the Debug page:

      When a Web page of the UC browser developer is debugged by a remote browser, the system notification bar displays the wrench icon, prompting the UC browser-debug mode to open, indicating that the current phone page is in the debug state.

      All the work is ready and then you can go into the commissioning phase.

UC Browser Developer Edition debug Phone page

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.