Android | Aurora one-click login integration manual

In the darkness, to seek the glimmering light.

preface

One day while looking through the aurora documentation, I found that Aurora also launched a one-click login. Let’s take a look at the effect:

I had the honor to experience the one-click login of Mob before, and now I’m going to experience the one-click login of Aurora. I want to download a Demo and play a wave by scanning the QR code. Embarrassingly, the site is temporarily closed, Emma 😓😓😓. This problem has been reported to aurora staff.

Say a word really, the Internet changes speed now, simply let a person dizzying, from the user experience alone, really let a person all kinds of vision a bright, sparkling risk Venus. You can still remember the big black theme of Android 4.x, and the colorful black. 😂 😂 😂

Back to the topic, purely in terms of user login, it is also a variety of iterations and upgrades, continuous evolution, continuous improvement of user friendliness. From the traditional mobile phone number + verification code, when now three-way login, and now the one-click login, very lucky, you can feel the charm of the Internet.

Review the advantages of traditional login, that is, using mobile phone number + verification code:

Simple operation: input mobile phone number, input verification code, you can pass, simple and quick;
Know more people: at least I return to the village uncle aunt know that most of the software can be directly registered through the mobile phone number + verification code, and then you can play casually.

Let’s talk about my personal weaknesses.

Verification code message is not timely: many times there will be such a situation, click the verification code, also began the countdown, but the mobile phone has not been able to accept the verification code information, really very helpless when anxious, especially at the peak;
Disabled people are prone to typing errors: Personally, there are many embarrassing typing errors, including up to now, each time you enter a captcha, you have to be careful and proofread multiple times. 😂 😂 😂

Of course, the above is only a personal understanding of the process of personal use, but also welcome to exchange learning.

So this one click login, compared to the traditional and what are the advantages?

Obviously, the user enters the mobile phone number, sends the verification code, verifies the validity of the verification code, directly upgrades to just click a button to complete the above three steps;
For the background, it also omitted to connect the third-party SMS SENDING SDK, provide front-end interface and verify the validity of front-end sending data;
For the front end, users can replace the original three steps of operation with one step, and can directly get the effective phone number, save a lot of Code, why not? And no longer need to find the operator’s official documents one by one painful integration.

Little friend said, did you see, you are careless. Okay, buddy, I’ve attached links to the top three operators:

China Mobile
China Telecom
China Unicom

The addresses of the three major operators have been attached, and you can check them at any time

In fact, all things in the final analysis, or simple. The truth is that the road is simple. I just registered and logged in. Unless I’m a die-hard fan, at least I’ll Say Bye or skip it.

practice

Say smallpox rot drop, not equal to real practice a wave. And who doesn’t want to experience a good thing soon? How about feeling the charm of it?

One, read the aurora, simple understanding

It was made in ’18, and god, I know now:

Open the aurora certification introduction, a simple screenshot:

Currently supported platforms:

Android
iOS

Unsupported (including not yet open) platforms:

Web (only support China Mobile and China Telecom, also need to contact business)
Flutter (not supported, popular, why not supported)

Step 2: Android SDK Integration Guide

First of all, create a project on the official website of Aurora, and then remember to configure the information required by the corresponding platform. Here is a note taken from the official website:

Key information is highlighted in red.

Then we set the Android application package name and application signature, as shown below:

The MD5 method of obtaining previous records is separately indicated here:

Android Studio gets the SHA1 value

After configuring our one-click login RSA encryption public key:

RSA encryption public key can be generated by code, or directly generated by using the online website, save the public and private keys, simple and convenient:

Generate asymmetric encryption public and private Key pairs, public and private Key pairs, RSA Key pair create, and RSA Key pair

For example, the asymmetric encryption public key I use here:

And asymmetrically encrypted private keys:

Once done, submit it for review.

And when you do that, you have to make sure that you communicate with the aurora, or you’re going to get called back

Say the important things three times

Customer service sister voice is very sweet ~

Aurora also provides us with two integration solutions:

Local engineering configuration
Jcenter automatic integration steps

It’s 2020, automatic integration is necessary

2.1 Configuring Rights

<! -- Required --> <uses-permission android:name="android.permission.INTERNET" /> <uses-permission android:name="android.permission.READ_PHONE_STATE" /> <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/> <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/> <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" /> <uses-permission android:name="android.permission.CHANGE_NETWORK_STATE" /> <uses-permission android:name="android.permission.WRITE_SETTINGS" tools:ignore="ProtectedPermissions" /> <uses-permission android:name="android.permission.GET_TASKS" /> <! -- Optional --> <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW" /> <! - used to open the debug version of the application of overlapping Windows on 6.0 system permissions - > < USES - permission android: name = "android. Permission. CHANGE_WIFI_STATE" / > <uses-permission android:name="android.permission.WAKE_LOCK" /> <uses-permission android:name="android.permission.VIBRATE" />Copy the code

2.2 Processing Compatible Android P By default, Http requests are restricted

Create an XML directory under the res directory and create a new file named network_security_config. XML. Copy the following contents into the XML:

<? The XML version = "1.0" encoding = "utf-8"? > <network-security-config> <base-config cleartextTrafficPermitted="true"> <trust-anchors> <certificates src="system" />  </trust-anchors> </base-config> </network-security-config>Copy the code

In androidmanifest.xml:

    <application
        ...
        android:networkSecurityConfig="@xml/network_security_config" >
        
    </application>
Copy the code

2.3 Check that Project Gradle supports JCenter

In general, Android Studio projects come with Jcenter by default, but let’s take a look.

Open the gradle file under the project and check whether the following comments are configured.

Buildscript {repositories {Google () jCenter () // this} //... } allProjects {repositories {Google () jCenter ()}} // allProjects {repositories {Google () jCenter ()}} //Copy the code

2.4 Configure and add dependencies in Module Gradle

android { // ... defaultConfig { // ... NDK {// Compatible CPU type abiFilters' Armeabi '} // Display configuration Manifestplaceholder = [JPUSH_PKGNAME: ApplicationId, JPUSH_APPKEY: "App Key", // appkey. JPUSH_CHANNEL corresponding to package name registered on Portal: "Developer-default ", // enter the default value.]}} dependencies {//... Implementation 'cn. Jiguang. SDK: jverification: 2.5.2' implementation 'cn. Jiguang. SDK: jcore: 2.1.4}Copy the code

Depending on the latest version number, you can directly visit the following link to view:

MVNRepository

2.5 Adding aurora Authentication Confusion Configuration

	-dontoptimize
	-dontpreverify
	
	-dontwarn cn.jpush.**
	-keep class cn.jpush.** { *; }
	-dontwarn cn.jiguang.**
	-keep class cn.jiguang.** { *; }
	-dontwarn com.cmic.**
	-keep class com.cmic.** { *; }
	-dontwarn com.unicom.**
	-keep class com.unicom.** { *; }
	-dontwarn cn.com.chinatelecom.**
	-keep class cn.com.chinatelecom.** { *; }
Copy the code

2.6 Initializing Aurora authentication in Application

package com.hlq.jiguangdemo.app import android.app.Application import android.util.Log import Cn. Jiguang. Verifysdk. API. JVerificationInterface import the HLQ. Jiguangdemo. BuildConfig / * * * @ author: heliquan * @ the date: */ BaseApplication: */ BaseApplication: Application() {override fun onCreate() {super.oncreate () initJPushSetting()} /** * Initialize aurora authentication */ private fun initJPushSetting() { JVerificationInterface.init( this, 5000 ) { code, MSG -> val logMsg = when (code) {8000 -> {"===> $MSG "} else -> {"===> $MSG "}} the e (" HLQ_Struggle ", logMsg)} / / open the DEBUG mode JVerificationInterface setDebugMode (BuildConfig. DEBUG)}}Copy the code

Don’t forget to configure the name attribute in AndroidManifest.

<application ... android:name=".app.BaseApplication" ... >Copy the code

Third, in actual combat

Android 6.0 dynamic application permissions, this pot came out when that is quite painful ah, all kinds of sorrow. Similarly, I have a device with Android 9.0 system, so after completing the above configuration, we first start to apply for permissions dynamically.

3.1 Dynamically Applying for READ_PHONE_STATE Permission

About permission management library, the Internet is full of beautiful things in eyes, here specially recommend a personal use of relatively good dynamic permission management library:

PermissionsDispatcher

Easy to use, Follow me ~

For personal usage of Kotlin, let’s start with the basic configuration of PermissionsDispatcher (app/build) :

/ /... apply plugin: 'kotlin-kapt' // ... dependencies { // ... / / dynamic permissions apply for implementation "org. Permissionsdispatcher: permissionsdispatcher: 4.6.0" kapt "Org. Permissionsdispatcher: permissionsdispatcher - processor: 4.6.0"}Copy the code

We then add a new comment where we want to request permissions and start requesting permissions dynamically:

package com.hlq.jiguangdemo import android.Manifest import android.os.Bundle import android.view.View import android.widget.Toast import androidx.appcompat.app.AppCompatActivity import cn.jiguang.verifysdk.api.JVerificationInterface import permissions.dispatcher.NeedsPermission import Permissions. The dispatcher. OnShowRationale import permissions. The dispatcher. RuntimePermissions / / the first step: Added the RuntimePermissions annotation to indicate that the corresponding request map is generated at compile time. AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) {super.onCreate(savedInstanceState) setContentView(r.layout.activity_main)} View) {// Step 4: Check whether permissions are granted // Remember to build before writing this, The Runtime Runtime generated requestReadPhoneStateWithPermissionCheck ()} private fun handlerOneKeyLogin () {/ / login here to start writing the actual a key specific request code} / * * * access request callback * / override fun onRequestPermissionsResult (requestCode: Int, permissions: Array<out String>, grantResults: IntArray ) { super.onRequestPermissionsResult(requestCode, permissions, GrantResults) onRequestPermissionsResult (requestCode grantResults)} / * * * the second step: Specify the permissions to apply for dynamically, */ @needspermission (manifest.permission.READ_PHONE_STATE) fun requestReadPhoneState() {handlerOneKeyLogin()} /** * step 3: Explain the specific functions of application permission, Then Build * / @ OnShowRationale (Manifest. Permission. READ_PHONE_STATE) fun onRequestReadPhoneStateRationale () { Toast.makeText(this, "Please approve App request authorization!" , Toast.LENGTH_SHORT).show() } }Copy the code

In the above code, the first and second steps must be filled in, and for the sake of the robustness of the program, we will generally add follow-up operation procedures such as user refusal of permission and user click “no further inquiry”. This is only for one-click login to experience aurora, and it is only necessary to improve the dynamic application for permission temporarily. 😂 😂 😂

3.2 Checking the environment before use

Before using aurora one-click authentication, we need to meet the following conditions:

Aurora one-click authentication whether the SDK has been initialized;
Whether the current mobile network environment can use authentication (based on traffic);
Whether to grant corresponding permissions and obtain mobile phone status

Based on the above three points, we started to improve oneKeyLogin one-click login method:

Public fun oneKeyLogin(view: View) {/ / check if the current initialization successful aurora SDK if (JVerificationInterface. IsInitSuccess ()) {/ / whether the current mobile network environment can use certification. if (! JVerificationInterface. CheckVerifyEnable (this)) {Toast. MakeText (this, "[2016], MSG = the current network environment does not support authentication". Toast. LENGTH_SHORT). The show () return} / / check if permissions granted requestReadPhoneStateWithPermissionCheck ()} else {Toast. MakeText (this, "Aurora SDK has not been initialized successfully ~!" , Toast.LENGTH_SHORT).show() } }Copy the code

3.3 One-click Login

First let’s look at the API documentation for key information:

This really admire aurora development engineers, almost all are automatically acquired if there is no, it is very convenient, especially for me so lazy and vegetable white.

Interface description is also very thoughtful, let’s see:

As for the click authorization event return code, we will know it in advance for the convenience of subsequent integration:

For the sake of the blog demo, I decided to enter some return results. The old findViewById is no longer fun, so try the Kotlin artifact and activate it first:

// Kotlin Android Extensions androidExtensions {experimental = true}Copy the code

Then we started to refine our one-click login details:

*/ private fun handlerOneKeyLogin() {// Configure LoginSetting val Settings = LoginSettings() Settings. isAutoFinish = true // The authorization page is automatically closed after login. Settings. timeout = 15 x 1000 // Set the timeout period, in milliseconds. Legal range (0300, 00], beyond the default setting is 10000 Settings. AuthPageEventListener = object: AuthPageEventListener() { override fun onEvent(cmd: Int, msg: String?) {the e (TAG, "= = = > onEvent code: $CMD MSG: $MSG")}} / / start a login JVerificationInterface loginAuth (this, settings ) { code, content, Operator -> when (code) {6000 -> {// Login Token obtained successfully} else -> {}} tv_login_result.text = "code: $code \n content: $content \n operator: $operator"}}Copy the code

No matter what the actual effect is, let’s Run a wave and have a look at the effect:

Very fast, do you feel ~

3.4 Obtaining a Mobile Phone Number

In the above steps, we obtained the loginToken through one-click login. However, in actual projects, we often need to obtain the user’s actual mobile phone number. So how do we obtain the user’s mobile phone number according to the loginToken?

Don’t worry, read on

In this case, the server needs to provide an interface to obtain the corresponding mobile phone number information through the loginToken we pass.

Here is not the point, here is not a specific demo App request to obtain the phone number.

3.5 Customizing the UI Style of the Authorization Page

/** * Private fun customUIStyle() {val qq = ImageView(this) q.setimageresource (r.rawable.qq) val UiConfig = JVerifyUIConfig.Builder().setauthBGimgPath ("main_bg").setNavcolor (-0xff7930).setNavText(" login ") .setNavTextColor(-0x1) .setNavReturnImgPath("umcsdk_return_bg") .setLogoWidth(70) .setLogoHeight(70) .setLogoHidden(false).setNumberColor(-0xCCCCCD).setLogBTNText (" Local number in one click ").setLogBTNTextColor (-0x1) .setLogBTNimgPath (" umcsDk_LOGin_bTN_bg ").setappprivacyone (" Apply user-defined Terms of Service 1 ", "Https://www.jiguang.cn/about"). SetAppPrivacyTwo (" clause 2 application custom service ", "https://www.jiguang.cn/about") .setAppPrivacyColor(-0x99999a, -0xff7a30) .setUncheckedImgPath("umcsdk_uncheck_image") .setCheckedImgPath("umcsdk_check_image") .setSloganTextColor(-0x666667) .setLogoOffsetY(50) .setLogoImgPath("logo_cm") .setNumFieldOffsetY(170) .setSloganOffsetY(230) .setLogBtnOffsetY(254) .setNumberSize(18) .setPrivacyState(false) .setNavTransparent(false) .addCustomView(qq, false) {context, _ -> toast.maketext (context, "dynamic registration of other buttons 222", Toast.LENGTH_SHORT).show() } .setPrivacyOffsetY(30).build() JVerificationInterface.setCustomUIWithConfig(uiConfig) }Copy the code

Then add this to the method we just handled with one-click login:

Private fun handlerOneKeyLogin() {customUIStyle() //... }Copy the code

The effect is as follows, for demonstration purposes, the effect table mind.

What if I want to add some controls of my own?

Very easy, refer to the following screenshots, aurora documentation to write the TE 6 cough, table blame I te lazy.

3.6 Setting the Entitlement Page pop-up Mode

This is more easy, because it is late, here is a direct demonstration of the effect of low to the explosion, details you slowly polish ~

Let’s take a look at the document aurora did for us:

Add the authorization page Activity to the AndroidManifest and set the corresponding style

  <activity
      android:name="cn.jiguang.verifysdk.CtLoginActivity"
      android:configChanges="orientation|keyboardHidden|screenSize"
      android:launchMode="singleTop"
      android:screenOrientation="unspecified"
      android:theme="@style/ActivityDialogStyle" />
Copy the code

Step 2: Configure the specific pop-up Style

<? The XML version = "1.0" encoding = "utf-8"? > <resources> <style name="ActivityDialogStyle"> <! </item> <item name=" Android :windowNoTitle">true</item> <! - the background transparent - > < item name = "android: windowIsTranslucent" > true < / item > <! <item name="android:windowBackground">@drawable/jverify_dialog_bg</item> </style> </resources>Copy the code

Step 3: Define window rounded corner properties

<? The XML version = "1.0" encoding = "utf-8"? > <shape xmlns:android="http://schemas.android.com/apk/res/android"> <corners android:radius="5dp"/> </shape>Copy the code

Take a look at the effect:

Due to time reasons, temporarily implemented a simple effect. Think about tomorrow’s mission. Big head.

Four, a few words

Here are the results:

Network situation	The test results
Turn on WiFi to turn off traffic	Unable to certification
Enable WiFi Enable traffic	One-click login succeeded
Open the flow	One-click login succeeded

Special case test results:

SIM situation	The test results
Valid SIM card	One-click authentication succeeded. Procedure
Invalid SIM card	Unable to certification

Certification speed, purely personal play. Test basis: record the current timestamp before clicking login and compare it with the time returned by SDK. This is for reference only.

Network situation	The test results
300 MB broadband WiFi and open data	218ms
The mobile network	98ms

In fact, the overall process, relative speed, the waiting period is very short.

Let’s talk about integration accessibility.

Easy, relatively good documentation, novice easy to understand;
There are some differences between the Api use and the documents. I found that some methods were not available when I used the version provided by the official website, and finally found the latest version by myself, which was a bit of a mistake.

A brief description of the aurora one-click login process:

Of course, it contains a lot of details, such as how to know which operator the current traffic belongs to, dual-card operation, etc., which involves my personal knowledge blind area, so I don’t know about it for the time being.

Overall, 90. That’s pretty good. The first time I know the aurora is push, vaguely remember a simple few words, push done, then the excitement, the heart silently put the aurora brother incense again.

Finally, thanks to aurora little brother, let me feel and experience again.

The resources

Aurora Certification Android Integration Guide
The aurora making
PermissionsDispatcher