Saya mengembangkan aplikasi web yang menggunakan PhoneGap: Build untuk versi seluler dan ingin memiliki satu basis kode untuk 'versi desktop' dan seluler. Saya ingin dapat mendeteksi apakah panggilan PhoneGap akan berfungsi (yaitu, apakah pengguna di perangkat seluler yang akan mendukung PhoneGap).
Saya telah mencari dan tidak percaya tidak ada cara sederhana untuk melakukan ini. Banyak orang telah memberikan saran;
- http://www.sencha.com/forum/showthread.php?144127-Checking-if-running-in-PhoneGap-or-Mobile-Web-Browser
- http://groups.google.com/group/phonegap/browse_thread/thread/322e80bd41bb1a54/a421300eb2a2029f?lnk=gst&q=detect+desktop#a421300eb2a2029f
- http://groups.google.com/group/phonegap/browse_thread/thread/8a95dfeb0f313792/3ff10d8f35211739?lnk=gst&q=detect+desktop+browser#3ff10d8f35211739
Tidak ada yang berfungsi, kecuali Anda menghapus file Javascript PhoneGap dari versi desktop aplikasi, yang mengalahkan tujuan saya untuk memiliki satu basis kode.
Sejauh ini, satu-satunya solusi yang saya temukan adalah mengendus peramban / agen pengguna, tetapi ini tidak kuat untuk sedikitnya. Solusi yang lebih baik diterima!
EDIT: Solusi yang sedikit lebih baik adalah mencoba memanggil fungsi PhoneGap setelah beberapa waktu tunggu sebentar - jika tidak berhasil, anggaplah pengguna menggunakan browser web desktop.
sumber
Jawaban:
Saya menggunakan kode ini:
MEMPERBARUI
Ada banyak cara lain untuk mendeteksi apakah phonegap berjalan di browser atau tidak, berikut ini pilihan bagus lainnya:
seperti yang terlihat di sini: Mendeteksi antara browser seluler atau aplikasi PhoneGap
sumber
Saya menulis posting tentang itu beberapa hari yang lalu. Ini adalah solusi terbaik yang dapat Anda temukan (sampai PhoneGap akan merilis sesuatu, mungkin atau mungkin tidak), ini singkat, sederhana dan sempurna (saya telah memeriksanya dengan segala cara dan platform yang memungkinkan).
Fungsi ini akan berfungsi untuk 98% kasus.
Untuk menyelesaikan 2% kasus lainnya, ikuti langkah-langkah berikut (ini melibatkan sedikit perubahan pada kode native):
Buat file bernama __phonegap_index.html , dengan sumber:
Sekarang, di native cukup ubah halaman awal dari index.html ke __phonegap_index.html di semua platform PhoneGap Anda. Katakanlah nama proyek saya adalah contoh , file yang perlu Anda ubah adalah (seperti untuk PhoneGap versi 2.2.0):
CordovaLibApp/AppDelegate.m
src/org/apache/cordova/example/cordovaExample.java
example/package.appxmanifest
www/config.xml
framework/appinfo.json
src/WebForm.cpp
(baris 56)Terakhir, Anda dapat menggunakannya di mana saja di situs Anda, apakah itu berjalan di PhoneGap atau tidak:
Semoga membantu. :-)
sumber
/^file:\/{3}[^\/]/i.test(window.location.href)
tetapi kami menggunakan PhoneGap, misalnya saat memuat index.html dari halaman lain, di config.xml sesuatu seperti ini<content src="http://10.100.1.147/" />
(cordova || PhoneGap || phonegap)
akan memunculkan ReferenceError jika salah satu variabel tersebut tidak ditentukan. Anda harus mengujinyatypeof cordova !== undefined
, bukan?return ( typeof cordova !== undefined || typeof PhoneGap !== undefined || typeof phonegap !== undefined )
ReferenceError
lagi karenawindow
awalan). Hanya berpikir saya akan menunjukkan ini, karena ini sebenarnya membuat rantai komentar ketinggalan jaman (dan karenanya, tidak benar).Saya tahu ini telah dijawab beberapa waktu yang lalu tetapi "PhoneGap.available" tidak ada lagi. Kamu harus menggunakan:
atau sejak 1.7, lebih suka:
EDIT 2019: seperti yang dikatakan di komentar, ini hanya berfungsi jika Anda tidak menyertakan cordova lib ke dalam build browser desktop Anda. Dan tentu saja merupakan praktik yang baik untuk hanya menyertakan file javascript / html / css minimum yang ketat untuk setiap perangkat yang Anda targetkan
sumber
Cara paling tepercaya yang kami temukan untuk mengetahui apakah kita berada dalam aplikasi cordova / phonegap adalah dengan memodifikasi agen pengguna aplikasi cordova menggunakan konfigurasi AppendUserAgent ini .
Di
config.xml
tambahkan:Kemudian hubungi:
Mengapa?
window.cordova
dandocument.addEventListener('deviceready', function(){});
tunduk pada ketentuan balapannavigator.standalone
tidak berfungsi ketika<content src="index.html" />
sebuah situs web (Mis:<content src="https://www.example.com/index.html" />
atau dengan cordova-plugin-remote-injection )sumber
Cordova AppName/v0.0.1
<3 Jadi dengan cara ini, Anda bahkan dapat menggunakan ini untuk pelacakan (tetapi perhatikan bahwa siapa pun dapat mengubah agen penggunanya jadi jangan mengandalkan ini untuk verifikasi penting keamanan)Saya pikir ini paling sederhana:
var isPhoneGap = (location.protocol == "file:")
EDIT Untuk beberapa orang yang tidak berhasil. Maka Anda mungkin mencoba (belum diuji)
sumber
var isPhoneGap = ! /^http/.test(document.location.protocol)
Ini berfungsi untuk saya (menjalankan 1.7.0)
Diuji di Chrome desktop dan Safari.
sumber
Seperti poster asli, saya menggunakan layanan pembuatan peta telepon. Setelah dua hari dan hampir 50 uji coba, saya telah menemukan solusi elegan yang cocok untuk saya.
Saya tidak dapat menggunakan pengendusan UA karena saya ingin menguji dan menjalankannya di browser seluler. Saya awalnya memilih teknik yang cukup fungsional cobberboy. Ini tidak berhasil untuk saya karena penundaan / waktu tunggu "howPatientAreWe: 10000" terlalu mengganggu pengembangan dalam browser. Dan menyetelnya lebih rendah terkadang akan gagal dalam pengujian dalam mode aplikasi / perangkat. Pasti ada cara lain ...
Layanan build phonegap mengharuskan
phonegap.js
file dihilangkan dari repositori kode Anda sebelum mengirimkan file aplikasi Anda ke layanan. Oleh karena itu saya dapat menguji keberadaannya untuk menentukan apakah berjalan di browser vs. aplikasi.Satu peringatan lain, saya juga menggunakan jQueryMobile, jadi baik jQM dan phonegap harus diinisialisasi sebelum saya dapat memulai pembuatan skrip khusus. Kode berikut ditempatkan di awal file index.js kustom saya untuk aplikasi (setelah jQuery, sebelum jQM). Juga dokumen phonegap build mengatakan untuk ditempatkan
<script src="phonegap.js"></script>
di suatu tempat di HTML. Saya meninggalkannya sepenuhnya dan memuatnya menggunakan $ .getScript () untuk menguji fasilitas keberadaannya.sumber
Menariknya, ada banyak jawaban, tetapi tidak menyertakan tiga opsi ini:
1 - Cordova.js akan mengatur objek cordova dalam lingkup global. Jika ada maka kemungkinan besar Anda menjalankan dalam lingkup Cordova.
2 - Cordova akan menjalankan aplikasi Anda seperti Anda membuka dokumen HTML dari Desktop Anda. Alih-alih protokol HTTP, ia akan menggunakan FILE. Mendeteksi ini akan memberi Anda kesempatan untuk berasumsi bahwa aplikasi Anda dimuat secara lokal.
3 - Gunakan peristiwa pemuatan skrip cordova untuk mendeteksi konteksnya. Termasuk skrip dapat dengan mudah dihapus dalam proses pembangunan atau pemuatan skrip hanya akan gagal di browser. Sehingga variabel global ini tidak akan disetel.
Kredit diberikan kepada Damien Antipa dari Adobe
sumber
Saya menggunakan metode ini:
debug
akan adatrue
di lingkungan browser,false
di perangkat.sumber
Ini tampaknya layak dan saya telah menggunakannya dalam produksi:
Sumber: http://tqcblog.com/2012/05/09/detecting-phonegap-cordova-on-startup/
sumber
Inti dari masalahnya adalah selama cordova.device tidak ditentukan, kode Anda tidak dapat memastikan apakah itu karena cordova telah menetapkan bahwa perangkat Anda tidak didukung, atau jika itu karena cordova masih mempersiapkan dirinya sendiri dan perangkat akan menyala nanti (atau opsi ketiga: cordova tidak dimuat dengan benar).
Satu-satunya solusi adalah menentukan masa tunggu, dan memutuskan bahwa setelah jangka waktu ini kode Anda harus menganggap perangkat tidak didukung. Saya berharap cordova akan menetapkan parameter di suatu tempat untuk mengatakan "Kami telah mencoba menemukan perangkat yang didukung dan menyerah" tetapi sepertinya tidak ada parameter seperti itu.
Setelah ini dibuat, Anda mungkin ingin melakukan sesuatu yang spesifik dengan tepat dalam situasi di mana tidak ada perangkat yang didukung. Seperti menyembunyikan tautan ke pasar aplikasi perangkat, dalam kasus saya.
Saya telah menggabungkan fungsi ini yang seharusnya mencakup hampir semua situasi. Ini memungkinkan Anda menentukan penangan perangkat, penangan yang tidak pernah siap perangkat, dan waktu tunggu.
sumber
Cara saya melakukannya adalah menggunakan variabel global yang ditimpa oleh cordova.js versi khusus browser. Di file html utama Anda (biasanya
index.html
), saya memiliki skrip berikut yang bergantung pada pesanan:Dan di dalamnya
cordova.js
saya hanya memiliki:Saat membuat untuk perangkat seluler, cordova.js tidak akan digunakan (dan sebagai gantinya file cordova.js khusus platform akan digunakan), jadi metode ini memiliki keuntungan 100% benar terlepas dari protokol, agen pengguna, atau pustaka variabel (yang dapat berubah). Mungkin ada hal lain yang harus saya sertakan di cordova.js, tapi saya belum tahu apa itu.
sumber
if ( typeof __cordovaRunningOnBrowser__ !== 'undefined' ) { stuff(); }
?Cara lain, berdasarkan solusi SlavikMe:
Cukup gunakan parameter kueri yang diteruskan ke
index.html
dari sumber PhoneGap Anda. Yaitu, di Android, bukanmenggunakan
SlavikMe memiliki daftar bagus tentang tempat melakukan ini di platform lain.
Maka Anda
index.html
cukup melakukan ini:sumber
<content src="index.html" />
opsi di file config.xml menjadi<content src="index.html?cordova=1" />
. Sejauh ini tampaknya berfungsi dan sejauh ini merupakan solusi terbaik yang disarankan di sini.Untuk mempertahankan satu basis kode, yang menarik adalah "platform" tempat kode dijalankan. Bagi saya, "platform" ini bisa terdiri dari tiga hal yang berbeda:
Cara untuk memeriksa platform:
catatan:
Ini harus dijalankan hanya setelah cordova.js dimuat (body onload (...), $ (document) .ready (...))
'ontouchstart' di document.documentElement akan hadir di laptop dan monitor desktop yang memiliki layar sentuh aktif sehingga akan melaporkan browser seluler meskipun itu adalah desktop. Ada berbagai cara untuk melakukan pemeriksaan yang lebih tepat tetapi saya menggunakannya karena masih menangani 99% kasus yang saya butuhkan. Anda selalu dapat mengganti baris itu dengan sesuatu yang lebih kuat.
sumber
typeof cordova !== 'undefined'
alih-alih memancing untuk pengecualian.Aarons, coba
sumber
Solusi GeorgeW tidak apa-apa, tetapi bahkan pada perangkat nyata, PhoneGap.available hanya berlaku setelah hal-hal PhoneGap dimuat, misalnya onDeviceReady di document.addEventListener ('deviceready', onDeviceReady, false) telah dipanggil.
Sebelum itu, jika Anda ingin tahu, Anda bisa melakukan seperti ini:
Solusi ini mengasumsikan bahwa sebagian besar pengembang mengembangkan menggunakan Chrome atau Firefox.
sumber
Saya memiliki masalah yang sama.
Saya cenderung menambahkan # cordova = true ke URL yang dimuat oleh klien cordova dan menguji location.hash.indexOf ("cordova = true")> -1 di halaman web saya.
sumber
Berikut ini bekerja untuk saya dengan PhoneGap / Cordova (2.1.0) terbaru.
Bagaimana itu bekerja:
Keuntungan:
Kekurangan:
==
Buat proyek PhoneGap kosong baru. Dalam contoh index.js yang diberikan, ganti variabel "app" di bagian bawah dengan ini:
sumber
Saya tersandung pada masalah ini beberapa bulan yang lalu ketika memulai aplikasi kami, karena kami ingin aplikasi juga "
browser-compatible
" (dengan pemahaman bahwa beberapa fungsi akan diblokir dalam skenario itu: rekaman audio, kompas, dll.).Satu-satunya
100%
(dan saya bersikeras pada kondisi 100-ratus persen) untuk PRA-menentukan konteks eksekusi aplikasi adalah ini:menginisialisasi variabel "flag" JS menjadi true, dan mengubahnya menjadi false ketika dalam konteks semua web;
oleh karena itu Anda dapat menggunakan panggilan seperti "
willIBeInPhoneGapSometimesInTheNearFuture()
" (itu PRE-PG, tentu saja Anda masih memerlukan metode POST-PG untuk memeriksa apakah Anda dapat memanggil PG API, tetapi yang itu sepele).Kemudian Anda berkata: "
but how do you determine the execution context
?"; jawabannya adalah: "Anda tidak" (karena menurut saya Anda tidak dapat diandalkan, kecuali orang-orang brilian di PG akan melakukannya dalam kode API mereka);Anda menulis skrip build yang melakukannya untuk Anda: satu basis kode dengan dua varian.
sumber
Tidak benar - benar jawaban atas pertanyaan tersebut, tetapi ketika saya mengujinya di browser desktop, saya baru saja menetapkan nilai penyimpanan lokal untuk membuat browser memuat aplikasi meskipun perangkat tidak menyala.
sumber
Pilihan lain adalah menggunakan folder gabungan , lihat gambar di bawah.
Anda dapat menambahkan file khusus platform / mengganti file default.
(itu harus melakukan trik dalam beberapa skenario)
Dengan kata lain: Daripada mendeteksi browser, Anda hanya tidak menyertakan file tertentu untuk desktop membangun / melampirkan file tertentu untuk iOS saja.
sumber
Deteksi browser desktop meskipun perangkat emulasi aktif
Bekerja di mesin Windows dan Mac. Perlu menemukan solusi untuk linux Lihat detailnya
sumber
Saya sebenarnya telah menemukan kombinasi dari dua teknik yang tercantum di sini telah bekerja paling baik, pertama periksa apakah cordova / phonegap dapat diakses juga periksa apakah perangkat tersedia. Seperti:
sumber
Coba pendekatan ini:
sumber
Saya menggunakan kombinasi dari apa yang disarankan oleh GeorgeW dan mkprogramming :
sumber
Saya kira dalam beberapa hal mereka tidak begitu berbeda, bukan? Ha Ha ... tidak lucu. Siapa yang tidak mengira ini tidak akan menjadi masalah? Inilah solusi paling sederhana untuk pertimbangan Anda. Dorong file yang berbeda ke server Anda lalu lakukan ke PhoneGap. Saya juga akan menggunakan http: cek yang disarankan di atas untuk sementara.
Ketertarikan saya adalah mendorong navbar browser ke atas, jadi saya benar-benar dapat menghapus tag skrip yang terisolasi dan menekan rekondisi [dalam DW] (toh akan tetap ada pembersihan untuk penerapan sehingga ini bisa menjadi salah satu tugas tersebut.) Pokoknya saya rasa ini adalah pilihan yang baik (mengingat tidak banyak lagi yang tersedia) untuk secara efisien mengomentari hal-hal secara manual dengan isMobileBrowserAndNotPhoneGap saat mendorong ke PG). Sekali lagi untuk saya dalam situasi saya, saya hanya akan menghapus tag untuk file (kode terisolasi) yang mendorong bilah navigasi saat itu adalah browser seluler (itu akan jauh lebih cepat dan lebih kecil). [Jadi ya, jika Anda dapat mengisolasi kode untuk solusi manual yang dioptimalkan itu.]
sumber
Sedikit dimodifikasi, tetapi berfungsi dengan sempurna untuk saya tanpa masalah apa pun.
Maksudnya adalah memuat Cordova hanya saat di perangkat yang disematkan, bukan di desktop, jadi saya sepenuhnya menghindari cordova di browser desktop. Pengujian dan pengembangan UI dan MVVM dan karenanya sangat nyaman.
Letakkan kode ini misalnya. dalam file cordovaLoader.js
Kemudian alih-alih menyertakan javascript cordova itu sendiri, sertakan cordovaLoader.js
Kemudahan pekerjaan Anda! :)
sumber
sumber
Sekadar info caranya di PhoneGap 3.x Mobile Application Development Hotshot
dan dalam kerangka YASMF
https://github.com/photokandyStudios/YASMF-Next/blob/master/lib/yasmf/util/core.js#L152
sumber
Saya mencoba dengan objek jendela tetapi tidak berhasil karena saya membuka url jarak jauh di InAppBrowser. Tidak bisa menyelesaikannya. Jadi cara terbaik dan termudah untuk mencapainya adalah dengan menambahkan string ke url yang perlu Anda buka dari aplikasi phonegap. Kemudian periksa apakah lokasi dokumen memiliki string yang ditambahkan padanya.
Anda akan melihat string ditambahkan ke url "#phonegap". Jadi di url domain tambahkan script berikut
sumber