Preview and debug on a real device

Prerequisites

Before you can preview and debug on a real device in the Mini Program IDE, ensure that your Android Mini Program has integrated this feature. For more information, see MriverDebug debug API.

Procedure

1. Open the config.json configuration file for the Mini Program IDE from the mPaaS console, and find the debug_url field.

   The following is a sample configuration file:

   {
   "login_url":"https://mappcenter.cloud.alipay.com/ide/login",
   "uuid_url":"http://cn-hangzhou-mproxy.cloud.alipay.com/switch/uuid",
   "debug_url":"wss://cn-hangzhou-mproxy.cloud.alipay.com",
   "sign":"3decfd66c2924489204b4b0f38a9c228",
   "upload_url":"https://mappcenter.cloud.alipay.com/ide/mappcenter/mds"
   }

2. Set the debug address using setWssHost and add /host/ to the end of the address, as shown in the following example.

   MriverDebug.setWssHost("wss://cn-hangzhou-mproxy.cloud.alipay.com/host/");

3. Click Preview or Real Device Debug in the upper-right corner of the IDE.

   1. The IDE generates a .zip package from the current code and uploads it to the console.

   2. The console automatically creates a publishing task, generates a QR code, and returns it to the IDE.

      Note

      The QR code may fail to generate if the whitelist is not configured correctly. For more information, see Whitelist settings.

4. Scan the QR code in the IDE using your mobile client. This action triggers the console to send the Mini Program package.

   The QR code is valid for 15 minutes. After it expires, a Refresh button appears.

5. After the mobile client receives the Mini Program package, the preview or debug interface opens on the device.

Interface description

This section describes the interfaces and parameters for previewing and debugging on a real device, along with code examples.

MriverDebug.debugAppByScan(Activity activity)

This interface lets you preview and debug a Mini Program using the built-in mPaaS scanner.

Code example

MriverDebug.debugAppByScan(MainActivity.this);

Parameter description

MriverDebug.debugAppByUri(Activity activity,Uri uri)

This interface lets you navigate to a Mini Program using a custom scanner. We recommend that you navigate to the activity of the page that launches the Mini Program.

Code example

MriverDebug.debugAppByUri(MainActivity.this,intent.getData()); 

Parameter description