유니앱에서 안드로이드 앱의 위챗 로그인 기능을 구현하는 방법(작업과정 요약)

유니앱에서 안드로이드 앱의 위챗 로그인 기능을 어떻게 구현하나요? 다음 기사에서는 uniapp에서 Android 앱 WeChat 로그인 권한 신청 및 개발에 대한 구체적인 운영 절차를 공유하겠습니다. 모든 분들께 도움이 되기를 바랍니다!

WeChat 오픈 플랫폼은 WeChat 로그인, 공유 결제 등 WeChat의 일부 개방형 인터페이스를 제공하고 다른 플랫폼 애플리케이션에 대한 지원 서비스를 제공합니다. 온라인 정보가 상대적으로 느슨하고, 생소한 개념이 추가되어 단순한 프로세스가 연속적으로 연결되지 않습니다. 이 글에서는 유니앱에서 안드로이드 앱 위챗 로그인 권한을 신청하고 개발하는 구체적인 작업 과정을 요약하면 좋겠습니다. 당신에게 유용합니다.

먼저 WeChat 로그인 기능 개발의 전반적인 과정을 살펴보겠습니다. 다음 내용을 보다 체계적으로 이해할 수 있도록 일반적인 흐름도를 정리했습니다.

다음과 같이 볼 수 있습니다. WeChat 로그인 개발은 아직 조금 번거롭습니다. 단계별로 자세히 소개하겠습니다!

1. WeChat 오픈 플랫폼 계정 등록

먼저 WeChat 오픈 플랫폼 계정을 등록하세요. 이 오픈 플랫폼은 WeChat 로그인, 결제 및 기타 콘텐츠를 앱에 공유하는 것입니다. 웹페이지, 작은 프로그램 등 구체적인 프로세스에 대해서는 자세히 설명하지 않겠습니다. WeChat의 다른 곳에서 사용되는 이메일 계정과 충돌하지 않도록 주의하세요.

2. 개발자 자격 인증

WeChat 로그인 기능을 개발하려면 개발자 자격 인증이 필요합니다. 이제 개방형 플랫폼 등록은 개인에게 공개되지만 개발자 자격 인증은 기업 및 기관에만 공개되며 인증에는 300위안이 필요합니다. 제가 사용한 기업 인증은 신청 과정에서 관련 기업 자격 인증서가 필요합니다. 정보가 완전하고 프로세스가 매우 빠르며 청구서 신청은 약 한 달 정도 소요됩니다.

3. 오픈 플랫폼에서 모바일 애플리케이션을 신청하세요

인증에 성공하신 후 관리 센터에 들어가 모바일 애플리케이션을 선택하고 모바일 애플리케이션을 생성하신 후 절차를 따르시면 됩니다. 응용 프로그램 서명이 붙어 있습니다. 이 단계에 이르렀을 때 저는 완전히 혼란스러웠고 애플리케이션 서명이 무엇인지 몰랐습니다.

4. 애플리케이션 서명 생성

위 설명을 보면 애플리케이션 서명이 주로 신원 확인에 사용되는 이유는 로그인한 사용자와 관련이 있습니다. 일반적으로 오픈 플랫폼에 로그인한 후 신청할 수 있습니다. 이제 이 서명이 있으므로 이 애플리케이션에 대한 개발 권한이 있음을 증명하기 위해 몇 가지 문제를 거쳐야 합니다. 일반적인 상황에서 소규모 공장에서 출시되는 대부분의 Android 앱은 공개 테스트 인증서를 사용합니다. 이제 애플리케이션 서명을 생성하려면 자체 인증서를 사용해야 합니다. 자체 인증서를 사용하면 WeChat Open Platform에 필요한 애플리케이션 서명을 생성할 수 있습니다. 그렇다면 이 자체 소유 인증서는 어디서 오는 걸까요? 다음으로, 이 자체 인증서와 애플리케이션 서명을 생성하는 방법을 살펴보겠습니다.

자신만의 인증서 생성

1), jre 환경 설치

jre는 Java 개발 환경이므로 cmd 명령 창을 사용하여 java 명령을 사용하여 현재 환경에 jre에서 ' java'라는 메시지가 표시되면 내부 또는 외부 명령도 아니고 실행 가능한 프로그램이나 배치 파일도 아닙니다, ​​출력이 다음과 같으면 설치되었음을 의미합니다.

설치되어 있지 않은 경우 jre 설치 패키지를 다운로드하세요. www.oracle.com/java/techno…

설치 후 cmd를 다시 열고 java를 다시 입력하면 정상적인 출력 관련 내용을 볼 수 있습니다. . 그런 다음 시스템 환경 변수에 jre 설치 경로를 추가합니다.

d:  
set PATH=%PATH%;"C:\Program Files\Java\jre1.8.0_201\bin"

cmd를 사용하여 위 명령을 입력합니다. 첫 번째 줄은 d 드라이브로 전환한다는 의미이며 이 디렉터리는 임의의 디렉터리이며 서명 인증서를 저장하는 데 사용됩니다. 예, 다른 폴더를 만들고 거기에 CD를 넣을 수 있습니다. Enter를 누른 후 두 번째 줄은 jre 명령을 임시 환경 변수에 추가한다는 의미입니다. 후속 주소는 실제 jre 설치 주소를 기반으로 합니다. 이 단계가 끝나면 후속 작업으로 생성된 파일이 현재 폴더에 생성됩니다.

2), 서명 인증서 생성

위 단계가 정상적으로 완료되면 다음 keytool -genkey 명령을 입력하여 인증서를 생성할 수 있습니다. 여기서는 testalias 및 test.keystore의 'test'를 수정하고 자신의 프로젝트에 있는 이름으로 바꿀 수 있다는 점에 유의해야 합니다.

keytool -genkey -alias testalias -keyalg RSA -keysize 2048 -validity 36500 -keystore test.keystore

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

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

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

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

生成签名

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

3）、使用自有证书打包

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

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

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

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

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

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

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

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

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

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

6、获取appid和appsecret

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

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

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

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

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'
		})
	}
}

注意几点： 

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教程》

위 내용은 유니앱에서 안드로이드 앱의 위챗 로그인 기능을 구현하는 방법(작업과정 요약)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!