Authing provides developers with a quick way to get user information from wechat web pages and complete login through the SDK. If users access third-party web pages or public accounts in the wechat client, they can obtain the basic information of users through the wechat web page authorization mechanism, thus realizing the business logic.

  • Application scenarios: wechat webpage and official account;
  • Overview: The wechat authorization box pops up in the webpage of wechat APP, and the user can obtain the information of the current user after authorization.

Step 1: Create a wechat service number on the wechat public platform

Please go to the wechat public platform to guide you to create a wechat service number.

You need to record the developer ID (App ID) and developer Secret (App Secret) of the App, which will be used later. In the background Settings of wechat public platform -> Public Account Settings -> Function Settings page, set the name of webpage authorization scope as core.authing.cn. You will need to verify the validity of the domain name during this process, see the next step for details.

Step 2: Configure wechat web page authorization application on the Authing console

On the social login configuration page of the console, find the wechat webpage login authorization application and fill in the following configuration:

  • App ID: developer ID;

  • App Secret: developer’s key;

  • Callback URL: This is your business Callback domain, not the same as the Callback link configured for the social login application. For example, if your site domain name is example.com and the URL for handling Authing callback requests is /auth/callback, you should write example.com/auth/callba… #.

  • Txt Filename: Txt Filename for authenticating the domain name.

  • Txt Content: Txt file used to verify domain names.

Click OK to save the configuration.

Step 3: Start developing access

Access using SDK

First use CDN to introduce Authing – WXmp-SDK:

To initialize the SDK

Initialize the SDK with the user pool ID:

Initiate wechat authorization

Call the getAuthorizationUrl method to obtain the wechat authorized login link, modify window.location to jump to the wechat authorized login page:

Obtaining User information

After jumping back to the service callback link, get the user information using the getUserInfo method:

The following

After obtaining the user information, you can obtain the user’s identity certificate (the token field of the user information), which you can carry in subsequent requests sent by the client to the back-end server. For example, axios:

Verify the validity of the token on the back-end interface to verify the user’s identity. For details about the authentication method, see Verifying User Credentials (Tokens). Once you have identified the user, you may also need to manage the user’s permissions to determine whether the user has permission to operate on the API.

Access using embedded login components

Take React, for example.

Install @ authing/react – UI components

Initialize the

use

After initialization, open the page in wechat and you will see the following buttons. Click to authorize. After authorization is completed, the application callback link will be redirected and user information can be obtained by using AuthenticationClient.

If you like our content, please pay attention to the public account “Authing Identity Cloud” and visit our blog, more interesting content waiting for you to see ~