Cara Remotely Debug Web Apps di Android

Pelajari cara untuk setup mesin pembangunan lokal untuk debug jarak jauh pada Android. Kami akan debugging melalui koneksi USB antara perangkat mobile dan mesin pembangunan daerah.

A+ A-

Web saat ini sedang lebih diakses di ponsel, dari pada desktop. Karena perangkat telah mendapat benar-benar portabel dan ukuran layar yang lebih kecil. Jadi, jika Anda sedang mengembangkan sebuah aplikasi web, Anda hanya tidak bisa menghindari dukungan untuk ponsel (Android atau iOS). Rusak atau jelek situs mencari di layar ponsel benar-benar dapat menyebabkan kerusakan reputasi Anda secara online. Pengalaman pengguna pada ponsel benar-benar berbeda dari desktop. Jadi pengembang harus khusus merancang aplikasi untuk beradaptasi dengan layar ponsel.

Cara Remotely Debug Web Apps di Android

Google Chrome Dev, menyediakan alat yang memungkinkan Anda memeriksa, debug, menganalisis pengalaman pada perangkat, dan Anda dapat menggunakan alat-alat Chrome Dev pada komputer lokal Anda untuk debug aplikasi Anda pada perangkat mobile. Dalam tutorial ini kita akan belajar tentang cara setup mesin pembangunan lokal Anda untuk debug jarak jauh pada Android. Kami akan debugging melalui koneksi USB antara perangkat selular dan mesin pengembangan lokal Anda.

Anda akan memerlukan berikut ini, untuk bergerak maju dengan remote debugging:

  1. Sebuah ponsel Android atau tablet dengan Chrome untuk Android 28 diinstal (Anda dapat menginstalnya dari sini ).
  2. Sebuah kabel USB untuk menghubungkan perangkat Android Anda ke mesin pembangunan daerah Anda, pastikan juga Anda memiliki drive yang diperlukan dipasang untuk menghubungkan ponsel Android ke komputer.
  3. Periksa daftar driver USB OEM dan mengetahui driver yang sesuai untuk Anda.
  4. Chrome 28+ diinstal pada mesin pembangunan daerah Anda.
  5. Pastikan Anda memiliki ekstensi ADB Chrome diinstal pada mesin pembangunan daerah Anda. Anda dapat menginstalnya dari sini .

Dalam tutorial ini kita akan menggunakan Sony Xperia L (perangkat Android), dan Windows 7 pada mesin pembangunan daerah kami. Jadi mari kita mulai dengan remote debugging:

1. Pertama pastikan Anda telah mode Debug diaktifkan pada perangkat Android Anda

Jika Anda tidak mengaktifkan silakan lihat ini:

Untuk info lebih lanjut tentang menyiapkan perangkat Android untuk pengembangan silahkan lihat: http://developer.android.com/tools/device.html#setting-up .

2. Menghubungkan perangkat Android Anda

Sekarang menghubungkan perangkat Android Anda, untuk mesin pembangunan lokal Anda dengan kabel USB. Setelah Anda terhubung perangkat Android Anda maka Anda harus mengaktifkan USB web debugging pada ponsel Anda, dengan meluncurkan Chrome di Android Anda maka, -> Settings -> alat Developer -> Pilih Aktifkan USB Debugging Web

Developers Tools Android

Ketika memilih opsi ini jika meminta Anda untuk mengkonfirmasi hubungan Anda dengan mesin pembangunan, pilih OK.

3. Debugging

Setelah menginstal ekstensi ADB, Anda akan melihat abu-abu ikon Android selain menu Chrome. Sekarang klik pada icon Android dan pilih -> Mulai ADB. Sekarang harus berubah menjadi hijau, dan akan menunjukkan jumlah perangkat yang terhubung saat ini. Kemudian klik pada icon dan pilih -> Target View Inspeksi. Ini harus membuka tab baru dan akan menunjukkan jumlah perangkat Android yang terhubung dan tab yang sedang terbuka pada mereka.

Periksa dengan Alat Pengembangan Chrome

Sekarang pilih tab dari daftar yang ingin Anda debug. Ini akan membuka jendela baru dengan Developer Tools.

Developer Tools Dashboard

Sekarang memeriksa beberapa unsur dari halaman, dan elemen akan disorot dalam ponsel Chrome, secara real time.

Disorot Element di Chrome Ponsel

Disorot Element di Chrome Ponsel Screenshot

Dengan cara ini Anda dapat memperbaiki bug tertentu perangkat, oleh debugging dari alat Dev. Anda dapat menjalankan perintah dari alat Dev yang akan dilaksanakan di ponsel Chrome. Juga melihat panel yang berbeda seperti Network, Sumber Daya, Timeline, Profil, Audit.

Jaringan

Sekarang Anda dapat memperbaiki bug tertentu mobile, dan debug ponsel aplikasi real time bukan penggelaran aplikasi di server dan kemudian mengakses dari ponsel Anda dan debugging. Google Chrome Dev memberikan alat ini yang memecahkan rasa sakit yang nyata, untuk pengembang membangun perangkat aplikasi yang kompatibel.