AIR HTML Introspector ile hata ayıklamaAdobe® AIR® SDK HTML tabanlı uygulamalarda hata ayıklamaya yardım etmek için uygulamanıza dahil edebileceğiniz bir AIRIntrospector.js JavaScript dosyası içerir. AIR Introspector Hakkında(AIR HTML Introspector adıyla kullanılan) Adobe AIR HTML/JavaScript Application Introspector HTML tabanlı uygulama geliştirme ve hata ayıklamaya yardımcı olan kullanışlı özellikler sağlar:
AIR Introspector kodu yükleniyor.AIR Introspector kodu AIR SDK'nin çerçeveler dizinine dahil edilen AIRSourceViewer.js adlı bir JavaScript dosyasına dahil edilir. AIR Introspector'ı uygulamanızda kullanmak için, AIRIntrospector.js dosyasını uygulama proje dizininize kopyalayın ve dosyayı uygulamanızdaki ana HTML dosyası aracılığıyla yükleyin: <script type="text/javascript" src="AIRIntrospector.js"></script> Ayrıca dosyayı uygulamanızdaki farklı yerel pencerelere karşılık gelen her HTML dosyasında içerin. Önemli: AIRIntrospector.js dosyasını yalnızca uygulamayı geliştirirken ve onun hatalarını ayıklarken dahil edin. Onu dağıttığınız paketli AIR uygulamasıyla kaldırın.
AIRIntrospector.js dosyası air.SourceViewer öğesini çağırarak JavaScript kodundan erişebileceğiniz Console adlı bir sınıfı tanımlar. Not: AIR Introspector'ı kullanan kod uygulama güvenlik sanal alanında olmalıdır (uygulama dizininde bulunan bir dosyada.)
Bir nesneyi Konsol sekmesinde denetlemek.Konsol sınıfı beş yöntem tanımlar: log(), warn(), info(), error() ve dump(). log(), warn(), info() ve error() yöntemlerinin hepsi Konsol sekmesine bir nesne göndermenize olanak tanır. Bu yöntemlerin en temel olanı log() yöntemidir. Aşağıdaki kod Konsol sekmesine test değişkeni tarafından temsil edilen basit bir nesne gönderir: var test = "hello"; air.Introspector.Console.log(test); Ancak, Konsol sekmesine bir karmaşık nesne göndermek daha kullanışlıdır. Örneğin, aşağıdaki HTML sayfası, button nesnesinin kendisini Konsol sekmesine gönderen (btn1) adlı bir düğme içerir: <html> <head> <title>Source Viewer Sample</title> <script type="text/javascript" src="scripts/AIRIntrospector.js"></script> <script type="text/javascript"> function logBtn() { var button1 = document.getElementById("btn1"); air.Introspector.Console.log(button1); } </script> </head> <body> <p>Click to view the button object in the Console.</p> <input type="button" id="btn1" onclick="logBtn()" value="Log" /> </body> </html> Düğmeye bastığınızda, Konsol sekmesi btn1 nesnesini görüntüler ve nesnenin özelliklerini denetlemek için onun ağaç görünümünü genişletebilirsiniz: Nesnenin bir özelliğini, özellik adının sağındaki listeyi tıklatarak ve metin listesini değiştirerek düzenleyebilirsiniz. info(), error() ve warn() yöntemleri log() yöntemiyle aynıdır. Ancak, bu yöntemleri çağırdığınızda, Konsol satırın başında bir simge görüntüler:
log(), warn(), info() ve error() yöntemleri yalnızca gerçek nesneye bir başvuru gönderir, bu nedenle de kullanılabilir olan özellikler görüntüleme sırasında olanlardır. Gerçek nesneyi serileştirmek istiyorsanız, dump() yöntemini kullanın. Bu yöntem iki parametreye sahiptir:
dump() yöntemini çağırmak bir nesneyi Console sekmesine göndermeden önce onu serileştirir, böylece nesnenin özelliklerini düzenleyemezsiniz. Örneğin, şu kodu göz önünde bulundurun: var testObject = new Object(); testObject.foo = "foo"; testObject.bar = 234; air.Introspector.Console.dump(testObject); Bu kodu çalıştırdığınızda, Konsol testObject nesnesini ve onun özelliklerini görüntüler ancak Konsol'da özellik değerlerini düzenleyemezsiniz. AIR Introspector'ı YapılandırmaKonsolu küresel AIRIntrospectorConfig değişkeninin özelliklerini ayarlayarak yapılandırabilirsiniz. Örneğin, aşağıdaki JavaScript kodu AIR Introspector uygulaması sütunlarını 100 karakterde bir saracak şekilde yapılandırır: var AIRIntrospectorConfig = new Object(); AIRIntrospectorConfig.wrapColumns = 100; AIRIntrospector.js dosyasını (bir script etiketiyle) yüklemeden önce AIRIntrospectorConfig değişkeninin özelliklerini ayarladığınızdan emin olun. AIRIntrospectorConfig değişkeninin sekiz özelliği vardır:
AIR Introspector arabirimiUygulamanın hata ayıklamasını yaparken AIR iç inceleyici penceresini açmak için, F12 tuşuna basın veya Konsol sınıfının yöntemlerinden birini çağırın (bkz. Bir nesneyi Konsol sekmesinde denetlemek.). Kısayol tuşunu F12 tuşundan başka bir tuş olarak yapılandırabilirsiniz; bkz. AIR Introspector'ı Yapılandırma. AIR Introspector penceresinde aşağıdaki örnekte gösterildiği gibi altı sekme vardır: Konsol, HTML, DOM, Varlıklar, Kaynak ve XHR: Konsol sekmesiKonsol sekmesi air.Introspector.Console sınıfının yöntemlerinden birine parametreler olarak geçen özellik değerlerini görüntüler. Ayrıntılı bilgi için, bkz. Bir nesneyi Konsol sekmesinde denetlemek..
HTML sekmesiHTML sekmesi HTML DOM'un tamamını bir ağaç yapısında görüntülemenize olanak tanır. Özelliklerini sekmenin sağ kısmında görüntülemek için öğeyi tıklatın. Ağaçtaki bir düğümü genişletmek veya daraltmak için + ve - simgelerini tıklatın. HTML sekmesindeki herhangi bir nitelik veya metin öğesini düzenleyebilirsiniz ve düzenlenen değer uygulamaya yansır. Denetle düğmesini tıklatın (AIR Introspector penceresindeki sekme listesinin solunda). Ana pencerenin HTML sayfasındaki herhangi bir öğeyi tıklatabilirsiniz ve ilişkili DOM nesnesi HTML sekmesinde görüntülenir. Ana pencere odağa sahip olduğunda, Denetleme düğmesini açıp kapatmak için de klavye kısayoluna basabilirsiniz. Klavye kısayolu varsayılan olarak F11'dir. Kısayol tuşunu F11 tuşundan başka bir tuş olarak yapılandırabilirsiniz; bkz. AIR Introspector'ı Yapılandırma. HTML sekmesinde görüntülenen veriyi yenilemek için Etkin Pencereyi Yenile düğmesini (AIR Introspector penceresinin üst kısmında) tıklatın. Sekmede görüntülenen metni eşleştirmek için Windows'ta CTRL+F veya Mac OS'de Command+F tuşunu tıklatın. (Görünür olmayan ağaç düğümleri aratılmaz.) DOM sekmesiDOM sekmesi window nesnesini bir ağaç yapısında gösterir. Herhangi bir dize ve sayısal özelliği düzenleyebilirsiniz ve düzenlenen değer uygulamaya yansır. DOM sekmesinde görüntülenen veriyi yenilemek için Etkin Pencereyi Yenile düğmesini (AIR Introspector penceresinin üst kısmında) tıklatın. Sekmede görüntülenen metni eşleştirmek için Windows'ta CTRL+F veya Mac OS'de Command+F tuşunu tıklatın. (Görünür olmayan ağaç düğümleri aratılmaz.) Varlıklar sekmesiVarlıklar sekmesi yerel pencerede yüklenen bağlantıları, görüntüleri, CSS'i ve JavaScript dosyalarını denetlemenize olanak tanır. Bu düğümlerden birini genişletmek dosyanın içeriğini gösterir veya kullanılan gerçek nesneyi görüntüler. Varlıklar sekmesinde görüntülenen veriyi yenilemek için Etkin Pencereyi Yenile düğmesini (AIR Introspector penceresinin üst kısmında) tıklatın. Sekmede görüntülenen metni eşleştirmek için Windows'ta CTRL+F veya Mac OS'de Command+F tuşunu tıklatın. (Görünür olmayan ağaç düğümleri aratılmaz.) Kaynak sekmesiKaynak sekmesi üç bölüm içerir:
Kaynak sekmesinde görüntülenen veriyi yenilemek için Etkin Pencereyi Yenile düğmesini (AIR Introspector penceresinin üst kısmında) tıklatın. Sekmede görüntülenen metni eşleştirmek için Windows'ta CTRL+F veya Mac OS'de Command+F tuşunu tıklatın. (Görünür olmayan ağaç düğümleri aratılmaz.) XHR sekmesiXHR sekmesi tüm XMLHttpRequest iletişimini uygulamada kesiştirir ve bilgiyi kaydeder. Bu, XMLHttpRequest özelliklerini responseText ve responseXML (kullanılabilir olduğunda) dahil olarak bir ağaç görünümünde görüntülemenize olanak tanır. Sekmede görüntülenen metni eşleştirmek için Windows'ta CTRL+F veya Mac OS'de Command+F tuşunu tıklatın. (Görünür olmayan ağaç düğümleri aratılmaz.) AIR Introspector'ı uygulama harici sanal alandaki içerikle kullanmaUygulama dışı sanal alanıyla eşleşen bir iframe veya frame öğesine uygulama dizininden içerik yükleyebilirsiniz. (ActionScript geliştiricileri için Adobe AIR'de HTML güvenliği bölümüne veya HTML geliştiricileri için Adobe AIR'de HTML güvenliği bölümüne bakın). AIR introspector uygulamasını bu tip içerikle kullanabilirsiniz ancak aşağıdaki kuralları inceleyin:
|
![]() |