Applet WeChat
Développement de mini-programmes
Une brève analyse de la fa?on de passer de l'applet à la page H5?? (Exemple d'analyse)
Une brève analyse de la fa?on de passer de l'applet à la page H5?? (Exemple d'analyse)
Jan 18, 2022 am 10:01 AM
Comment passer de l'applet à la page H5 ? L'article suivant vous présentera l' Applet WeChat comment accéder à la page H5. J'espère qu'il vous sera utile !
WeChat Mini Program : Bien que la méthode de développement soit similaire à une page Web, il s'agit en fait d'une page Web spéciale qui ne peut s'exécuter que dans le navigateur développé par WeChat lui-même. Toutes les fonctions qu'elle peut utiliser doivent l'être. fourni par le navigateur WeChat fournit?:
Page H5?: Il s'agit d'une véritable application Web, exécutée dans un navigateur général. Bien que les différents navigateurs présentent des différences subtiles, ils sont généralement les mêmes. peut prendre en charge de vraies applications Web.
C'est pourquoi il nous est possible de sauter entre l'applet WeChat et la page H5, mais ce saut est strictement contr?lé par le navigateur WeChat, il nous est donc nécessaire de comprendre ce que comprennent ces contr?les.
Nom de domaine de la page H5?: Supposons que l'URL de la page H5 que vous devez transférer soit https://www.mysite.com/h5page, alors le nom de domaine mentionné ici est www.mysite.com, et vous avez bien lu, cette URL doit être https. Si vous n'avez pas ajouté SSL à votre site Web, demandez d'abord un certificat (notez qu'il doit s'agir d'un certificat). être public Le certificat appliqué ne peut pas être auto-signé, WeChat ne le reconna?tra pas ! )https://www.mysite.com/h5page，那么這里所說的域名就是www.mysite.com，另外你沒有看錯(cuò)，這個(gè)URL必須是https，如果你還沒有為你的網(wǎng)站加上SSL，那么就先去申請一個(gè)證書吧（注意必須是公開申請的證書，不能是自簽名的，微信不認(rèn)哦！）
好了，這些都準(zhǔn)備好了，讓我們開始開發(fā)一個(gè)小例子。
由于web-view組件是一個(gè)全屏組件，不能和其它小程序組件合用，因此需要獨(dú)立占據(jù)一個(gè)頁面，所以我們到例子就是在小程序的A頁面加一個(gè)鏈接，跳轉(zhuǎn)到B頁面，然后在B頁面使用web-view組件來加載H5頁面。
A頁面
<view class="answerer flex-wrp" bindtap='jumpToH5'>
<view class="avatar flex-item">
<image src="/images/logo-small.jpg"></image>
</view>
<view class="answerer-info flex-item">
<text class="answerer-name">文章標(biāo)題</text>
<text class="answerer-des">文章摘要</text>
</view>
<view class="follow flex-item">
<text>十 關(guān)注</text>
</view>
</view>jumpToH5: function () {
wx.navigateTo({
url: '/pages/B'
})
},B頁面
<web-view src="{{link}}" bindmessage="getMessage"></web-view> data: {
link: "https://www.mysite.com/h5page"
},這時(shí)候當(dāng)你滿懷希望的點(diǎn)擊鏈接時(shí)，會(huì)出現(xiàn)第一個(gè)坎：未綁定網(wǎng)頁開發(fā)者
這是什么鬼，原來使用web-view組件并不是啥人上來就允許使用的，這時(shí)候需要第一個(gè)授權(quán)，就是授權(quán)開發(fā)者使用該組件。這里比較扯淡的是雖然這個(gè)組件是小程序使用的，但并不能在小程序開發(fā)號(hào)里面設(shè)置，而必須在訂閱號(hào)或者服務(wù)號(hào)中進(jìn)行設(shè)置，網(wǎng)絡(luò)上經(jīng)常能夠查到的下面這個(gè)截圖只能登錄訂閱號(hào)或者服務(wù)號(hào)才能看到。
在這里設(shè)置綁定了開發(fā)者的微信號(hào)以后，我們終于可以使用web-view組件了，不過這時(shí)候又出了新問題： 不支持打開非業(yè)務(wù)域名
原來并不是什么網(wǎng)址拿來就可以設(shè)置跳轉(zhuǎn)的，你的小程序中就不能直接跳轉(zhuǎn)到百度上去，小程序能夠跳轉(zhuǎn)的域名必須在業(yè)務(wù)域名中進(jìn)行注冊，總算這次是在小程序開發(fā)號(hào)里面設(shè)置了，但注意在服務(wù)號(hào)的設(shè)置里也有業(yè)務(wù)域名這個(gè)設(shè)置，不要搞混了（話說微信起名也太沒有想象力了，簡直是一坨漿糊）。
設(shè)置好了這個(gè)業(yè)務(wù)域名，滿心歡喜地打開小程序，點(diǎn)擊鏈接，What！又來，這次的問題變成了：redirect_uri參數(shù)錯(cuò)誤
這時(shí)候控制權(quán)已經(jīng)從小程序轉(zhuǎn)移到了H5頁面，但微信頁面跳轉(zhuǎn)內(nèi)部的機(jī)制比較復(fù)雜，涉及到了OAuth認(rèn)證之類的，所以這個(gè)錯(cuò)誤已經(jīng)是H5頁面報(bào)的了，這就需要到H5頁面關(guān)聯(lián)的服務(wù)號(hào)中去進(jìn)行設(shè)置，這次設(shè)置的項(xiàng)目叫做網(wǎng)頁授權(quán)域名
étant donné que le composant web-view est un composant plein écran et ne peut pas être utilisé avec d'autres composants de mini-programme, il doit occuper une page séparée. Ainsi, dans notre exemple, nous ajoutons un lien vers la page. A du mini programme et passez à la page B, puis utilisez le composant web-view sur la page B pour charger la page H5.
B pagerrreeerrreee
à ce moment, lorsque vous cliquez sur le lien avec espoir, le premier obstacle appara?tra?: Développeur Web non lié
Qu'est-ce que c'est ? J'ai utiliséweb Le Le composant -viewn'est pas autorisé à être utilisé par n'importe qui. à l'heure actuelle, la première autorisation est requise, qui consiste à autoriser le développeur à utiliser le composant. Ce qui est ridicule ici, c'est que bien que ce composant soit utilisé par le mini programme, il ne peut pas être défini dans le compte de développement du mini programme, mais doit être défini dans lecompte d'abonnementou lecompte de service code> , la capture d'écran ci-dessous, que l'on peut souvent trouver sur Internet, ne peut être vue qu'en se connectant au <code>Compte d'abonnementou auCompte de service. "164247100515832Une brève analyse de la fa?on de passer de lapplet à la page H5?? (Exemple danalyse)")
à Après avoir lié ici l'identifiant WeChat du développeur, nous pouvons enfin utiliser le composant web-view, mais maintenant un nouveau problème surgit?: l'ouverture de noms de domaine non professionnels n'est pas prise en charge
 "164247101118443Une brève analyse de la fa?on de passer de lapplet à la page H5?? (Exemple danalyse)")
Business Domain Name. Enfin, cette fois, il est dans le mini. programme. Il est défini dans le compte de développement, mais veuillez noter qu'il existe également un paramètre de nom de domaine professionnel dans les paramètres du Compte de service, ne vous y trompez pas (le nom de WeChat est trop peu imaginatif, c'est juste un gachis). ????Après avoir créé ce nom de domaine professionnel, j'ai ouvert avec plaisir le mini programme, cliqué sur le lien, et quoi ! Encore une fois, cette fois, le problème est devenu?: erreur de paramètre redirect_uri???? "1642471018429204. png")
????à l'heure actuelle, le contr?le a été transféré de l'applet à la page H5, mais le mécanisme interne de saut de page WeChat est plus compliqué, impliquant l'authentification OAuth et autres, donc cette erreur est déjà H5 La page a été signalée, vous devez donc la configurer dans le Compte de service associé à la page H5. L'élément défini cette fois est appelé Nom de domaine autorisé de la page Web. , qui est une fonction définie dans le compte officiel. Après avoir ajouté le nom de domaine à rediriger dans les paramètres ??????????, vous pouvez enfin voir la page H5 appara?tre dans le débogueur ! ????Enfin, vulgarisons les différences entre les trois types de comptes sur la plateforme publique WeChat????????Compte de service?? : prend en charge la plupart des interfaces de développement Web et des interfaces de développement JS, et est le compte de développement d'applications le plus courant ????Abonnement ; compte???: utilisé pour publier des articles, il existe relativement peu d'interfaces de développement et de nombreuses fonctions ne sont pas prises en charge. C'est le compte le plus stupide pour la publication d'articles?; ????Mini Programme???: Un compte de développement exclusif pour les applications de mini-programmes. de mini-programmes. De nombreux paramètres doivent être saisis dans les deux premiers paramètres Accédez au type de compte. ??????【Recommandations d'apprentissage associées?: ??Tutoriel de développement de mini-programmes??】??Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Outils d'IA chauds
Undress AI Tool
Images de déshabillage gratuites
Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes
AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.
Clothoff.io
Dissolvant de vêtements AI
Video Face Swap
échangez les visages dans n'importe quelle vidéo sans effort grace à notre outil d'échange de visage AI entièrement gratuit?!
Article chaud
Outils chauds
Bloc-notes++7.3.1
éditeur de code facile à utiliser et gratuit
SublimeText3 version chinoise
Version chinoise, très simple à utiliser
Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP
Dreamweaver CS6
Outils de développement Web visuel
SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)
Le mini-programme Xianyu WeChat est officiellement lancé
Feb 10, 2024 pm 10:39 PM
Le mini programme WeChat officiel de Xianyu a été lancé discrètement. Dans le mini programme, vous pouvez publier des messages privés pour communiquer avec les acheteurs/vendeurs, afficher les informations personnelles et les commandes, rechercher des articles, etc. Si vous êtes curieux, qu'est-ce que le mini Xianyu WeChat. programme appelé ? Jetons un coup d'oeil. Quel est le nom de l'applet Xianyu WeChat ? Réponse : Xianyu, transactions inutilisées, ventes d'occasion, valorisations et recyclage. 1. Dans le mini programme, vous pouvez publier des messages inactifs, communiquer avec des acheteurs/vendeurs via des messages privés, afficher des informations personnelles et des commandes, rechercher des articles spécifiés, etc. 2. Sur la page du mini programme, il y a une page d'accueil, à proximité, publier des messages inactifs et les miens 5 fonctions?; 3. Si vous souhaitez l'utiliser, vous devez activer le paiement WeChat avant d'acheter?;
Implémenter des effets de filtre d'image dans les mini-programmes WeChat
Nov 21, 2023 pm 06:22 PM
Implémentation d'effets de filtre d'image dans les mini-programmes WeChat Avec la popularité des applications de médias sociaux, les gens aiment de plus en plus appliquer des effets de filtre aux photos pour améliorer l'effet artistique et l'attractivité des photos. Les effets de filtre d'image peuvent également être implémentés dans les mini-programmes WeChat, offrant aux utilisateurs des fonctions de retouche photo plus intéressantes et créatives. Cet article expliquera comment implémenter des effets de filtre d'image dans les mini-programmes WeChat et fournira des exemples de code spécifiques. Tout d’abord, nous devons utiliser le composant canevas dans l’applet WeChat pour charger et modifier des images. Le composant canevas peut être utilisé sur la page
Implémentez l'effet de menu déroulant dans l'applet WeChat
Nov 21, 2023 pm 03:03 PM
Pour implémenter l'effet de menu déroulant dans les mini-programmes WeChat, des exemples de code spécifiques sont nécessaires. Avec la popularité de l'Internet mobile, les mini-programmes WeChat sont devenus une partie importante du développement d'Internet, et de plus en plus de gens ont commencé à y prêter attention et à y prêter attention. utilisez les mini-programmes WeChat. Le développement de mini-programmes WeChat est plus simple et plus rapide que le développement d'applications traditionnelles, mais il nécessite également la ma?trise de certaines compétences en développement. Dans le développement des mini-programmes WeChat, les menus déroulants sont un composant courant de l'interface utilisateur, permettant une meilleure expérience utilisateur. Cet article présentera en détail comment implémenter l'effet de menu déroulant dans l'applet WeChat et fournira des informations pratiques.
Quel est le nom de l'applet Xianyu WeChat??
Feb 27, 2024 pm 01:11 PM
Le mini-programme officiel WeChat de Xianyu a été lancé discrètement. Il offre aux utilisateurs une plate-forme pratique qui vous permet de publier et d'échanger facilement des objets inutilisés. Dans le mini programme, vous pouvez communiquer avec des acheteurs ou des vendeurs via des messages privés, afficher des informations personnelles et des commandes et rechercher les articles que vous souhaitez. Alors, comment s'appelle exactement Xianyu dans le mini-programme WeChat ? Ce guide didacticiel vous le présentera en détail. Les utilisateurs qui souhaitent savoir, veuillez suivre cet article et continuer à lire ! Quel est le nom de l'applet Xianyu WeChat ? Réponse : Xianyu, transactions inutilisées, ventes d'occasion, valorisations et recyclage. 1. Dans le mini programme, vous pouvez publier des messages inactifs, communiquer avec des acheteurs/vendeurs via des messages privés, afficher des informations personnelles et des commandes, rechercher des articles spécifiés, etc. 2. Sur la page du mini programme, il y a une page d'accueil, à proximité, publier des messages inactifs et les miens 5?fonctions?;
L'applet WeChat implémente la fonction de téléchargement d'images
Nov 21, 2023 am 09:08 AM
L'applet WeChat implémente la fonction de téléchargement d'images Avec le développement de l'Internet mobile, l'applet WeChat est devenue un élément indispensable dans la vie des gens. Les mini-programmes WeChat fournissent non seulement une multitude de scénarios d'application, mais prennent également en charge les fonctions définies par les développeurs, notamment les fonctions de téléchargement d'images. Cet article présentera comment implémenter la fonction de téléchargement d'images dans l'applet WeChat et fournira des exemples de code spécifiques. 1. Travaux préparatoires Avant de commencer à écrire du code, nous devons télécharger et installer les outils de développement WeChat et nous inscrire en tant que développeur WeChat. En même temps, vous devez également comprendre WeChat
Implémenter l'effet de rotation d'image dans l'applet WeChat
Nov 21, 2023 am 08:26 AM
Pour implémenter l'effet de rotation d'image dans WeChat Mini Program, des exemples de code spécifiques sont nécessaires. WeChat Mini Program est une application légère qui offre aux utilisateurs des fonctions riches et une bonne expérience utilisateur. Dans les mini-programmes, les développeurs peuvent utiliser divers composants et API pour obtenir divers effets. Parmi eux, l'effet de rotation d'image est un effet d'animation courant qui peut ajouter de l'intérêt et des effets visuels au mini-programme. Pour obtenir des effets de rotation d'image dans les mini-programmes WeChat, vous devez utiliser l'API d'animation fournie par le mini-programme. Ce qui suit est un exemple de code spécifique qui montre comment
Comment implémenter le code PHP pour accéder à une page spécifiée
Mar 07, 2024 pm 02:18 PM
Lors de la rédaction d’un site Web ou d’une application, vous rencontrez souvent le besoin d’accéder à une page spécifique. En PHP, nous pouvons réaliser un saut de page grace à plusieurs méthodes. Ci-dessous, je vais vous présenter trois méthodes de saut courantes, notamment l'utilisation de la fonction header(), l'utilisation du code JavaScript et l'utilisation des balises méta. Utilisation de la fonction header() La fonction header() est une fonction utilisée en PHP pour envoyer les informations d'en-tête HTTP originales. Cette fonction peut être utilisée en combinaison lors de l'implémentation de sauts de page. Ci-dessous se trouve un
Utilisez l'applet WeChat pour obtenir un effet de changement de carrousel
Nov 21, 2023 pm 05:59 PM
Utilisez l'applet WeChat pour obtenir un effet de commutation de carrousel. L'applet WeChat est une application légère avec des caractéristiques de développement et d'utilisation simples et efficaces. Dans les mini-programmes WeChat, il est courant d'obtenir des effets de commutation de carrousel. Cet article explique comment utiliser l'applet WeChat pour obtenir l'effet de changement de carrousel et donne des exemples de code spécifiques. Tout d’abord, ajoutez un composant carrousel au fichier d’échange de l’applet WeChat. Par exemple, vous pouvez utiliser la balise <swiper> pour obtenir l'effet de commutation du carrousel. Dans ce composant, vous pouvez passer b
