HarmonyOS NEXT project practice：import QQ SDK

reference material
Mobile application access process:
https://wiki.connect.qq.com/%e7%a7%bb%e5%8a%a8%e5%ba%94%e7%94%a8%e6%8e%a5%e5%85%a5%e6%b5%81%e7%a8%8b

HarmonyOS_SDK environment setup:
https://wiki.connect.qq.com/harmonyos_sdk%e7%8e%af%e5%a2%83%e6%90%ad%e5%bb%ba

SDK Demo Download:
https://wiki.connect.qq.com/sdk%e4%b8%8b%e8%bd%bd

Mobile application access process:
Mobile applications can access the Internet Open Platform through the following steps[ https://connect.qq.com] ：
Developer Registration>Mobile Application Application>Mobile Application Development>Call OpenAPI

Developer registration On the homepage of QQ Internet Open Platform http://connect.qq.com/ Click the "Login" button in the upper right corner and log in with your QQ account. After successful login, you will be redirected to the developer registration page, where you need to submit your company or personal basic information.
Mobile application access application
Before accessing the mobile application, it is necessary to first apply and obtain the corresponding appid and appkey to ensure that the mobile application and user can be verified and authorized correctly in the subsequent process.
If your PC application has already been connected to Tencent Open Platform, you do not need to obtain a new appid and appkey. Simply use the appid obtained when connecting to Tencent Open Platform to add it as a mobile application.
Add mobile application: After the developer successfully registers, they will be redirected to the "Management Center" page. Click on 'Add Mobile App' and fill in the corresponding information.
After filling in the mobile application information, click "OK" to complete the registration of the mobile application. Enter the management center and you can view the appid and appkey obtained by the mobile application
Mobile application development Entering the console page, you can see that the mobile application application is in the "development" status. To launch a mobile application, the first step is to develop the mobile application, which is to complete the QQ login function and place the QQ login button normally.
Use OpenAPI provided by QQ Internet After completing the development of the mobile application, you can click on "Apply for Online" under "Current Process" on the "Console" page of the "Management Center", and the process will be in the "Review" state. After submission for review, Tencent will complete the review within two working days. Once the review is approved, the mobile application will be officially launched.

Development Description
The QQ login function uses the internationally recognized OAuth2.0 protocol for verification and authorization, and can be used for mobile application development through the following methods:
(1) QQ Internet provides SDK development packages for iOS and Android respectively. If QQ is installed on the phone, start QQ on the phone for SSO login. If not installed, log in through the mobile system's browser. The login process has been integrated into the SDK, and it is recommended that developers use this method. See: SDK Download
(2) According to the QQ login OAuth2.0 protocol, independently developed, this method has a high degree of customization and can be used for mobile applications that require integration with existing systems.

Hongmeng project configuration:
Add dependencies and execute commands

ohpm i @tencent/qq-open-sdk

After running, you can see the newly added dependency libraries in the project level oh-package.json5 file

  "dependencies": {
    "@tencent/qq-open-sdk": "^1.0.3"
  }

Modify module configuration:
Modify the module.json5 file of entry and configure skills

        "skills": [
          {
            "entities": [
              "entity.system.home",
              "entity.system.browsable"
            ],
            "actions": [
              "action.system.home",
              "ohos.want.action.viewData"
            ],
            "uris": [
              {
                "scheme": "qqopenapi", // 接收 QQ 回调数据
                "host": "xxxxxxxxx", // 业务申请的互联 appId，如果填错会导致 QQ 无法回调
                "pathRegex": "\\b(auth|share)\\b",
                "linkFeature": "Login",
              }
            ]
          }
        ]

Continue to modify the modular.json5 file of entry and add queryPlans

    "querySchemes": [
      "https",
      "qqopenapi"
    ]

Add SDK tool classes:
Add QQOpenApiHolder

import { SdkConfig } from '@heduohao/bases'
import { IQQOpenApi, OpenApiConfig, QQOpenApiFactory } from '@tencent/qq-open-sdk'

export class QQOpenApiHolder {
  private static qqOpenApi: IQQOpenApi

  private constructor() {

  }

  public static create(): IQQOpenApi {
    if (!QQOpenApiHolder.qqOpenApi) {
      let openApiOption: OpenApiConfig = {
        forceEnableWeb: false,
        autoHandleAuthResult: true,
      }

      QQOpenApiHolder.qqOpenApi =
        QQOpenApiFactory.createApi(SdkConfig.QQ_SDK_APP_ID, openApiOption)
    }
    return QQOpenApiHolder.qqOpenApi
  }

  public static getInstance(): IQQOpenApi {
    return QQOpenApiHolder.qqOpenApi
  }
}

EntryAbility connects to QQOpenApiHolder

  onCreate(want: Want, launchParam: AbilityConstant.LaunchParam): void {
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onCreate');
    QQOpenApiHolder.create()
  }

  onNewWant(want: Want, _launchParam: AbilityConstant.LaunchParam): void {
    QQOpenApiHolder.getInstance()?.handleResult(want)
  }

DEV Community

HarmonyOS NEXT project practice：import QQ SDK

Top comments (0)