Probleme mit der Wechat-App
Ich weiß seit langem, dass die Fallstricke von Miniprogrammen sehr groß sind. Nach mehr als einem Monat Übung habe ich festgestellt, dass diese Fallstricke tatsächlich berechtigt sind ...
Das entwickelte kleine Programm wurde jedoch wie geplant gestartet, was dennoch eine Feier wert ist! ! ! Haha, notieren Sie die Punkte, die Sie innehalten lassen.
1. Fallstricke bei der Entwicklung von WeChat-Miniprogrammen
- 1. {{}} kann keine Methoden ausführen und kann nur einfache Operationen wie „+ - * /“ verarbeiten. Beim Durchlaufen einer Liste muss beispielsweise die Menge jedes Elements vorformatiert werden js und dann setData Once (╯□╰)
- 2. Sie können nur bestehen, Sie können nur bestehen, Sie können die Ansicht nur über setData () aktualisieren, Fallstrick ...
- 3. Wir legen fest, dass der Seitenpfad nur fünf Ebenen umfassen darf. Bitte vermeiden Sie Interaktionen auf mehreren Ebenen.
- 4. Seite A -> Seite B, Seite B kehrt zu A zurück, wie man die Aktualisierung von A auslöst, ohne die Seitenebene zu erhöhen. Die Lösung, die mir im Moment einfällt: Schreiben Sie die Initialisierungsdatenlogik von A in das Onshow-Ereignis von Seite A.
- 5.
undefiniert wird als Zeichenfolge behandelt if(xxx == "undefiniert") [Iterative Optimierung in späteren Versionen] - 6. Wenn Sie auf seltsame Probleme stoßen (z. B. Stile usw.), starten Sie das Tool zuerst neu, da es nach wiederholten Versuchen nie mehr funktioniert.
- 7. Lokale Web-Schriftarten werden nicht unterstützt (Online-Schriftarten müssen verwendet werden). Beim Testen wurde festgestellt, dass einige Android-Geräte nicht richtig angezeigt werden. Nach viel Mühe stellte ich fest, dass der Server, der ursprünglich die Schriftarten speichern musste, domänenübergreifend unterstützen musste. Verdammt, beim Debuggen auf dem Handy werden keine Fehler gemeldet. Ich habe Webfonts fast aufgegeben. Ich stecke schon lange fest, es ist eine Falle ...
- 8. Wenn lokale Ressourcen nicht über CSS abgerufen werden können, können Sie Netzwerkbilder oder Base64 verwenden oder das
<image/>
Tag verwenden. - 9. Page.data kann nicht direkt bedient werden [Vermeiden Sie die direkte Zuweisung und Änderung von Page.data. Verwenden Sie bitte Page.setData, um die Daten zum Rendern mit der Seite zu synchronisieren.]
- 10. Verwenden Sie type="digit" für die numerische Tastatur
- 11. Was passiert, wenn Sie https verwendet haben, aber gemeldet wird, dass Sie keine sichere Verbindung mit dem Server herstellen können [Sie müssen Nginx konfigurieren, um den Verschlüsselungsstandard von https auf tls1.2 und höher zu konfigurieren]
- 12. wx.setStorage(OBJECT) [Derzeit ist jedes Miniprogramm auf 5 MB begrenzt]
- 13. Datenüberwachung [WeChat-Backend: tatsächliche Anzahl der Besuche/Gestern-Übersicht/kumulierte Anzahl der besuchten Benutzer/TOP besuchte Seiten]
- 14. WeChat-Debugging-Artefakt, ngrok, siehe ngrok
- 15. Fügen Sie einen Klickeffekt zur Ansicht hinzu [Hover-Effekt muss aktiviert werden]:
< view hover hover-class =" item-hover " >
- 16. Debugging-Methode für die Benutzerautorisierung [Entwicklungstools-》Autorisierungsdaten für Mobiltelefone löschen (Cache-Autorisierungsdaten für Mobiltelefone löschen)]
- 17. Wenn das Miniprogramm zum ersten Mal auf dem Android-Telefon geladen wird, wird die Onshow-Methode auf der Startseite aus unerklärlichen Gründen zweimal geladen, auf dem iPhone jedoch nicht, da sie in Onshow ausgelöst werden muss Wenn Sie Benutzerinformationen abrufen, wird onshow zweimal geladen. Im Hintergrund wird ein Fehler gemeldet. . .
- 18. Seiten-Dropdown deaktivieren: Legen Sie „disableScroll“ fest: true.
- 19. getAppConfig:fail wird unter Android angezeigt und userInfo kann nicht abgerufen werden. WeChat-Problem, laden Sie das neueste WeChat-Installationspaket herunter
- 20. Der Hintergrund kann keine POST-Daten akzeptieren, kann jedoch GET-Anforderungsparameter empfangen.
url: url,
data: data,
method: "POST",
dataType: "json",
header: {
'content-type': 'application/x-www-form-urlencoded' //==> 此处若为application/json则服务端无法获取POST的参数
}
- 21. Nachdem der Benutzer beim ersten Start des Miniprogramms die Autorisierung verweigert, kann das Autorisierungs-Popup-Fenster beim nächsten Mal nicht aufgerufen werden und die letzte Auswahl des Benutzers wird standardmäßig gespeichert. Es wurde noch keine Lösung gefunden und WeChat verfügt über keine relevante Analyse. [10.01.2017] WeChat hat die API (wx.authorize(OBJECT)) aktualisiert, um das Aufrufen des Autorisierungs-Popup-Fensters zu unterstützen. [05.07.2017]
- 22. Um zu einer Seite mit Tabbar zu springen, müssen Sie wx.switchTab() verwenden. Dies wird fast täglich in verschiedenen Gruppen gefragt! ! !
- 22. Denken Sie bei der Bindung von Entwicklern/Erfahrern daran, die Einladung auf Ihrem Mobiltelefon zu bestätigen. (Viele Leute fragten)
- 23. Der WeChat-Hintergrund hat den angeforderten legalen Domänennamen aktualisiert. Sie können direkt zu WeChat-Entwicklungstools -> Projekt -> Konfigurationsinformationen -> Aktualisieren gehen, und er wird sofort wirksam.
- 24. Das offizielle Miniprogramm bietet kein Beispiel für die Entschlüsselung der Anmeldeinformationen der Java-Version. Sie können diese Demo-Demo für die Entschlüsselung der Java-Version verwenden.
- 25. Wenn Sie wx:for zum Durchlaufen verwenden, fügen Sie am besten wx:key="{{item.id}}" hinzu, wenn Sie eindeutig wissen, dass die Liste statisch ist oder Sie nicht auf ihre Reihenfolge achten müssen Sie können es jedoch ignorieren, wenn das durchquerte Array Änderungen aufweist, die dazu führen können, dass sich die Datensequenz ändert.
- 26. Der Komfort der Mini-Programmentwicklungsseite beträgt rpx, daher wird empfohlen, für den Designentwurf die Größe des iPhone 6 zu verwenden. Informationen zum Flex-Layout finden Sie in diesem Artikel
- 27. Das WeChat-Applet überwacht standardmäßig Dateiänderungen und aktualisiert sie dann automatisch. Der Nachteil besteht jedoch darin, dass es jedes Mal vollständig aktualisiert wird, anstatt Module im laufenden Betrieb auszutauschen, was sich auf die Entwicklungsgeschwindigkeit auswirkt. Insbesondere Entwickler, die häufig Command + S mögen, werden feststellen, dass ihr Miniprogramm ständig aktualisiert wird. @MinJieLiu
- 28. Das WeChat-Miniprogramm unterstützt die
web-view
Komponente seit der Basisbibliothek 1.6.4
. Das heißt, das Miniprogramm unterstützt die Möglichkeit, Webseiten einzubetten. Bei der Verwendung wurde jedoch festgestellt, dass die Webseite nicht möglich ist wird in den Entwicklertools angezeigt, aber die mobile Vorschau kann [aktualisiert] werden. Die neueste Version des WeChat-Clients]. Der Grund dafür ist, dass die verwendete Basisbibliothek web-view
Komponente nicht unterstützt. Dies kann durch Auswahl der neuesten Basisbibliothek behoben werden. wie folgt:
- 29. Die Kommunikation zwischen H5 und Miniprogrammen wird nicht unterstützt und kann nicht über lokalen Speicher oder andere Mittel kommuniziert werden. Wenn Sie unbedingt Parameter übertragen müssen, können Sie versuchen, diese in
web-view
-URL zu übertragen, dies wird jedoch nicht empfohlen kann über das offizielle Konto autorisiert werden. Funktionen zum Öffnen der Webansicht (Webseiten müssen jssdk einbetten): In Webseiten unterstützte JSSDK-Schnittstellen: - 30. Web-View unterstützt derzeit keine WeChat-Zahlung.
- 31. Im Miniprogramm verwendet
catch
-Teil try...catch
-Anweisung throw
, um einen Fehler auszulösen, der vom äußeren try...catch
nicht abgefangen werden kann.
2. Verwandte Konfigurationen vor der Miniprogrammentwicklung
- 1. Anmelden--->Administrator scannt den QR-Code-->Einstellungen-->Entwicklungseinstellungen-->AppSecrect generieren
- 2. Anmeldung bei der Serverkonfiguration --->Administrator scannt den QR-Code ->Einstellungen ->Entwicklungseinstellungen ->Serverdomänenname ->Scannen Sie den QR-Code
- 3. Binden Sie die Benutzeridentität des Entwicklers -> Entwickler -> Bis zu 10 QR-Code-Entwickler
- 4. Verknüpfen Sie die Benutzeridentität des Erlebenden ->Erfahrender ->Scannen Sie den QR-Code mit 20 Erlebenden
3. Mini-Programmveröffentlichung
Die Veröffentlichung ist nur mit einem Administratorkonto möglich. Die Schritte sind wie folgt:
- Verlassen Sie das Entwicklerkonto in den Entwicklungstools
- Der Administrator scannt den QR-Code, um sich bei den Entwicklertools anzumelden, hochzuladen -> WeChat-Hintergrund als Testversion festzulegen -> überprüfen -> veröffentlichen
Hinweis: Die Überprüfungszeit ist variabel und beträgt 2–6 Tage
4. Sammlung von Gründen für das Nichtbestehen der Prüfung
- 1. Die Einführung in das Miniprogramm stellt nicht die Funktionen des Miniprogramms vor.
- 2. Die Kategorie stimmt nicht mit dem auf der Seite bereitgestellten Inhalt überein
- 3. Die vom Miniprogramm bereitgestellten Dienste und Inhalte müssen formal sein und dürfen nicht als Testinhalt oder mehrfach als Testinhalt eingereicht werden.
- 4. Wenn es Audio- und Videoinhalte enthält, fügen Sie bitte die entsprechenden Kategorien hinzu.
- 5. Die Bilder und Texte auf der Homepage überschneiden sich, daher empfiehlt es sich, sie zu optimieren.
- 6. Das Suchfeld kann erst nach wenigen Klicks ausgewählt werden. Beim Klicken auf die Seitenkommentare erfolgt keine Reaktion. Die Auflösung und Größe der Seitenbilder ist verzerrt.
- 7. Einige Bilder zeigen, dass sie komprimiert waren und die körperliche Untersuchung nicht gut war.
- 8. Miniprogramme mit einem Kontosystem müssen zusätzlich zu ihren eigenen Anmeldemethoden die autorisierte WeChat-Anmeldung unterstützen.
- 9. Für Dienste, für deren Nutzung eine Anmeldung erforderlich ist, stellen Sie bitte ein Testkonto bereit
- 10. Der Online-Handel mit virtuellen Artikeln erfordert vorerst keine Bezahlung.
- 11. Der Kerninhalt der Seite, die der Kategorie des Miniprogramm-Dienstes entspricht, muss mit dieser Kategorie übereinstimmen.
- 12. Es muss sichergestellt sein, dass Nutzer die Leistungskategorie auf dieser Seite nutzen können und sich nicht verstecken oder mehrfach abspringen dürfen.
- 13. Zeigen Sie keine Miniprogramme von Drittanbietern an oder empfehlen Sie diese nicht. Beispiel: Mini-Programmnavigation, Mini-Programm-Link-Werbung, Mini-Programm-Rankings usw. sind nicht möglich.
- 14. Es gibt Anreizverhalten im Seiteninhalt von Miniprogrammen, einschließlich, aber nicht beschränkt auf, Anreiz zum Teilen, Anreiz zum Hinzufügen, Anreiz zum Folgen öffentlicher Konten, Anreiz zum Herunterladen usw. Programme, die Benutzer zum Teilen, Hinzufügen, Folgen usw. auffordern herunterladen, bevor sie funktionieren können, Miniprogramme enthalten, die Texterstellung zum Ausdruck bringen oder andeuten, Bilder, Schaltflächen, Überlagerungen, Popup-Fenster usw., die Benutzer teilen, Miniprogramme, die Benutzer durch die Versuchung von Vorteilen zum Teilen und Verbreiten anregen, Miniprogramme, die Verwenden Sie übertriebene Wörter, um Benutzer zum Teilen zu zwingen oder zu verleiten. Alle von Benutzern hinzugefügten Miniprogramme werden abgelehnt.
- 15. Verbieten Sie die automatische Wiedergabe von Multimedia-Inhalten wie Videos, Musik und Stimmen.
- 16. Wenn das Miniprogramm über ein Kontosystem verfügt, muss es eine Kontooption zum „Abmelden“ bereitstellen, die normal verwendet werden kann und leicht zu finden ist.
- 17. Der Inhalt des Miniprogramms darf keine Glücksspiele, Quizze und Verlosungen umfassen.
- 18. Testinhalte dürfen nicht im Seiteninhalt des Miniprogramms enthalten sein; Beispiele: Wahrsagerei, Lotterie, Horoskop usw.
Häufige Ablehnungssituationen auf anderen WeChat-Miniprogrammplattformen
5. Dokumentation und Community
- 1.Offizielle Dokumente
- 2. Offizielle Fragen und Antworten
- 3. Offizielle Community
- 4. Mini-Programmzugriffsanleitung
- 5. Häufig gestellte Fragen zu Miniprogrammen
6. Code
- 1. Kapseln Sie die WeChat-Initiierungsanforderungsschnittstelle. Wenn die Anmeldung fehlschlägt, wird die Anmeldeanforderung standardmäßig automatisch initiiert.
/**
* 发起的是 HTTPS 请求
* @pram url: 请求地址,协议必须为https
* @pram data 请求参数请求参数
* @param success 请求成功回调
* @param fail 请求失败回调
* @param complete 请求完成(成功或者失败)回调
*/
function request ( url , data , success , fail , complete ) {
var _url = url ,
_data = data ,
_success = success ,
_fail = fail ,
_complete = complete ;
wx . request ( {
url : url ,
data : data ,
method : "POST" ,
dataType : "json" ,
header : {
'content-type' : 'application/x-www-form-urlencoded' ,
'Client-Agent' : getSystemInfo ( ) ,
'WX-SESSION-ID' : wx . getStorageSync ( constant [ 'WX-SESSION-ID' ] ) //每次请求带上登录标志
} ,
success : function ( res ) {
if ( res . data . code == "-9999" ) { //会话失效重新登录
requestLogin ( function ( ) {
constant [ 'NUM_TRY_LOGIN' ] ++ ;
//设置请求上限,防止重复提交并死循环
if ( constant [ 'NUM_TRY_LOGIN' ] < constant [ 'LIMIT_NUM_TRY_LOGIN' ] ) {
request ( _url , _data , _success , _fail , _complete ) ;
}
} ) ;
return ;
}
if ( res . data . code == "0" ) {
if ( typeof _success == "function" ) {
_success ( res . data ) ;
}
} else {
wx . showToast ( { title : res . data . msg , icon : 'loading' , duration : 2000 } ) ;
return ;
}
} ,
fail : function ( res ) {
if ( typeof _fail == "function" ) {
_fail ( res ) ;
}
if ( typeof _fail == "string" ) { //请求失败的弹框提示
wx . showToast ( { title : _fail , icon : 'loading' , duration : 2000 } ) ;
}
} ,
complete : function ( res ) {
if ( typeof _complete == "function" ) {
_complete ( res ) ;
}
}
} ) ;
}
- 2. Anmeldeschnittstelle anfordern
/**
* 请求登录,获取用户相关信息
* @param callback
*/
function requestLogin ( callback ) {
var _callback = callback ;
wx . login ( {
success : function ( event ) {
// 获取到请求码,继续请求用户的基本信息
if ( event . code ) {
var code = event . code ;
wx . getUserInfo ( {
success : function ( res ) {
var data = {
code : code ,
encryptedData : res . encryptedData ,
iv : res . iv ,
signature : res . signature ,
rawData : res . rawData
}
var url = domain + "/wx_xxx" ; //请求登录地址
request ( url , data ,
function ( res ) { //success
if ( res . code == "0" ) {
//此处可以将服务端返回的登录状态保存起来
wx . setStorageSync ( constant [ 'WX-SESSION-ID' ] , res . object . sessionId ) ;
if ( typeof _callback == "function" ) {
_callback ( ) ;
}
}
} ,
function ( res ) { //fail
wx . showToast ( { title : '请求登录失败' , icon : 'loading' , duration : 2000 } ) ;
}
) ;
} ,
fail : function ( res ) {
//用户拒绝授权
if ( res . errMsg == "getUserInfo:cancel" || res . errMsg == "getUserInfo:fail auth deny" ) {
wx . redirectTo ( { //跳转至未授权页面
url : '../xxx-page/xxx-page'
} ) ;
}
}
} )
} else {
wx . showToast ( { title : '微信登录失败' , icon : 'loading' , duration : 2000 } ) ;
}
} ,
fail : function ( res ) {
wx . showToast ( { title : '微信登陆失败!' , icon : 'loading' , duration : 2000 } ) ;
}
} ) ;
}