Mobile Platform as a Service:Quick Start

Prasyarat

• Jika menggunakan metode integrasi native AAR, Anda harus terlebih dahulu menyelesaikan langkah-langkah dalam Add mPaaS to your project.

• Jika menggunakan metode integrasi berbasis komponen, Anda harus terlebih dahulu menyelesaikan Alur integrasi berbasis komponen.

Add the SDK

Native AAR

Untuk menginstal komponen H5 Container di proyek Anda, gunakan AAR Component Management. Untuk informasi selengkapnya, lihat AAR component management.

Component-based

Instal komponen H5 Container di proyek Portal dan Bundle menggunakan Component Management. Untuk informasi selengkapnya, lihat Mengelola dependensi komponen.

Initialize mPaaS

Jika menggunakan metode integrasi native AAR, Anda harus menginisialisasi mPaaS. Untuk melakukannya, tambahkan kode berikut ke kelas Application Anda:

public class MyApplication extends Application {
    
    @Override
    public void onCreate() {
        super.onCreate();
        // Initialize mPaaS
        MP.init(this);    
    }
}

Untuk informasi selengkapnya, lihat Initialize mPaaS.

Configure the miniapp package request interval

mPaaS memungkinkan Anda mengonfigurasi interval permintaan untuk paket miniapp, baik secara global maupun per paket.

• Global configuration: Di proyek Android Anda, buat file custom_config.json di path assets/config. Tambahkan konten berikut ke file tersebut:

  {
  "value": "{\"config\":{\"al\":\"3\",\"pr\":{\"4\":\"86400\",\"common\":\"864000\"},\"ur\":\"1800\",\"fpr\":{\"common\":\"3888000\"}},\"switch\":\"yes\"}",
  "key": "h5_nbmngconfig"\
  }

  Parameter "ur":"1800" menetapkan interval pembaruan global dalam satuan detik. Nilai default-nya adalah 1800. Anda dapat mengubah nilai ini untuk mengonfigurasi interval permintaan paket offline global. Rentang nilai yang valid adalah 0 hingga 86400 (setara dengan 24 jam). Nilai 0 menunjukkan tidak ada batasan pada interval permintaan.

  Penting

  Jangan ubah parameter lainnya.

• Individual configuration: Konfigurasi ini berlaku untuk paket miniapp tertentu. Di Konsol, navigasikan ke Add Offline Package > Extension Info dan masukkan {"asyncReqRate":"1800"} untuk menetapkan interval permintaan. Untuk informasi selengkapnya, lihat bagian Extension Info dalam Create an H5 offline package.

Untuk memverifikasi bahwa konfigurasi interval permintaan telah diterapkan, buka proyek yang telah terintegrasi dengan paket offline H5. Filter log logcat menggunakan kata kunci H5BaseAppProvider. Konfigurasi berhasil jika Anda melihat entri log berikut.

lastUpdateTime: xxx updateRate: xxx

Use the SDK

Kontainer H5 mPaaS Nebula menyediakan kelas antarmuka terpadu MPNebula untuk mengelola operasi Kontainer H5 dan paket offline. Prosedur pemanggilannya sebagai berikut:

1. Jalankan paket offline H5.

   • Jalankan paket offline:

     /**
     * Starts an offline package.
     *
     * @param appId The offline package ID.
     */
     public static void startApp(String appId);

   • Jalankan paket offline dengan parameter startup:

     /**
     * Starts an offline package.
     *
     * @param appId  The offline package ID.
     * @param params The startup parameters.
     */
     public static void startApp(String appId, Bundle params);

2. Jalankan halaman online.

   • Jalankan halaman online:

     /**
     * Starts an online URL.
     *
     * @param url The online URL.
     */
     public static void startUrl(String url)

   • Jalankan halaman online dengan parameter startup:

     /**
     * Starts an online URL.
     *
     * @param url   The online URL.
     * @param param The startup parameters.
     */
     public static void startUrl(String url, Bundle param);

3. Tetapkan UserAgent kustom.

   1. Pertama, implementasikan penyedia User Agent (UA) seperti di bawah ini:

      public class H5UaProviderImpl implements H5UaProvider {
      @Override
      public String getUa(String defaultUaStr) {
       // Do not modify defaultUaStr or return a result that does not contain defaultUaStr.
       return defaultUaStr + " AlipayClient/mPaaS"; 
      }
      }

   2. Kemudian, panggil API untuk menetapkan UA:

      /**
      * Sets the UA.
      *
      * @param uaProvider The UA provider. The developer must implement the getUa method.
      */
      public static void setUa(H5UaProvider uaProvider)

   3. Konfigurasikan sebagai berikut:

      MPNebula.setUa(new H5UaProviderImpl());

4. Tetapkan tampilan kontainer kustom.

   Kontainer menyediakan metode untuk menetapkan bilah judul kustom, bilah navigasi, header pull-to-refresh, dan layout host WebView. Untuk implementasi spesifik, lihat contoh kode untuk Kontainer H5 dan paket offline dengan metode integrasi AAR di Get code samples.

   1. Pertama, implementasikan penyedia tampilan seperti di bawah ini:

      public class H5ViewProviderImpl implements H5ViewProvider {
      @Override
      public H5WebContentView createWebContentView(Context context) {
       // Return a custom WebView host layout here. If null is returned, the default view is used.
       return null;
      }
      
      @Override
      public H5TitleView createTitleView(Context context) {
       // Return a custom title bar here. If null is returned, the default view is used.
       return null;
      }
      
      @Override
      public H5PullHeaderView createPullHeaderView(Context context, ViewGroup viewGroup) {
       // Return a custom pull-to-refresh header here. If null is returned, the default view is used.
       return null;
      }
      
      @Override
      public H5NavMenuView createNavMenu() {
       // Return a custom navigation menu here. If null is returned, the default view is used.
       return null;
      }
      }

   2. Kemudian, panggil antarmuka untuk menetapkan tampilan:

      /**
      * Sets custom container-related views, such as the title bar, menu bar, web layout, and pull-to-refresh view.
      * @param viewProvider The custom view provider.
      */
      public static void setCustomViewProvider(H5ViewProvider viewProvider);

   3. Jalankan prosedur penyetelan:

      MPNebula.setCustomViewProvider(new H5ViewProviderImpl());

      Catatan

      Untuk menetapkan bilah judul kustom, Anda harus terlebih dahulu menyetel nama bundle. Jika tidak, sumber daya yang diperlukan mungkin tidak ditemukan.

      // You must set the bundle name where the title bar resources are located. If you do not set it, the resources cannot be loaded and the title bar will not take effect.
      H5Utils.setProvider(H5ReplaceResourceProvider.class.getName(), new H5ReplaceResourceProvider() {
      @Override
      public String getReplaceResourcesBundleName() {
       return BuildConfig.BUNDLE_NAME;
      }
      });
      MPNebula.setCustomViewProvider(new H5ViewProviderImpl());

5. Sisipkan tampilan kontainer tunggal ke dalam halaman.

   Anda dapat menyisipkan halaman H5 sebagai tampilan di dalam kontainer. Pilih salah satu metode berikut sesuai kebutuhan—metode sinkron atau asinkron tersedia.

   • Synchronous method

     /**
     * Gets the view of the H5 container.
     *
     * @param activity The page context.
     * @param param    The startup parameters, which can include an appid or a URL.
     * @return The view of the H5 container.
     */
     public static View getH5View(Activity activity, Bundle param);

   • Asynchronous method

     /**
     * Asynchronously gets the view of the H5 container.
     *
     * @param activity            The page context.
     * @param param               The startup parameters, which can include an appid or a URL.
     * @param h5PageReadyListener The asynchronous callback.
     */
     public static void getH5ViewAsync(Activity activity, Bundle param, H5PageReadyListener h5PageReadyListener);

     Catatan

     • Sebelum menyisipkan kontainer menggunakan metode sinkron atau asinkron, peroleh informasi paket offline yang sesuai.

     • Metode asinkron tidak menggunakan thread utama dan tidak memengaruhi performa.