Ön uç, paylaşımı gerçekleştirmek için WeChat platformunu gerçekleştiriyor
WeChat'in yükseltilmesiyle, WeChat üzerindeki bazı jssdk arayüzleri ancak imzalandıktan sonra kullanılabilir.Bugün, ön uçun jssdk arayüzünü nasıl çağırdığını ve nasıl imzalanacağını size açıklayacağım. Ve bazı arayüz konfigürasyonları var.
Öncelikle WeChat js-sdk'nin bazı temel tanıtımlarını açıklayacağım:
WeChat JS-SDK, WeChat genel platformu tarafından web geliştiricileri için sağlanan WeChat tabanlı bir web geliştirme araç kitidir.
WeChat JS-SDK kullanarak, web geliştiricileri WeChat'i cep telefonu sistemlerinin fotoğraf çekme, resim seçme, ses, konum vb. Yeteneklerini verimli bir şekilde kullanmak için kullanabilir ve WeChat'in paylaşma, tarama, kart kuponları ve ödeme gibi benzersiz yeteneklerini doğrudan kullanabilir. WeChat kullanıcılarına daha iyi bir web deneyimi sağlamak.
Bu sefer ana içerik: Anlar, arkadaşlar, qq, qq alanı ve diğer işlevlerle paylaşımın engellenmesi nasıl özelleştirilir.
JSSDK şu adımları kullanır:
Bir: Alan adını bağla
Önce WeChat genel platformunda oturum açın, "Resmi Hesap" a işlev ayarlarını girin ve "js arabirimi güvenlik etki alanı adını" girin. Fikir: 1. Resmi hesabınızın ihtiyacınız olan ilgili geliştirme izinlerine sahip olup olmadığını kontrol etmek için
2.js arabirim güvenlik etki alanı adı, projenizin yayınlandığı yerdir ve .txt dosyasını ön uç projenizin kök dizinine koymanız gerekir. Yapılandırma işlemi sırasında emin değilseniz, lütfen benimle iletişime geçin, cyh_nini
Şekil 1
şekil 2
iki, JS dosyalarını içe aktar
JS arayüzünü çağırması gereken sayfaya aşağıdaki JS dosyasını tanıtın (https desteği):
Sayfanızda https etkinse, https://res.wx.qq.com/open/js/jweixin-1.0.0.js eklemeniz gerektiğini lütfen unutmayın, aksi takdirde JSSDK'yi iOS9.0 veya daha yüksek sistemlerde başarılı bir şekilde kullanamazsınız.
resim 3
üç, Yapılandırma arabirimi aracılığıyla izinleri enjekte ederek yapılandırmayı doğrulayın
WeChat kaynak kodu yapılandırması şu şekilde tanıtıldı:
wx.config ({
hata ayıklama: true, // Hata ayıklama modunu açın, çağrılan tüm apilerin dönüş değeri istemci tarafında uyarı olacaktır.Gelen parametreleri görüntülemek istiyorsanız, bunu bilgisayar tarafında açabilirsiniz ve parametre bilgileri yalnızca bilgisayar tarafında, günlük aracılığıyla yazdırılır Yazdırılacak.
appId: '', // gerekli, resmi hesabın tek tanımlayıcısı
timestamp :, // Gerekli, imzayı oluşturmak için zaman damgası
nonceStr: '', // gerekli, rastgele imza dizisi oluştur
imza: '', // Gerekli, imza, bkz. ek 1
jsApiList: // Gerekli, kullanılacak JS arabirimlerinin listesi, tüm JS arabirimlerinin listesi için Ek 2'ye bakın
});
Dördüncü olarak, hazır arayüz aracılığıyla başarı veya başarısızlık doğrulamasını yönetin
wx.ready (function () {
// Konfigürasyon bilgileri doğrulandıktan sonra, hazır yöntemi çalıştırılacaktır.Tüm arayüz çağrıları, konfigürasyon arayüzü sonucu aldıktan sonra yapılmalıdır. Config, istemcinin asenkron bir işlemidir, bu nedenle sayfa yüklendiğinde ilgili arayüzü çağırmanız gerekirse, ilgili arayüzü koymalısınız. Doğru yürütmeyi sağlamak için hazır işlevinde çağrılır. Kullanıcı tarafından tetiklendiğinde çağrılan arayüz için hazır fonksiyonuna sokulmadan doğrudan çağrılabilir.
});
wx.error (function (res) {
// Yapılandırma bilgisi doğrulaması başarısız olursa hata işlevi çalıştırılır. İmzanın süresi dolarsa ve doğrulama başarısız olursa, belirli hata bilgileri yapılandırmanın hata ayıklama modunda veya döndürülen res parametresinde görüntülenebilir. SPA için imzayı buradan güncelleyebilirsiniz.
});
Şekil 4
Ön uç kodu tamamlandı, ancak bu kodları yazdığınızda, hataların raporlanmaya devam ettiğini göreceksiniz:
errMsg: config: geçersiz imza
WeChat'e göre aşağıdaki yöntemler kullanılmaktadır:
İmza algoritmasının doğru olduğunu onaylamak için, doğrulamak için sayfa aracını kullanabilirsiniz.
NonceStr in config (js'deki deve durumunda standart büyük S), zaman damgasının imzadaki karşılık gelen cestr olmayan ve zaman damgasıyla tutarlı olduğunu onaylayın.
URL'nin sayfanın tam url'si olduğunu doğrulayın (lütfen mevcut sayfa uyarısında (location.href.split ('#')) onaylayın), 'http (s): //' bölümü ve '? GET parametrelerinin 'sonrasındaki kısmı, ancak' # 'karmasından sonraki kısım.
Config'deki appid'in jsapi_ticket'i almak için kullanılan appid ile aynı olduğunu onaylayın.
Access_token ve jsapi_ticket'i önbelleğe aldığınızdan emin olun.
İmza için aldığınız URL'nin dinamik olarak elde edildiğinden emin olun Dinamik sayfalar için, lütfen örnek koddaki php uygulamasına bakın. İmza için url'yi arka uca iletmek için ajax aracılığıyla ön uçta statik bir html sayfasıysa, ön ucun '#' hash bölümünün bağlantısını kaldırmak için geçerli sayfayı almak için js kullanması gerekir (elde etmek için mevcut location.href.split ('#') ve encodeURIComponent gereklidir) , Çünkü sayfa paylaşıldıktan sonra WeChat istemcisi bağlantınızın sonuna başka parametreler ekleyecektir.Eğer mevcut bağlantı dinamik olarak elde edilmezse, paylaşılan sayfa imzalanamayacaktır.
Ama adımları takip ettim. İmza aracı da imzayı doğrular. 6'sının tamamı onaylandı ve geçti, ancak neyin yanlış gittiğini asla bilemiyorum.
Son olarak, url'nin imzayı elde etmek için kullanıldığını fark ettim, çünkü url kodlanmamış çünkü js-sdk arayüzü imzanızın doğru olup olmadığını doğruladığında url'yi kodluyor. Bu yüzden. Hiçbir şey söyleme, sadece koda git:
Şekil 5
Bu kod, dinamik olarak oluşturulan URL'yi arka plana iletmek ve arka planın ilgili imza algoritmasını oluşturup işlemesine izin vermek içindir.
Önemli hatırlatma:
Gün başına Token isteklerinde de bir sınır vardır. Günlük maksimum istek sayısı 2000'dir. Bu sayı aşılırsa, burada talep yapılamaz. Aşıldığında, resmi hesap yönetimi arka plan-geliştirme-arayüz izinleri-erişim_token işleminde sıfırlayabilirsiniz, ancak her ay Sadece 10 şans
Jetonun adresini görüntülemek için bir web hata ayıklama aracı vardır:
https://mp.weixin.qq.com/debug/cgi-bin/apiinfo?t=indextype=%E5%9F%BA%E7%A1%80%E6%94%AF%E6%8C%81form=% E8% 8E% B7% E5% 8F% 96access_token% E6% 8E% A5% E5% 8F% A3% 20 / jeton
