Maison > interface Web > uni-app > Comment implémenter la fonction de connexion WeChat de l'application Android sur uniapp (résumé du processus de fonctionnement)

Comment implémenter la fonction de connexion WeChat de l'application Android sur uniapp (résumé du processus de fonctionnement)

青灯夜游
Libérer: 2021-08-31 18:28:12
avant
15747 Les gens l'ont consulté

Comment implémenter la fonction de connexion WeChat de l'application Android sur uniapp ? L'article suivant partagera avec vous les procédures opérationnelles spécifiques pour la demande d'autorisation et le développement de la connexion à l'application Android WeChat sur uniapp. J'espère que cela sera utile à tout le monde !

Comment implémenter la fonction de connexion WeChat de l'application Android sur uniapp (résumé du processus de fonctionnement)

La plateforme ouverte WeChat fournit certaines interfaces ouvertes de WeChat, telles que la connexion WeChat, le paiement partagé, etc., et fournit des services d'assistance pour d'autres applications de la plateforme. Les informations en ligne sont relativement vagues et certains concepts inconnus sont ajoutés, de sorte que le processus simple n'est pas connecté en série. Cet article résume le processus opérationnel spécifique de demande et de développement d'autorisations pour la connexion à l'application Android WeChat sur uniapp. utile pour vous.

Tout d'abord, jetons un coup d'œil au processus global de développement de la fonction de connexion WeChat. J'ai établi un organigramme général pour vous aider à comprendre le contenu suivant de manière plus organisée :

Comment implémenter la fonction de connexion WeChat de lapplication Android sur uniapp (résumé du processus de fonctionnement)

On peut voir que. développer une connexion WeChat est encore un peu gênant. Oui, permettez-moi de le présenter en détail étape par étape !

1. Enregistrez un compte WeChat Open Platform

Enregistrez d'abord un compte WeChat Open Platform Il existe 4 plateformes WeChat au total. Cette plate-forme ouverte permet d'ouvrir la connexion WeChat, de partager des paiements et d'autres contenus avec des applications. et des pages Web, des petits programmes, etc. Je n’entrerai pas dans les détails du processus spécifique. Faites simplement attention à ne pas entrer en conflit avec le compte de messagerie utilisé ailleurs dans WeChat.

2. Certification de qualification de développeur

Connectez-vous après l'enregistrement réussi du compte Pour développer les fonctions de connexion WeChat, une certification de qualification de développeur est requise. L'inscription à la plateforme ouverte est désormais ouverte aux particuliers, mais la certification de qualification des développeurs n'est ouverte qu'aux entreprises et aux institutions, et la certification coûte 300 yuans. La certification d'entreprise que j'ai utilisée nécessite les certificats de qualification d'entreprise pertinents lors du processus de candidature. Le processus est très rapide avec des informations complètes et peut être complété en deux ou trois jours environ. La demande de facture est assez lente, prenant environ un mois.

3. Postulez pour une application mobile sur la plateforme ouverte

Après une certification réussie, entrez dans le centre de gestion, sélectionnez une application mobile, créez une application mobile et suivez simplement les étapes. coincé est la signature de l'application. Quand je suis arrivé à cette étape, j'étais complètement confus et je ne savais pas ce qu'était la signature de l'application.

Comment implémenter la fonction de connexion WeChat de lapplication Android sur uniapp (résumé du processus de fonctionnement)

4. Génération de signature d'application

Regardez la description ci-dessus, la signature d'application est principalement utilisée pour la vérification d'identité. La raison pour laquelle elle est appelée vérification secondaire est relative à l'utilisateur connecté. Normalement, vous pouvez postuler après vous être connecté à la plateforme ouverte. Maintenant que vous avez cette signature, vous devez vous donner du mal pour prouver que vous disposez de l'autorisation de développement pour cette application. Dans des circonstances normales, la plupart des applications Android publiées dans les petites usines utilisent des certificats de test publics. Désormais, pour générer des signatures d'application, vous devez utiliser votre propre certificat. Avec votre propre certificat, vous pouvez générer la signature d'application requise par WeChat Open Platform. Alors d’où vient ce certificat auto-détenu ? Voyons ensuite comment créer ce propre certificat et cette signature d'application.

Générez votre propre certificat

1), installez l'environnement jre

jre est un environnement de développement Java, vous pouvez utiliser la fenêtre de commande cmd pour utiliser la commande java afin de déterminer si l'environnement actuel a jre, si vous y êtes invité ' java' n'est pas une commande interne ou externe, ni un programme exploitable ou un fichier batch, ​​cela signifie qu'il n'est pas installé si la sortie est comme ceci, cela signifie qu'il a été installé :

Comment implémenter la fonction de connexion WeChat de lapplication Android sur uniapp (résumé du processus de fonctionnement)

S'il n'est pas installé, téléchargez le package d'installation jre:www.oracle.com/java/techno…

Comment implémenter la fonction de connexion WeChat de lapplication Android sur uniapp (résumé du processus de fonctionnement)

Après l'installation, rouvrez cmd et entrez à nouveau java pour voir le contenu normal lié à la sortie . Ensuite, ajoutez le chemin d'installation de jre à la variable d'environnement système :

d:  
set PATH=%PATH%;"C:\Program Files\Java\jre1.8.0_201\bin"
Copier après la connexion

Utilisez cmd pour entrer la commande ci-dessus. La première ligne signifie passer au lecteur d. Ce répertoire est arbitraire et est utilisé pour stocker le certificat de signature qui sera. généré ensuite Oui, vous pouvez créer un autre dossier et y placer un CD. Après avoir appuyé sur Entrée, la deuxième ligne signifie ajouter la commande jre à la variable d'environnement temporaire. L'adresse suivante est basée sur votre adresse d'installation jre réelle. Après cette étape, les fichiers générés par les opérations ultérieures seront générés dans le dossier actuel.

2), Générer un certificat de signature

Une fois les étapes ci-dessus normales, vous pouvez entrer la commande keytool -genkey suivante pour générer le certificat. Il convient de noter ici que « test » dans testalias et test.keystore peut être modifié et remplacé par le nom de votre propre projet.

keytool -genkey -alias testalias -keyalg RSA -keysize 2048 -validity 36500 -keystore test.keystore
Copier après la connexion

回车后,输入密码,比如123456,密码看不见的,不要输错了,后面的按提示填就可以了,一般输入英文或拼音。最后提示是否正确时,不要回车了,输入y确认正确,否则要再重来一次。

确认后,又提示密钥口令,这个直接回车相同就行。

Comment implémenter la fonction de connexion WeChat de lapplication Android sur uniapp (résumé du processus de fonctionnement)

如果提示这个,就把这个指令复制了粘贴执行,输入前面设置的口令123456就可以了。

Comment implémenter la fonction de connexion WeChat de lapplication Android sur uniapp (résumé du processus de fonctionnement)

最后在当前执行命令的文件夹里就能看到应用证书了。

Comment implémenter la fonction de connexion WeChat de lapplication Android sur uniapp (résumé du processus de fonctionnement)

生成签名

前面是生成证书,这一步终于可以生成签名了。

3)、使用自有证书打包

这一步很简单,用hbuilderx进行app云打包,在弹出框中选择安卓的自有证书打包方式。这个自有证书就是我们刚才生成的证书,兴不兴奋,我们也是有证书的人了!?下面三栏,别名、密码都是前面的操作步骤中写过的,没忘记就写上吧,然后选择证书文件,剩下的都是常规操作,最后打包就可以了。

Comment implémenter la fonction de connexion WeChat de lapplication Android sur uniapp (résumé du processus de fonctionnement)

4)、用签名生成工具生成签名

先到微信开放平台下载签名生成工具,下载好之后,在手机端安装,输入安卓包名。

Comment implémenter la fonction de connexion WeChat de lapplication Android sur uniapp (résumé du processus de fonctionnement)

这里有坑,要注意下,uniapp的mainfest.json文件配置中,appid必须是'_UNI_'开头,所以你的配置文件中得是'_UNI_'开头的,但是打包时的包名跟那个配置又是两个体系,互不影响,你可以在这里把名字改下,把uni这个头去掉。因为这个包名后面要跟ios版本一起用,你得跟ios一样,相信打过包的人应该能明白我在说啥。

输入正确的包名(去掉了'UNI'开头),点击下面的按钮就生成了一串id,这个就是——应用签名!真是费劲!

Comment implémenter la fonction de connexion WeChat de lapplication Android sur uniapp (résumé du processus de fonctionnement)

5、按开放平台流程申请应用

有了签名,你就可以按照微信开放平台的流程申请移动应用了,就是本文的第二张图,输入签名,一步步走就行。

1Comment implémenter la fonction de connexion WeChat de lapplication Android sur uniapp (résumé du processus de fonctionnement)

最后就是下面这样子了,代表你提交成功,可以耐心的等了(三天了,没变化,最后过了七八天才通过,中间按要求修改了两次):

1Comment implémenter la fonction de connexion WeChat de lapplication Android sur uniapp (résumé du processus de fonctionnement)

等审核通过,就可以申请微信登录等功能了。

1Comment implémenter la fonction de connexion WeChat de lapplication Android sur uniapp (résumé du processus de fonctionnement)

最后要说的一点就是,app或者你资料中提交的相关域名网站不要给登录界面,否则可能会审核不通过,因为他们进不去,看不了当然无法审核。

6、获取appid和appsecret

移动应用的审核通过后,微信登录功能就会自动开放了,同时开放的还有分享、发送朋友等功能。

1Comment implémenter la fonction de connexion WeChat de lapplication Android sur uniapp (résumé du processus de fonctionnement)

同时,你也可以获取到获取appid和appsecret,这个我自己保存越来,后面开发会用到的。

7、微信登录业务流程梳理

uniapp提供了微信登录api,不过我们首先要清楚微信登录的流程,因为微信登录要配合我们系统自身的业务。我在这里梳理了一张流程图,这张图就是上面总流程图的一部分,你可以对照参考,辅助你开发相关功能。

1Comment implémenter la fonction de connexion WeChat de lapplication Android sur uniapp (résumé du processus de fonctionnement)

8、微信登录服务api调用

如果你按照前面的步骤拿到AppId和AppSecret信息,接下来就是按照这个流程来开发微信登录功能。在uniapp上开发app版本的微信登录功能需要调用uni的api还有h5+的api。 这里就直接给一个示例代码:

onLoad() {
	plus.oauth.getServices((services) => {
			this.weixinAuthService = services.find((service) => {
					return service.id === 'weixin'
			})
		});
},
methods: {
	appWxLogin() {
		var self = this;
		this.weixinAuthService.authorize(function(res) {
			//支持微信、qq和微博等
			uni.login({
				provider: 'weixin',
				success: function(loginRes) {
					// 微信用户信息存入本地,后期备用
					var auth = null;
					plus.oauth.getServices(function(services) {
						auth = services.find((service) => {
							return service.id === 'weixin'
						});
						try {
							uni.setStorageSync('auth_service', auth)
						} catch {
	
						}
					}, function(e) {
						console.log(e);
					});
					if (loginRes.authResult) {
						let access_token = loginRes.authResult.access_token;
						let openid = loginRes.authResult.openid;
						uni.request({
							method: 'POST',
							url: 'https://*********/wx-login/appwxlogin',
							data: {
								openid: openid
							},
							success: (res) => {
								console.log(res);
								//将openid存入本地缓存
								uni.setStorage({
									key: 'openid_key',
									data: res.data.openid
								});
								if (res.statusCode == 200 && res.data && res.data.username) {
									self.isFirstWXLogin = false;
									self.name = res.data.username;
									self.password = res.data.password;
									setTimeout(function() {
										self.tologin({
											username: res.data.username,
											password: res.data.password,
											encrypted: true
										})
									}, 0)
								} else {
									//首次登录,跳转到一个绑定账号的页面
									uni.navigateTo({
										url: 'wxlogin'
									});
								}
							},
							fail: (error) => {
								console.log(error);
							},
							complete: (e) => {
								console.log(e);
							}
						})
					} else {
	
					}
				},
				fail(e) {
					console.log(e);
				},
				complete(e) {
					console.log(e);
				}
			});
		}, function(error) {
			console.log(error)
		}, {
			scope: 'snsapi_userinfo'
		})
	}
}
Copier après la connexion

注意几点: 

1、首先取到微信服务对象this.weixinAuthService。 

2、其次调用授权api——authorize,然后再调用uni.login这个api。

 3、uni.login成功后,如果想取得用户信息可以调用uni.getUserInfo,也可以调用plus.oauth.getServices,后者是h5+的api,前者也是基于后者的封装。 

4、代码中这个接口(/wx-login/appwxlogin)是一个本地服务,具体的业务就是把openid带到用户表中去查找,如果能找到,说明此用户绑定过微信,后端返回用户信息直接登录;如果没找到,就返回提示需要输入用户名密码登录,而且这个登录过程要带上openid,最终插入数据库。

这个api调用与业务开发流程应该比较好理解,我这里也不再画图了,应该都能看明白。 好了,uniapp开发安卓端的微信登录功能就介绍完了,如果对你有用就点个赞或者帮忙转发吧!谢谢鼓励!

推荐:《uniapp教程

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!

Étiquettes associées:
source:juejin.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal