Bir WeChat uygulaması geliştirmek için bu makaleyi okuyun | Resmi belge yorumlama
WeChat Mini Programı ile ilgili en son bilgiler için "Farkında Program" ı takip etmek için yukarıya tıklayın.
Küçük programlar geliştirmek istiyorsanız, önce bir dizi WeChat özel "geliştirme dili" öğrenmelisiniz.
WeChat, herkesin bu geliştirme dilini kullanmaya başlamasını sağlamak için resmi olarak Çok ayrıntılı bir geliştirme belgesi:
Okumaya zamanınız yoksa, işte size zaman kazandıran bir alternatif:
Farkındalık programı (Wechat zxcx0101) bir kopya hazırladı Resmi geliştirme belgesinin ultra yoğunlaştırılmış versiyonu, yalnızca resmi belgenin tüm temel bilgilerini değil, aynı zamanda orijinal metnin yalnızca üçte birini içerir.
Bu makaleyi okumayı bitirdiğiniz sürece, küçük program geliştirmeye hızlı bir şekilde başlayabilirsiniz.
Not: Bu makale, belirli bir programlama temeline sahip kişilerin okuması için uygundur. Sıfır tabanlı öğrenme için küçük bir program geliştirmek istiyorsanız, lütfen bilgi programının (WeChat hesabı zxcx0101) takip içeriğine dikkat etmeye devam edin.
Mini programların resmi geliştirme belgelerinin yorumlanması
Dil ve belgeler
WeChat uygulama geliştirme ile diğer platform geliştirme arasındaki en büyük fark şudur:
WeChat tarafından kullanılan geliştirme dili ve dosyalar "özel" dir.
Applet'ler tarafından kullanılan program dosyası türleri kabaca aşağıdaki türlere ayrılmıştır:
-
WXML (WeiXin İşaret Dili, WeChat Biçimlendirme Dili)
-
WXSS (WeiXin Stil Sayfası, WeChat stil sayfası)
-
JS (JavaScript, uygulamanın ana gövdesi)
Dil açısından, küçük uygulamalar bir dizi standardı yeniden tanımlıyor gibi görünüyor. Ama aslında, "ön uç üç parçalı" -HTML, CSS ve JavaScript'ten pek de farklı değiller.
Aşağıda, küçük program geliştirme dili ile "ön uç üç parçalı" arasındaki benzerlikleri ve farklılıkları karşılaştıralım:
-
HTML ve WXML : İkisi arasında büyük bir fark var, daha önce Android geliştirmesi ile iletişime geçmediyseniz, biraz baş ağrısı hissedebilirsiniz. Aslında, WXML daha çok Android geliştirmede bir arayüz XML tanımlama dosyası gibidir, program arayüzlerinin oluşturulması için uygundur; HTML ise makaleleri (HTML'nin geçmişi ile ilgili olan) ve İnternet sayfalarının yapımını görüntüleme eğilimindedir.
-
WXSS ve CSS : İkisi arasında hemen hemen hiç dil farkı yoktur ve doğrudan kullanılabilir.
-
JS dosyası : Uygulamanın JS dosyası ile ön uç geliştirme için kullanılan JS arasında neredeyse hiç fark yoktur, ancak uygulamanın JS'si bazı WeChat API arayüzlerini ekledi ve bazı gereksiz işlevleri (DOM gibi) kaldırdı.
Dil açısından, küçük programlar, en düşük öğrenme maliyetiyle tamamen ön uç geliştirmeye uygundur, ancak bu, tüm ön uç geliştiricilerin sorunsuz bir şekilde geçiş yapabileceği anlamına gelmez.
Ön uç geliştirmeden küçük programlara geçiyorsanız, şu iki noktaya dikkat etmeniz gerekir:
-
HTML ve WXML dosya oluşturma fikirleri oldukça farklıdır.Daha önce yalnızca ön uç geliştirme ile iletişime geçtiyseniz, WXML yazma yöntemine uyum sağlamanız biraz zaman alacaktır.
-
Küçük program ön uç dilini kullanıyor olsa da bu, ön uç geliştirme fikirleriyle geliştirmeye devam edebileceğiniz anlamına gelmez. Mini programın ön uç geliştirme gereksinimleri, "bir arabirim oluşturmaktan" "eksiksiz bir uygulama geliştirmeye" yükseltilmiştir. Ön uç geliştirme, bilinci değiştirmelidir.
Arayüz yapısı
1. Temel mantık
İki dosya, WXML ve WXSS, uygulama arabirim öğesi bildirimi ve stil tanımlama dosyalarıdır.
WXML'nin en büyük özelliği, bir görünümdeki arayüz öğelerini birbirine bağlaması ve bilgi güncellemelerini, program mantığı (AppService) aracılığıyla gerçek zamanlı olarak görünüm katmanına iletmesidir.
Görünüm, HTML'deki div öğesine benzer. İnşaat sırasında, görünüm birden çok seviyede yuvalanabilir ve herhangi bir görsel öğe görünüme yerleştirilebilir.
Unutulmamalıdır ki öğe ekranın ötesine geçtiğinde, kullanıcı onu göremez. Bu, HTML'den oldukça farklı.
Örneğin cep telefonu ekranını bir sahne olarak düşünüyoruz ve sahne dışındaki oyuncular seyirci tarafından görülemiyor.
Uygulama, kaydırmaya ayrılmış bir görünüme sahiptir.
Arayüzün serbestçe kaydırılabilen bir arayüz (bir liste vb. Gibi) olmasını istiyorsanız, kaydırmalı görünümü kullanabilir, WXSS'de boyutunu tüm ekrana ayarlayabilir ve kaydırma-y (yukarı ve aşağı kaydırma) veya kaydırma-x (sola ve sağa kaydırma) ayarlayabilirsiniz. ) Doğru.
Uygulamalardaki WXML öğelerini kontrol etmek için DOM'u doğrudan kullanamazsınız. Verileri güncellemeniz gerekiyorsa, WXML tarafından sağlanan veri bağlama ve öğe oluşturma yöntemlerini kullanmanız gerekir.
Unutulmaması gereken bir şey daha, uygulamanın grid dizgi sisteminin 2009'da W3C tarafından önerilen bir dizgi standardı olan Flex düzenini kullanmasıdır.
2. Bağlayıcı veriler
Tek bir alan için geliştiriciler, bilgileri güncellemek için veri bağlama yöntemlerini kullanabilir.
Bağlı veriler yalnızca yüklendiğinde güncellenemez, aynı zamanda JS ana programında bir işlev şeklinde de güncellenebilir.Güncelleme ayrıca arabirimdeki bağlı verilere de yansıtılabilir.
3. Koşullu oluşturma ve liste (döngü) oluşturma
Koşullu oluşturma, beklenmedik koşullara sahip sayfalar için uygundur (örneğin, liste veya ayrıntılar yüklenemediğinde, sorulduğunda, vb.).
Oluşturulmasının tetikleme koşulları vardır, yani koşullar karşılandığında sayfa oluşturulur, aksi takdirde başka bir kod parçası yok sayılır veya oluşturulur.
İki küme parantezinde bulunan değerlendirme koşulundaki değişkenler, ana program JS kodundaki verilerde bildirilir.
Arayüzde bir liste oluşturmanız gerekirse, aynı eleman oluşturma kodunu toplamak için WXML'de döngü oluşturmayı kullanabilirsiniz. Döngülü veriler, WXML erişimi için bir dizi biçiminde verilere yazılabilir.
Oluşturulduktan sonra, değerlendirme koşullarının oluşturulmasındaki değişiklikler arayüz değişikliklerini etkileyebilir.
4. Şablonlar ve referanslar
WXML, kod boyutunu küçültmek için şablonların ve referansların kullanımını destekler.
Şablon, aynı kodu WXML kodunda yeniden kullanmanın bir yoludur.
Aynı dosyaya birden çok şablon yazabilir ve diğer dosyalarda bunlara başvurmak için içe aktarmayı kullanabilirsiniz.
Sayfanın tamamı için alıntı yapmanız gerekiyorsa, include kullanmanız gerekir.
5. Stil
WXSS stil sayfaları ile geliştiriciler, WXML'de öğe stillerini tanımlayabilir.
CSS kodu gibi, WXSS de öğeleri seçmek için seçicileri doğrudan kullanabilir. Ayrıca, WXSS dosyasındaki stil tanımlamasını kolaylaştırmak için, öğenin kimliğini ve sınıfını WXML'de doğrudan tanımlayabilirsiniz.
6. Kullanıcı operasyonu ve olay müdahalesi
WeChat HTML kullanmadığından, Bir köprü (bir öğe) ekleyerek kullanıcının tıklama olayını izleyemezsiniz.
Tıklama olaylarını dinlemesi gereken öğeler için, bağlama için WXML'de bindtap nitelikleri veya catchtap nitelikleri kullanılmalıdır.
WeChat, tek tıklamanın yanı sıra basma, dokunmaya başlama ve bırakma gibi olaylara da yanıt verir.
WXML'de bir olay bağlandıktan sonra, ana program JS'de kullanılabilir.
Diğer API'larda karşılık gelen başka olaylar da vardır.Bu olaylar WeChat uygulamasının resmi belgelerinde bulunabilir.
Uygulamanın sayfaları arasında atlamanız gerektiğinde, wx.navigateTo yöntemini kullanmalısınız.
Sayfa seviyesindeki sıçramalarla ilgili olarak WeChat'in seviye atlamalarını beş seviye ile sınırladığına dikkat edilmelidir. . Geliştirme sırasında ilgili sınırın aşılıp aşılmadığına dikkat edilmesi gerekir.
Ağ Girişi
Uygulama, üç istek yöntemini destekler.
Biri doğrudan bir HTTP bağlantı isteğidir, sonuç doğrudan istekten sonra döndürülür ve bağlantı sona erer. Diğeri ise Soket kalıcı bağlantıdır Bir taraf bağlantıyı aktif olarak kapattığında bağlantı sona erer.
Düz metin göndermek ve almak için yukarıdaki iki bağlantı yöntemine ek olarak, WeChat ayrıca bir dosya gönderme ve alma arabirimi sağlar. Uygulamada kaydedilen ses ve seçilen fotoğraflar bu şekilde yüklenmelidir.
Ağa uygulama aracılığıyla erişmek için, sunucunun HTTPS güvenli bağlantısını desteklemesi ve bağlantı noktası numarasının 443 olması gerekir.
Aynı zamanda uygulama, uygulamayı kaydederken yalnızca geliştirici tarafından belirlenen sunucu adresine erişebilir.
Multimedya ve depolama
Multimedya oynatmanız (ses ve video dahil) veya küçük bir programda veri depolamanız gerekirse, HTML 5'te sağlanan standartları kullanamazsınız. WeChat tarafından sağlanan küçük program multimedya oynatma kontrol arayüzünü ve depolama arayüzünü kullanmalıdır.
Ses arayüzüyle ilgili olarak, iki tür ses çalma ve müzik çalma vardır.
Ses çalma üç arabirim sağlar: çalma, duraklatma ve çalmayı durdurma Belirli bir çalma zaman noktasına atlama işlevini sağlamaz veya geçerli çalma ilerlemesini elde edemez.
Müzik çalma arayüzü, yukarıdaki temel çalma kontrolüne ek olarak müzik durumu denetimi ve izleme gibi işlevler sağlar.
Uygulama, bir fotoğraf ve video veri alışverişi arayüzü sağlar. Bu arayüz aracılığıyla, uygulama kullanıcı tarafından seçilen veya çekilen fotoğraflara ve videolara erişebilir. Ses kaydı ve video fotoğraf arayüzü yoluyla elde edilen multimedya bilgisi geçicidir ve dosyanın uygulama dosyası depolama arayüzü aracılığıyla kalıcı olarak depolanması gerekir. Metin verileri için, uygulama ayrıca bu tür verilerin depolanması için bir arayüz sağlar. Android veya diğer uygulama platformları gibi platformlardan geçiş yapan geliştiricilerin, küçük uygulamaların veritabanı tarzı yerel veri depolama sağlamadığını, ancak bunları bire bir "alan değeri" biçiminde kaydettiğini bilmeleri gerekir.
Donanımla ilgili
Mini Programlar WeChat'e güvenir ve donanımla ilgili birçok API sağlar.
Uygulama aşağıdaki verileri API aracılığıyla elde edebilir:
-
Sistemle ilgili bilgiler (ağ durumu, cihaz modeli, pencere boyutu vb. Dahil)
-
Yerçekimi algılama verileri
-
Pusula verileri
Yukarıdaki API aracılığıyla, "Shake" gibi etkileşimli sayfalar yazmak kolay olmalıdır.
Ama dikkat etmeniz gerekiyor: Bu veriler yalnızca aktif olarak elde edilebilir ve bu sayısal değişikliklerin geri çağrılmasıyla gerçek zamanlı olarak elde edilemez.
Push hizmeti
Mini Programlar push hizmetleri sağlar ve kullanıcılara istedikleri zaman gerekli bildirimleri gönderebilir. Ancak, push hizmetinin toplu gönderim için değil, yalnızca bildirimler ve hatırlatıcılar için kullanılabileceğini lütfen unutmayın. Uygulamada, push hizmeti "şablon mesajı" olarak adlandırılır. (Daha önce bir hizmet hesabı geliştiren geliştiriciler buna aşina olmalıdır). Geliştiricilerin, WeChat uygulaması arka ucunda yeni şablon push mesajları (satın alma başarı bildirimleri, vb.) Kaydetmeleri ve uygulamadaki şablon mesaj gönderme hizmetini kullanmadan önce bunları gözden geçirmeleri gerekir. Belirli denetim standartları için ilgili belgelere başvurulması tavsiye edilir.
Şablon mesajı onaylandıktan sonra, geliştiricinin önce WeChat sunucusundan Erişim Simgesini alması ve ardından şablondaki değeri, şablon numarasını ve dinamik değişkenleri (sipariş numarası, fiyat vb. Gibi) WeChat'e ve WeChat push bildirimlerini kullanıcılara göndermesi gerekir.
Kullanıcı Bilgileri ve WeChat Pay
Mini Program, kullanıcının izniyle kullanıcının bilgilerini elde edebilir.
Her şeyden önce, uygulama, kullanıcının WeChat oturum açma arayüzü aracılığıyla oturum açma yetkisi vermesine izin vermelidir. Bundan sonra, uygulama kullanıcı bilgilerini görüntüleyebilir ve kullanabilir.
Oturum açmak için WeChat kullanırken dikkatli olmanız gerekir. Verilere müdahale edilmediğinin garanti edilebilmesi için mesajın bütünlüğünün onaylanması için imzalanması gerekir.
WeChat Pay, Mini Programda da kullanılabilir . Bir ödeme talebi gönderirken, mesajın bütünlüğünü teyit etmek için gönderilen mesaja bir imza eklenmesi gerektiği unutulmamalıdır.
Yukarıdakiler herkes için derlenmiş programdır Resmi geliştirme belgesi "Anahtar Bilgiler".
Ancak, küçük programlara aşina olmak istiyorsanız, sadece bakamazsınız, yine de yapmanız gerekir.
Geliştirme sürecinde sorunlarla karşılaşırsanız en iyi yol resmi WeChat mini program geliştirme belgelerine başvurmaktır. , Belgelerde çoğu soruna çözüm bulabileceğinize inanıyorum.
Daha sonra, Farkındalık Programı (WeChat zxcx0101) WeChat Mini Programı "Tasarım Belgesi" ve "İşlem Belgesi" nin kısaltılmış versiyonunu paylaşmaya devam edecek.
WeChat uygulamasının yorumunu ve öğreticisini ilk kez almak istiyorsanız, Aşağıdaki QR kodu aracılığıyla farkındalık programını takip edin Sağ.
Programı bilin (WeChat hesabı zxcx0101) Küçük programların ekolojisine odaklanan Aifaner'in resmi açıklamasıdır. En kapsamlı ve en yeni mini program bilgilerini (haberler, görüşler, kılavuzlar, aktiviteler) ve hizmetleri sunacağız, burada mini programlar hakkında her şeyi öğrenebilirsiniz.
