Wechat Open Platform provides some open interfaces of wechat, such as wechat login and shared payment, and provides support services for applications on other platforms. The online information is loose, coupled with some strange concepts, so that the simple process is not connected. This paper summarizes the specific operation process of uniApp for android APP wechat login permission application and development, hoping to be useful to you.

First, let’s take a look at the overall process of developing the wechat login function. I’ve combed out a general flow chart to help you be more organized when you understand the following content:

It can be seen that it is a bit troublesome to develop a wechat login. Let me introduce it step by step in detail.

1. Register an account on wechat open platform

First of all, register an account on wechat open platform [1]. There are altogether 4 wechat platforms. This open platform is to open wechat login to share payment content for APP, web page, small program, etc. The specific process will not be detailed, the email account should be careful not to conflict with other places used in wechat.

2. Developer qualification certification

Account registration after successful login, to develop wechat login these functions but also for developer qualification certification. Now the registration of the open platform is open to individuals, but the developer qualification certification is only open to enterprises and public institutions, and the certification has to pay 300 yuan. I use the enterprise certification, the application process needs to use the enterprise related qualification certificate, complete information process is very fast, two or three days can be done, invoice application is very slow, about a month.

3. Apply for mobile apps on open platforms

Once authenticated, go to the admin center, select the mobile app, create the mobile app, and follow the steps. The only thing that might get stuck is the app signature. I came to this stage completely confused about what an application signature was.

4. Application signature generation

The application signature is mainly used for authentication. The reason why it is called two-check is relative to the logged-in user. Normally, you log on to the open platform and you can apply, but now that you have this signature, you have to do some more work to prove that you have permission to develop the app. Typically, Android apps are distributed in small factories with public test certificates, but now you need your own certificates to generate app signatures. With its own certificate, it can generate the application signature required by wechat Open platform. So how do I get my own certificate? Next, take a look at how to toss out your own certificate and application signature.

Generating your own Certificate

1. Install the JRE environment

Jre is a Java development environment. You can use the CMD command to check whether the current environment has JRE. If the message “Java” is not an internal or external command, or a runnable program or batch file, it indicates that jre is not installed. It is already installed if output looks like this:

If not installed will download the jre installation package: www.oracle.com/java/techno…

Once installed, re-open CMD and type Java again to see normal output. Next, add the JRE installation path to the system environment variable:

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

Use CMD to enter the above command, the first line means to switch to drive D, this directory is arbitrary, is used to store the signing certificate will be generated, you can create another folder and CD into. After press Enter, the second line means to add the JRE command to the temporary environment variable, and the following address is based on the actual installation address of your JRE. After this step, the files generated by subsequent operations will be generated in the current folder.

2. Generate a signature certificate

After the above steps work, you can enter the following keytool -genkey command to generate the certificate. Note that ‘test’ in testAlias and test.keystore can be modified to replace the name of your own project.

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

Enter the password, such as 123456, password invisible, do not lose the wrong, the back of the prompt to fill it, generally input English or pinyin. At the end of the prompt, do not press enter, type y to make sure it is correct, or you will have to start again.

Confirm, and prompt key password, this direct enter the same line.

If prompted, copy and paste the command and enter the password 123456.

Finally, you can see the application certificate in the folder where the command is currently executed.

To generate the signature

After generating the certificate, this step finally generates the signature.

3. Package with its own certificate

This step is easy, use HbuilderX for app cloud packaging, select android’s own certificate packaging method in the pop-up box. This own certificate is the certificate we just generated, not excited, we also have a certificate of the people! ? The following three columns, alias and password are all written in the previous operation steps, don’t forget to write it, and then select the certificate file, the rest is the general operation, and then pack it.

4. Use the signature generation tool to generate signatures

First download the signature generation tool [2] from wechat open platform. After downloading it, install it on the mobile phone and enter the android package name.

Json file, the appID must start with ‘_UNI_’, so your configuration file must start with ‘_UNI_’, but the package name and that configuration are two different things, you can change the name here. Get rid of the uni. Since the package name comes with the ios version, you have to be like ios and trust that anyone who has packaged it will understand what I’m talking about.

Enter the correct package name (without the ‘UNI’) and click the button below to generate a string of ids. This is the application signature! What an effort!

5. Apply for applications according to the open platform process

With a signature, you can apply for a mobile application according to the process of wechat open platform, which is the second picture of this article. Enter your signature and go step by step.

It has been three days and there is no change. Finally, it has been seven or eight days and it has been revised twice as required.

And so on, you can apply for wechat login and other functions.

The last thing to say is that app or relevant domain name websites submitted in your profile should not give login interface, otherwise they may not be approved, because they can not enter, can not see of course can not be approved.

6. Obtain appID and AppSecret

Once the mobile app is approved, the wechat login function will be automatically opened, as well as sharing and sending friends.At the same time, you can also get access to the AppID and AppSecret, which I will save more, later development will use.

7. Sorting out wechat login business process

Uniapp provides wechat login API, but we need to be clear about the process of wechat login first, because wechat login needs to cooperate with our system’s own business. I have sorted out a flow chart here, this chart is part of the overall flow chart above, you can refer to it to help you develop related functions.

8. API invocation of wechat login service

If you follow the previous steps to get the AppId and AppSecret information, then follow this process to develop the wechat login function. Developing wechat login function of app version on UNIApp requires calling UNI API [6] and H5 + API [7]. Here’s an example code:

onLoad() {
	plus.oauth.getServices((services) = > {
			this.weixinAuthService = services.find((service) = > {
					return service.id === 'weixin'})}); },methods: {
	appWxLogin() {
		var self = this;
		this.weixinAuthService.authorize(function(res) {
			// Support wechat, QQ, Weibo, etc
			uni.login({
				provider: 'weixin'.success: function(loginRes) {
					// Wechat user information is stored locally for later use
					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);
								// Store openID in local cache
								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 {
									// On the first login, jump to a page for binding an account
									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'}}})Copy the code

Note the following points: 1. First get the wechat service object this.weixinAuthService. Second, call the authorization API — authorize, and then call the UNI. login API. Uni. GetUserInfo and Plus.oauth. getServices are h5+ APIS, and the former is also based on the latter. 4. The interface (/ wX-login/AppWXlogin) in the code is a local service. The specific business is to bring OpenID to the user table to search for it. If it does not, it will be prompted to enter the user name and password to log in, and the login process will take openID, and finally insert the database.

The API call and business development process should be easy to understand, and I won’t draw any diagrams here, so it should all be clear. Ok, uniAPP development android terminal wechat login function is introduced, if useful to you click a like or help forward it! Thanks for your encouragement!

References:

  1. Ask.dcloud.net.cn/article/357…
  2. Developers.weixin.qq.com/doc/oplatfo…
  3. Blog.csdn.net/Drothy_qin/…
  4. www.cnblogs.com/plBlog/p/13…
  5. Docs.qq.com/doc/DRHJjS0…
  6. Uniapp. Dcloud. IO/API/plugins…
  7. www.html5plus.org/doc/zh_cn/o…