So implementieren Sie die Freigabe von HTML5-Seiten auf WeChat

Das Teilen über WeChat mag auf den ersten Blick kompliziert erscheinen, ist aber eigentlich sehr einfach. Sie müssen nur das von WeChat veröffentlichte WeChat jssdk aufrufen und einige Konfigurationen hinzufügen, um die gemeinsame Nutzung von h5-Seiten auf WeChat zu realisieren. Die offizielle Dokumentadresse lautet: https://mp.weixin.qq.com/wiki?t=resource/res_main&id =mp1421141115

Suchen Sie die App-ID eines vorhandenen offiziellen Kontos, stellen Sie basierend auf dieser App-ID und dieser URL eine Anfrage an das Backend und rufen Sie die für die Konfiguration erforderlichen Parameter ab: Zeitstempel, Noncestr und Signatur.

Führen Sie die JS-SDK-Datei der offiziellen WeChat-Website über das Skript-Tag ein

 <script src=https://res.wx.qq.com/open/js/jweixin-1.2.0.js type=text/javascript></script>

2. Grundkonfiguration

 wx.config({ debug: false, // Ob der Debug-Modus aktiviert werden soll appId: appid, //appid timestamp: timestamp, // timestamp nonceStr: noncestr, // zufällige Zeichenfolge Signatur: Signatur, // Signatur jsApiList: [ ' onMenuShareTimeline ', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo', 'onMenuShareQZone' ] // Liste der zu verwendenden JS-Schnittstellen})

3. Verwendung

 wx.ready(function(){ // Mit Freunden teilen wx.onMenuShareAppMessage({ title: title, // Titel teilen desc: desc, // Beschreibungslink teilen: link, // Link teilen imgUrl: imgUrl, // Symbol teilen Erfolg: function () { doShareDone() }, cancel: function () { doShareCancel() } }) // In Momenten teilen wx.onMenuShareTimeline({ title: title, // Link zum Teilen des Titels: link, // Link zum Teilen imgUrl: imgUrl, // Symbol zum Teilen erfolgreich: function () { doShareDone() }, cancel: function () { doShareCancel () } })}) 

 // Erfolgreiche Rückruffunktion teilen doShareDone () { console.log('Sharing success')} 

 //Freigabe-Rückruffunktion abbrechen doShareCancel () { console.log('Freigabe abgebrochen')}

Wenn das Debug-Feld in wx.config auf true gesetzt ist, kann das Debuggen durchgeführt werden.

Zum Debuggen müssen Sie die WeChat-Entwicklertools verwenden, das offizielle Konto-Webseitenprojekt auswählen und die Seitenadresse eingeben.

Anhang 5 der WeChat JS-SDK-Dokumentation enthält Lösungen für die meisten Probleme. Hier liste ich einige auf, auf die ich gestoßen bin und die oben keine Lösungen boten.

1. Nicht erfasster TypeError: Die Eigenschaft „config“ von undefiniert kann nicht gelesen werden

Lösung: Die HTML-Seite führte das SDK separat ein, und die vereinheitlichte Komponente führte das SDK erneut ein, was zu Problemen führte.

2. Nicht abgefangen (im Versprechen) TypeError: Die Eigenschaft „ready“ von undefiniert kann nicht gelesen werden

Lösung: Wie Problem 1.

3. Ungültige Signatur

Lösung: Wenn keine der Methoden im Dokument dieses Problem löst, gibt es eine andere Möglichkeit. Richten Sie zunächst die grundlegendste Konfiguration ein, um die Konfiguration in Ordnung zu bringen, und richten Sie dann die Freigabekopie mit verschiedenen Parametern ein, die Sie benötigen Problem. Nach der Konfiguration wurde es erfolgreich geteilt. Es mag etwas verwirrend sein, das zu sagen, aber ein einfaches Verständnis ist, dass Sie, solange die Seite über eine erfolgreiche Konfiguration der Konfiguration verfügt, weiterhin andere Freigaben konfigurieren können, selbst wenn die Signatur dieser Freigabekonfiguration ungültig ist.

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, dass er für das Studium aller hilfreich ist. Ich hoffe auch, dass jeder das VeVb Wulin Network unterstützt.