क्या कॉर्डोबा ऐप्स को डिबग करने के लिए एक वास्तविक समाधान है [बंद]


130

मैंने पिछले दो दिन बिताए कि यह पता लगाने की कोशिश कर रहा हूं कि मैंने कॉर्डोवा 3.2 का उपयोग करके बनाए गए HTML5 ऐप को कैसे डिबग किया और एंड्रॉइड 2.3 डिवाइस पर तैनात किया। मेरे द्वारा देखे गए सभी लेख / पोस्ट वास्तविक समाधानों के बजाय हैक प्रदान करते हैं :( और ज्यादातर समय, उनमें से कोई भी मेरे मामले के लिए काम नहीं करता है, मेरे ऐप के अंदर सीएसएस शैलियों और एंगुलरज कोड को डीबग करें।)

अब तक मैंने परीक्षण किया;

debug.phonegap.com

मैंने स्क्रिप्ट को index.htmlफ़ाइल में इंजेक्ट किया और फिर debug.phonegap.com में जनरेट किए गए URL पर गया, लेकिन कुछ नहीं हुआ; केवल एक खाली पृष्ठ।

Weinre

अधिकांश लेख मुझे अप्रचलित जीथब रिपॉजिटरी की ओर इशारा करते हैं जो एक जार फ़ाइल को गिनते हैं .. लेकिन यह नहीं मिली है :(

किनारे का निरीक्षण

यह काम करता है और दिखाता है कि मोबाइल के अंदर पीसी पर मैं जिस वेबपेज को ब्राउज़ कर रहा हूं .. लेकिन समस्या यह है कि यह फोनगैप ऐप्स चलाने वाले की तुलना में कुछ अन्य एकीकृत ब्राउज़र (या एमुलेटर) का उपयोग करता है; इसलिए परिणाम सटीक नहीं हैं।

क्रोम एमुलेटर

एज निरीक्षण के रूप में भी; यह वास्तविक वेब-किट v530 को देखने की अनुमति नहीं देता है जिसे Android 2.3 के साथ भेज दिया गया है।

सपना समाधान

सही समाधान Google Chrome (डेस्कटॉप) का विस्तार होगा जो आपको डेस्कटॉप ब्राउज़र को एंड्रॉइड 2.3 प्लेटफार्मों में पाए जाने वाले एक ही पर स्विच करने में सक्षम बनाता है; कोई एमुलेशन नहीं हैक्स, सिर्फ वेब-किट v 530 के साथ ही ब्राउज़र।

दुर्भाग्य से इस तरह के समाधान मौजूद नहीं है :( या मैं गलत हूँ?

कोई सुझाव?


जवाबों:


139

एंड्रॉयड के लिए:

आपको केवल अपने एंड्रॉइड डिवाइस के भीतर "यूएसबी रिमोट डीबगर" को सक्षम करने और यूएसबी केबल के साथ प्लग करने की आवश्यकता है। फिर डिवाइस में अपना एप्लिकेशन खोलें। Chrome दूरस्थ ब्राउज़र का पता लगाएगा और आप कंसोल को उसी तरह से देख सकते हैं जैसे आप स्थानीय रूप से Chrome का उपयोग करते समय देखते हैं।

इस लिंक का उपयोग करें: chrome://inspect/#devices क्रोम ब्राउज़र में (आपको इसे बार बार में पेस्ट करना होगा)।

यदि आपका ऐप डिवाइस में क्रैश हो जाता है, तो आपको केवल अपने ब्राउज़र में कंसोल के लॉग को देखने की जरूरत है और देखें कि क्या होता है। आप कार्यक्षमता भी जोड़ सकते हैं, चर बदल सकते हैं और फ़ंक्शन को उसी तरह से ओवरराइड कर सकते हैं जैसे हम अपने स्थानीय ब्राउज़र से करते हैं।

इस लेख को पढ़ेंअधिक जानकारी के लिए को ।

यह केवल एंड्रॉइड 4.4+ पर चलने वाले उपकरणों के साथ काम करेगा।

IOS के लिए:

IOS के लिए Safari का उपयोग करें, इन चरणों का पालन करें:

1. अपने iOS डिवाइस में वेब इंस्पेक्टर को सक्षम करने के लिए Settings> Safari> Advanced> Web Inspector पर जाएं

2.Of सफारी आपके iOS डिवाइस पर।

3. USB के माध्यम से इसे अपने कंप्यूटर से कनेक्ट करें।

4.Open सफारी आपके कंप्यूटर पर।

5. सफारी के मेनू में, डेवलप पर जाएं और, अपने डिवाइस के नाम की तलाश करें।

6. उस टैब को चुनें जिसे आप डीबग करना चाहते हैं।

यहाँ छवि विवरण दर्ज करें


3
मैं अपने कंप्यूटर पर कंसोल और मेरे ऐप को क्रोम में देख सकता हूं, जबकि मेरा स्मार्टफोन यूएसबी के माध्यम से जुड़ा हुआ है। बहुत अच्छा समाधान।
एमिली ज़वादज़की

जब तक मैं भागा नहीं, यह मेरा फोन नहीं मिला adb start-server
ल्यूकिप

@Leukipp मैं भी इसी समस्या का सामना कर रहा हूं, लेकिन इसके बाद अपने विंडोज सिस्टम स्टार्टअप पर ADT जोड़ें। मेरी समस्या हल ..
Neotrixs

2
उत्तर गलत समस्या का समाधान प्रस्तुत करता है - यह सवाल किसी ब्राउज़र को डीबग करने के बारे में नहीं है, यह किसी वेब व्यू को डीबग करने के बारे में है। ये निराश उपयोगकर्ताओं की एक भीड़ से स्पष्ट रूप से भिन्न होते हैं क्योंकि उनके WebViews जहां उनके एप्लिकेशन प्रदर्शित होते हैं, वहां दिखाई नहीं देते हैं chrome://inspect
अमन जूल

1
एंड्रॉइड 4.4+ :( यही कारण है ...
कैंडलजैक

76

नोटिस

यह उत्तर पुराना है (जनवरी 2014) तब से कई नए डिबगिंग समाधान उपलब्ध हैं।


मैं अंत में यह काम कर गया! वेनरे और कॉर्डोवा (नो फोनगैप बिल्ड) का उपयोग करना और भविष्य के देवों के लिए परेशानी से बचाने के लिए, जो एक ही समस्या का सामना कर सकते हैं, मैंने एक YouTube ट्यूटोरियल बनाया ;)


मुझे आईपी उचित विन्यास याद आ रहा था, अब यह त्रुटिपूर्ण रूप से काम करता है, बहुत बहुत धन्यवाद!
जुआन कार्लोस अल्पीज़र चिंचिला

8
Weinre डीबगर नहीं है, यह केवल DOM निरीक्षण की अनुमति देता है, आप js डीबग नहीं कर सकते हैं और यहां तक ​​कि कंसोल संदेश भी देख सकते हैं
Bogdan Mart

19
... youtube वीडियो का लिंक कैसे स्वीकार्य उत्तर है?
मियोकी

2
@ मीकोही उन्होंने वीडियो बनाया :)
कैंडलजैक

10
जैसा कि सभी स्टैन्कवरफ़्लो उत्तरों के साथ है - एक समाधान का लिंक (चाहे लेखक द्वारा बनाया गया हो या नहीं), पर फेंक दिया जाता है। समाधान यहां रखें, और बाहरी रूप से नहीं जहां वे एक दिन चले जाएं।
डार्कनॉरटन

56

यदि आप एंड्रॉइड 4.4+ डिवाइस का उपयोग कर सकते हैं, तो आप ऐप के आंतरिक वेब व्यू पर भी क्रोम रिमोट डिबगिंग का उपयोग कर सकते हैं। यह वेनरे की तुलना में बहुत बेहतर डीबगर है, लेकिन कुंजी हाल के एंड्रॉइड संस्करण का उपयोग कर रही है।

हाल ही में कॉर्डोबा बनाता है स्वचालित रूप से इस तरह के डिबगिंग को तब तक सक्षम करता है जब तक कि यह डिबग बिल्ड नहीं है (यह इनरेल-बिल्ड बनाता है)।


बहुत अच्छा लग रहा है - यह भी देखा कि इस सुविधा को सक्षम करने के लिए एक फोनगैप बिल्ड प्लगइन उपलब्ध है।
डेविड

1
आपकी टिप्पणी के अनुसार: यह बंद हो गया है - बैरल बिल्ड (यह सच नहीं है)
लकी

9
पुन। यह, मुझे यह कड़ी उपयोगी लगी। मुख्य रूप से, नेविगेट करने chrome://inspectऔर "डिस्कवर USB डिवाइस" की जाँच करने के लिए Chrome का उपयोग करें। यह कनेक्ट किए गए उपकरणों में किसी भी डीबग-सक्षम वेबदृश्य को दिखाएगा।
6

इस समाधान के साथ समस्या यह है कि console.logकाम करने के लिए प्रतीत नहीं होता है। आप के माध्यम से जाने की जरूरत है alertsजो वास्तव में एक बोझ है।
जोआओ पिमेंटेल फेरेरा

(it's turned off in --release builds).इस नोटिस ने मेरा दिन बचाया!
मैसवर्दना

32

मेरे लिए सबसे अच्छा है क्रोम डीबगर संलग्न करना।

ऐसा करने के लिए, अपने एप्लिकेशन को एमुलेटर या डिवाइस में चलाएं ($ कॉर्डोवा एमुलेट का उपयोग करके)

उसके बाद, Google Chrome खोलें और जाएं chrome://inspect/

आपको रनिंग ऐप्स के साथ एक सूची दिखाई देगी। आपका ऐप होना चाहिए। "निरीक्षण" पर क्लिक करें।

डेवलपर टूल के साथ एक नई विंडो खुलेगी। वहाँ आप त्रुटियों के लिए जाँच करने के लिए "कंसोल" पर क्लिक कर सकते हैं


7
कृपया जाँचें कि आपका उत्तर ओपी की स्थितियों में काम करेगा। क्रोम डीबगर केवल एंड्रॉइड 4.4+ के साथ काम करता है।
क्रिस नेव

20

यदि आपका ऐप कॉर्डोवा 3.3+ चला रहा है और आपका डिवाइस एंड्रॉइड 4.4+ चल रहा है तो आप अपने कॉर्डोवा ऐप को डीबग करने के लिए क्रोम रिमोट वेबव्यू डीबगिंग का उपयोग कर सकते हैं ।

ऐसा करने में सक्षम होने के लिए, आपको सबसे पहले USB डिबगिंग को अपने फ़ोन पर सक्षम करना होगा।

फिर "उपकरणों का निरीक्षण करें" टैब खोलें। Chrome में, सेटिंग > अधिक टूल > उपकरणों का निरीक्षण करें पर जाएं

यदि आप अपने ऐप को अपने कंप्यूटर से कनेक्ट करते समय अपने डिवाइस पर लॉन्च करते हैं, तो डिवाइस सूची में वेबव्यू दिखाई देना चाहिए। अपने वेबव्यू के "निरीक्षण" लिंक पर क्लिक करें और आपके वेबव्यू के लिए डिबग टूल दिखाई दे।

यहां एक लेख पूरी तरह से समझा रहा है कि यह कैसे करना है: http://geeklearning.io/apache-cordova-and-remote-debugging-on-android/


यह इस टिप्पणी अनुभाग के सबसे अच्छे और सबसे पूर्ण उत्तरों में से एक है, भले ही यह 4.4+ की वजह से ओपी की मदद नहीं करता हो।
क्रिस नेवे

7

क्या आपने 'गैपडेबग' की कोशिश की है ? यह निःशुल्क है।

यह ओएस एक्स और विंडोज पर एकीकृत डिबगिंग अनुभव प्रदान करने के लिए सफारी वेबकिट इंस्पेक्टर और क्रोम देव टूल्स के संस्करणों को एकीकृत करने के लिए प्रकट होता है।


1
यह विशेष रूप से विंडोज उपयोगकर्ताओं के लिए कदम डिबग iPhone से कनेक्ट करने के लिए आवश्यक उपकरण है - मैं इसकी अत्यधिक अनुशंसा करता हूं।
माइक नेल्सन

7

एक अन्य विकल्प विजुअल स्टूडियो है, जिसमें कॉर्डोवा ऐप्स को डीबग करने के लिए पूर्व-समर्थन समर्थन है :

एकीकृत डिबगिंग अनुभव । क्रॉस-प्लेटफ़ॉर्म विकास को अक्सर प्रत्येक डिवाइस, एमुलेटर या सिम्युलेटर को डीबग करने के लिए एक अलग टूल की आवश्यकता होती है। हर बार जब आप उपकरणों को बदलते हैं तो विभिन्न उपकरणों का मतलब अलग-अलग वर्कफ़्लो और खोई हुई उत्पादकता होता है। विजुअल स्टूडियो के साथ, आप विंडोज, एंड्रॉइड एमुलेटर, संलग्न एंड्रॉइड डिवाइस, आईओएस डिवाइस और एमुलेटर और अपाचे रिपल एमुलेटर सहित सभी तैनाती लक्ष्य के लिए एक ही विश्व स्तरीय डिबगिंग टूल का उपयोग कर सकते हैं।

अब जब Microsoft ने Visual Studio सामुदायिक संस्करण मुक्त कर दिया है, तो आप इसे बिना किसी खर्च के आज़मा सकते हैं। अपाचे कॉर्डोवा के लिए आपको विजुअल स्टूडियो और विजुअल स्टूडियो टूल्स दोनों को डाउनलोड करना होगा ।


चूंकि इंटेल के एक बार के अद्भुत एक्सडीके ने अपने डिबगर के लिए समर्थन बंद कर दिया था, इसलिए मुझे एक नया विकल्प तलाशना पड़ा। विजुअल स्टूडियो एकमात्र ऐसा है जो मैंने पाया है कि सभी में एक समाधान (आईडीई, डीबगर, प्लगइन प्रबंधक, आदि) है। सेटअप में कुछ समय लगता है लेकिन यह बहुत सरल है। मैं एंटरप्राइज़ 2015 का उपयोग करता हूं। यह बनाता है लेकिन मुझे यकीन नहीं है कि यह अभी तक प्रकाशित हुआ है (मैं उस बिंदु तक नहीं पहुंचा हूं)।
विक्टर स्टोडार्ड

5

जहां तक ​​मुझे पता है, 2.2 से 4.3 तक एंड्रॉइड प्लेटफॉर्म के लिए कॉर्डोवा ऐप में असली डिबगिंग के लिए एकमात्र उत्पादक उपकरण jshybugger हैवेनरे एक इंस्पेक्टर है, डिबगर नहीं। JsHybugger आपके कोड को Android WebView के अंदर डीबग करने की अनुमति देता है।


5

बस यह जोड़ना चाहते हैं कि आप Genymotion का उपयोग करके Android ऐप्स को डीबग कर सकते हैं । यह तेजी से तो स्टॉक एंड्रॉयड एमुलेटर है।


1
जीनोमिशन क्रोम रिमोट डिबगिंग का उपयोग करने की अनुमति देता है क्योंकि इसे एमुलेटर के रूप में नहीं बल्कि वास्तविक डिवाइस के रूप में माना जाता है। कैमरा और अन्य हार्डवेयर सुविधाएँ भी काम करती हैं, लेकिन उनमें से कुछ का भुगतान किया जाता है।
shirk3y

4

आप एम्यूलेटर या असली डिवाइस पर विकसित करने और डिबग करने के लिए इंटेल एक्सडीके आईडीई का उपयोग कर सकते हैं

मुझे कॉर्डोवा के लिए विजुअल स्टूडियो 2015 आरसी टूल भी बहुत अच्छे लगे, इसके रिपल एमुलेटर के साथ


3

यदि आप फोनगैप बिल्ड का उपयोग करते हैं, तो डिबग को सक्षम करने का एक विकल्प है।


स्थानीय बिल्ड के लिए, आप npm: https://npmjs.org/package/weinre के साथ weinre इंस्टॉल कर सकते हैं

और अजीब डॉक्स की लिंक: http://people.apache.org/~pmuellr/weinre/docs/latest/


और क्रोम रिमोट डिबगिंग नाम की कोई चीज़ है, लेकिन मुझे इसके बारे में ज्यादा जानकारी नहीं है, आप रेमंड कैमडेन के लेख पर नज़र डाल सकते हैं: http://www.raymondcamden.com/index.cfm/2014/1/2/Apache- Cordova-33 और रिमोट-डिबगिंग के लिए एंड्रॉयड

क्रोम रिमोट डीबगिंग के लिए डॉक्स: https://developers.google.com/chrome-developer-tools/docs/remote-debugging (यदि मैं सही ढंग से समझाता हूं कि आपको डिफ़ॉल्ट ब्राउज़र के रूप में क्रोम के साथ एंड्रॉइड डिवाइस की आवश्यकता है) तो शायद आपके सपने के सबसे करीब हो उपाय?


इन्फोसिस के लिए धन्यवाद; मैं मुफ्त कॉर्डोवा तरीके का उपयोग करना पसंद करता हूं;) और मुझे अब यह काम करने लगा (मेरे उत्तर की जांच करें) धन्यवाद! +1
18

1
मेरे संपादन की जाँच करें, ऐसा लगता है कि क्रोम आपके सपने के समाधान से बहुत दूर नहीं है
क्विकफिक्स

ध्यान दें कि मैं जिस डिवाइस का उपयोग कर रहा हूं वह एंड्रॉइड 2.3 चला रहा है जबकि क्रोम रिमोट डीबगिंग के लिए एंड्रॉइड 4.4 या उच्चतर की आवश्यकता है। लेकिन धन्यवाद "क्विकफ़िक्स"; मुझे अब सब कुछ काम करने लगा .. मेरा ट्यूटोरियल देखें;)
१we


2

यदि आप कॉर्डोवा 3.3 या उच्चतर का उपयोग कर रहे हैं और आपका डिवाइस एंड्रॉइड 4.4 या उच्चतर चल रहा है तो आप 'क्रोम के साथ एंड्रॉइड पर रिमोट डिबगिंग' का उपयोग कर सकते हैं। पूर्ण निर्देश यहाँ हैं:

https://developer.chrome.com/devtools/docs/remote-debugging

संक्षेप में:

  • USB केबल का उपयोग करके डिवाइस को अपने डेस्कटॉप कंप्यूटर में प्लग करें
  • अपने डिवाइस पर USB डिबगिंग सक्षम करें (मेरे डिवाइस पर यह सेटिंग> अधिक> डेवलपर विकल्पों> USB डीबगिंग के अंतर्गत है)

या , यदि आप कॉर्डोवा 3.3+ का उपयोग कर रहे हैं और 4.4 के साथ कोई भौतिक उपकरण नहीं है, तो आप अपने डेस्कटॉप कंप्यूटर पर एमुलेटर के माध्यम से एप्लिकेशन को चलाने के लिए एंड्रॉइड 4.4+ का उपयोग करने वाले एमुलेटर का उपयोग कर सकते हैं।

  • डिवाइस या एमुलेटर पर अपना कॉर्डोवा एप्लिकेशन चलाएं
  • अपने डेस्कटॉप कंप्यूटर पर क्रोम में, पता बार में क्रोम: // निरीक्षण / # उपकरणों को दर्ज करें
  • आपके डिवाइस / एमुलेटर को आपके कंप्यूटर से जुड़े किसी अन्य मान्यता प्राप्त डिवाइस के साथ प्रदर्शित किया जाएगा, और आपके डिवाइस के नीचे कॉर्डोवा 'वेबव्यू' (मूल रूप से आपका कॉर्डोवा ऐप) का विवरण होगा, जो डिवाइस / एमुलेटर पर चल रहा है ( कॉर्डोवा के काम करने का तरीका यह है कि यह मूल रूप से आपके डिवाइस / एमुलेटर पर एक 'ब्राउजर' विंडो बनाता है, जिसके भीतर एक 'वेबव्यू' है जो आपका रनिंग HTML / जावास्क्रिप्ट ऐप है)
  • 'WebView' अनुभाग के अंतर्गत 'निरीक्षण' लिंक पर क्लिक करें जहाँ आप अपने डिवाइस / एमुलेटर को सूचीबद्ध देखते हैं। यह Chrome डेवलपर टूल लाता है जो अब आपको अपने एप्लिकेशन को डीबग करने की अनुमति देता है।
  • Chrome को देखने के लिए Chrome डेवलपर टूल के 'स्रोत' टैब का चयन करें कि वर्तमान में डिवाइस / एमुलेटर पर आपका कॉर्डोवा ऐप चल रहा है। आप जावास्क्रिप्ट में ब्रेकप्वाइंट जोड़ सकते हैं जो आपको अपना कोड डीबग करने की अनुमति देता है।
  • इसके अलावा, आप 'कंसोल' टैब का उपयोग किसी भी त्रुटि को देखने के लिए कर सकते हैं (जो लाल रंग में दिखाया जाएगा), या कंसोल के नीचे आपको '>' संकेत दिखाई देगा। यहां आप किसी भी चर या ऑब्जेक्ट (जैसे डोम ऑब्जेक्ट्स) में टाइप कर सकते हैं जिसे आप वर्तमान मूल्य का निरीक्षण करना चाहते हैं, और मूल्य प्रदर्शित किया जाएगा।

2

यहाँ Phonegap बिल्ड का उपयोग कर समाधान है। Chrome दूरस्थ वेबव्यू डीबगिंग के साथ निरीक्षण करने में सक्षम होने के लिए अपने config.xml में निम्न जोड़ें।

सबसे पहले, सुनिश्चित करें कि आपके विजेट टैग में xmlns शामिल है: android = "http://schemas.android.com/apk/res/roid/"

<widget 
    xmlns="http://www.w3.org/ns/widgets" 
    xmlns:gap="http://phonegap.com/ns/1.0" 
    xmlns:android="http://schemas.android.com/apk/res/android"
    id="me.app.id" 
    version="1.0.0">

फिर निम्नलिखित जोड़ें

<gap:config-file platform="android" parent="/manifest">
     <application android:debuggable="true" />
</gap:config-file>

यह Nexus 5, Phonegap 3.7.0 पर मेरे लिए काम करता है।

<preference name="phonegap-version" value="3.7.0" />

फोनगैप बिल्ड में ऐप बनाएं, एपीके इंस्टॉल करें, फोन को यूएसबी से कनेक्ट करें, यूएसबी डिबगिंग को फोन पर सक्षम करें फिर क्रोम पर जाएं: // निरीक्षण करें।

स्रोत: https://www.genuitec.com/products/gapdebug/learning-center/configuration/


पवित्र रहो !!! मैं अंतिम रूप से मेरी apk डीबग कर सकता हूं !!! बहुत बहुत धन्यवाद, मुझे नहीं पता कि यह कहीं और अधिक प्रमुख क्यों नहीं है। मेरी परियोजना के रीडमी में इन नोटों को शब्दशः शामिल करना।
जोश

2

Android डिवाइस मॉनिटर का उपयोग करें

Android डिवाइस मॉनिटर Android sdk के साथ संकुल आता है जिसे आपने पहले स्थापित किया होगा। डिवाइस मॉनिटर में आप पूरे डिवाइस लॉग, अपवाद, संदेश सब कुछ देख सकते हैं। यह उपयोगी अनुप्रयोग क्रैश या ऐसी अन्य समस्याओं के लिए डीबग करने के लिए है। इसे चलाने के लिए, अपने Android sdk "/ var / android-sdk-linux / tools" के अंदर टूल / फ़ोल्डर पर जाएँ। फिर निम्न को चलाएँ

chmod +x monitor
./monitor

यदि आप खिड़कियों पर हैं, तो सीधे मॉनिटर। Exe फ़ाइल खोलें। "LogCat" के नीचे एक टैब है जहां आपको डिवाइस से संबंधित सभी संदेश दिखाई देंगे। आपको यहां सभी संदेश दिखाई देंगे जिनमें एंड्रॉइड डिवाइस अपवाद शामिल हैं जो क्रोम निरीक्षण डिवाइस नहीं दिख रहे हैं। लॉगकैट टैब में "+" साइन का उपयोग करके फ़िल्टर बनाना सुनिश्चित करें, ताकि आप केवल अपने आवेदन के लिए संदेश देखें।

स्रोत: http://excellencenodejsblog.com/phonegap-debugging-your-android-application/


लिनक्स उपयोगकर्ताओं के लिए, आपके SDK इंस्टॉलेशन विधि के आधार पर, यह ~ / Android / Sdk / टूल्स / मॉनिटर / टाइपिंग टाइप में भी पाया जा सकता है monitor
स्ट्रिक्स

2

आप अपने html5 ऐप्स को क्रोम से डीबग भी कर सकते हैं

मैं डिबग मोड में क्रोम खोलने के लिए एक .bat बनाता हूं

cd C:\Program Files (x86)\Google\Chrome\Application
chrome.exe "file:///C:\Users\***.html" --allow-file-access-from-files --disable-web-security

1
धन्यवाद, लेकिन मुझे लगता है कि डिवाइस के एकीकृत वेबकिट ब्राउज़र के साथ desing को डिबग करने के लिए सबसे अच्छा तरीका है!
numediaweb

1
मैं दूसरा है, जबकि रिपल आपको एक औसत विचार देता है कि जब आप इसे जारी करेंगे तो यह कैसा दिखेगा, जो अच्छा है, कभी-कभी एमुलेटर और वास्तविक डिवाइस की तुलना में अंतर होते हैं, मुख्यतः क्योंकि एमुलेटर आपके द्वारा वेब ब्राउज़र के इंजन के साथ काम करता है ' उस पर फिर से चल रहा है, जो कुछ स्थितियों में समान नहीं है क्योंकि आपका डिवाइस काम करेगा। इसलिए मैं आमतौर पर दोनों का उपयोग करता हूं, UI डिजाइन करने के लिए लहर, और व्यवहार का परीक्षण करने के लिए जब कुछ उम्मीद के मुताबिक काम नहीं करता है
जुआन कार्लोस

2

आप कॉर्डोबा एंड्रॉइड एप्लिकेशन को डिबग कर सकते हैं जो आपके फोन पर यूएसबी केबल के माध्यम से आपके कंप्यूटर से दूरस्थ रूप से इंस्टॉल किए जाते हैं (आप वेब एप्लिकेशन पर दूरस्थ रूप से भी क्लिक कर सकते हैं जैसे कि आप अपने कंपूटर से वेब एप्लिकेशन देख रहे थे) "क्रोम रिमोट डीबगिंग" के साथ। आप स्टॉक एंड्रॉइड ब्राउज़र या क्रोम पर एंड्रॉइड पर देखे गए वेब एप्लिकेशन को इस तरह से डिबग कर सकते हैं

  1. अपने Android डिवाइस पर डेवलपर मोड सक्षम करें (सेटिंग पर जाएं -> फोन के बारे में -> बिल्ड नंबर पर 7x टैप करें)।

  2. USB केबल के माध्यम से अपने कंप्यूटर को अपने फोन से कनेक्ट करें।

  3. अपने कंप्यूटर पर क्रोम लंच करें और क्रोम पर जाएं: // निरीक्षण करें और रिमोट डिवाइस के बगल में "निरीक्षण" बटन पर क्लिक करें जिसे आप डीबग करना चाहते हैं ("डिवाइस" टैब के तहत)। या अपने कंप्यूटर पर Chrome के अंदर दाईं ओर क्लिक करें -> निरीक्षण -> DevTools (3 ऊर्ध्वाधर डॉट्स - डेवलपर टूल के शीर्ष दाएं कोने) को कॉस्ट्यूम और नियंत्रित करें -> अधिक उपकरण -> दूरस्थ डिवाइस -> बाईं ओर के डिवाइसेस के तहत अपने पर क्लिक करें जिस डिवाइस से आप USB के माध्यम से जुड़े हैं -> जिस एप्लिकेशन को आप चाहते हैं उसके लिए इंस्पेक्ट बटन पर क्लिक करें।

  4. फिर "कंसोल" पर क्लिक करें और आप उसी तरह जावास्क्रिप्ट को डीबग कर सकते हैं, जैसा कि आप क्रोम डेवलपर टूल के साथ एक सामान्य वेब एप्लिकेशन पर करेंगे।


यह मेरे फोन पर काम करता है (एंड्रॉइड 6) लेकिन मेरे टैबलेट पर काम नहीं करता है (नोट 8 एंड्रॉइड 4.4)
डैनियलो 515

यह एंड्रॉइड वेब-व्यू के साथ एक समस्या थी। Crosswalk प्लगइन स्थापित करने से मुझे पुराने उपकरणों पर इस तरह की डिबगिंग करने की अनुमति मिलती है (जेली बीन तक)
Danielo515

1

मैंने प्यार किया है! इसे कैसे उपयोग करे:

सबसे पहले, अपने पर डाल index.html(सुनिश्चित करें app.settings.debugUrlकि यह पहले सेट किया गया है):

  <!-- Weinre debugging -->
  <script type="text/javascript">
    if (app.settings.debugUrl) {
      document.addEventListener("DOMContentLoaded", function(event) { 
        var s = document.createElement("script")
        s.setAttribute("src", app.settings.debugUrl+"/target/target-script-min.js#anonymous")
        document.getElementsByTagName("body")[0].appendChild(s)
      }); 
    }   
  </script>

फिर:

  • इंस्टॉल: sudo npm install -g weinre
  • Daud: weinre --boundHost -all-
  • ब्राउज़र पर खोलें: http: // localhost: 8080 / ग्राहक / # अनाम
  • जैसे ही आप ऐप खोलते हैं घड़ी के लक्ष्य दिखाई देते हैं

Http://www.broken-links.com/2013/06/28/remote-debugging-with-weinre/ पर आधारित


Weinre डीबगर नहीं है, यह केवल DOM निरीक्षण की अनुमति देता है, आप js डीबग नहीं कर सकते हैं और यहां तक ​​कि कंसोल संदेश भी देख सकते हैं,
Bogdan Mart

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.