HarmonyOS鸿蒙Next中QQ登录接入

HarmonyOS鸿蒙Next中QQ登录接入 接入QQ登录一定要弄AppLink吗

图片

9 回复

这个必须的,不然登录成功之后qq无法将你的app拉起,并将qq数据回传给你的app,appLinking这就相当一个钩子

更多关于HarmonyOS鸿蒙Next中QQ登录接入的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


确实都要给的楼主,可参考HarmonyOS_SDK环境搭建-----

1. 添加依赖、module.json5 配置

  • 运行 ohpm i @tencent/qq-open-sdk
  • 运行后在工程级 oh-package.json5 文件中可看到新增依赖库

(2)module.json5 配置文件修改

// module.json5 的"module"节点下配置 querySchemes

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

// 在 Ability 的 skills 节点中配置scheme

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

2. 授权登录接入

(1)创建IQQOpenApi实例

推荐声明为全局静态变量

iQQOpenApi: IQQOpenApi = QQOpenApiFactory.createApi(appId)

(2)调用授权登录接口获取authCode

a. 基于Promise
this.iQQOpenApi.login(this.getUIContext(), {
    scope: "all",
    useQrCode: this.useQrcode,
    networkTimeout: 0,
    forceWebLogin: this.forceWebAuth
})
.then((result: AuthResult) => {
    if (result.type == AuthResultType.Success) {
        let code = result.authResponse?.authCode
        if (code) {
            // 获取 server-side 授权 code 成功,模拟业务后台到 QQ 互联后台换取 授权 accessToken,并获取用户 QQ 信息
            HttpUtils.getAccessToken(this.tencent.appId(), "[your open appkey]", code)
            .then((value: AccessTokenJson) => {
                hilog.debug(0x0000, TAG, "code get token : " + JSON.stringify(value))
                this.tencent.getUserInfo(value.access_token, value.openid, this.iuListener)
            })
            .catch((error: string) => {
                hilog.debug(0x0000, TAG, "code get token error msg: " + error)
            })
        }
    } else if (result.type == AuthResultType.Cancel) {
        this.alert(result.message ?? "")
    } else if (result.type == AuthResultType.Error) {
        this.alert(result.message ?? "")
    }
}).catch(() => {
});
b. 基于回调方式
// step1 互联授权登录回调监听
loginApiCallback: ApiCallback<AuthResponse> = {
    onComplete: (response: AuthResponse): void => {
        hilog.debug(0x0000, TAG, `onComplete response: ${JSON.stringify(response)}`);
        if (response.ret == 0) {
            // 获取 server-side 授权 code 成功,模拟业务后台到 QQ 互联后台换取 授权 accessToken,并获取用户 QQ 信息
            HttpUtils.getAccessToken(this.tencent.appId(), "[your open appkey]", response.authCode)
            .then((value: AccessTokenJson) => {
                hilog.debug(0x0000, TAG, "code get token : " + JSON.stringify(value))
                this.tencent.getUserInfo(value.access_token, value.openid, this.apiCallback)
            })
            .catch((error: string) => {
                hilog.debug(0x0000, TAG, "code get token error msg: " + error)
            })
        }
        promptAction.showToast({
            message: "获取code成功:" + response.authCode
        })
    },
    onError: (msg: string | null): void => {
        this.alert(`onError msg: ${msg}`);
    },
    onCancel: (msg: string | null): void => {
        this.alert(`onCancel msg: ${msg}`);
    }
}

// step2 调用接口
this.iQQOpenApi.login(this.getUIContext(), {
    scope: "all",
    useQrCode: this.useQrcode,
    forceWebLogin: false,
    networkTimeout: 0
}, this.loginApiCallback)

(3)调用 IQQOpenApi.handleResult()处理回调数据

// 在业务 Ability.onNewWant() 中调用(注意 IQQOpenApi 实例需要与调用 login 方法为同一实例,同时需要与 module.json5 中配置 scheme 为同一个 Ability)

onNewWant(want: Want, launchParam: AbilityConstant.LaunchParam): void {
super.onNewWant(want, launchParam);
ApiHolder.getInstance()?.handleResult(want)
}

为什么在qq互联平台配置好之后,把appid放到项目里还是显示未注册鸿蒙应用信息,

为什么在qq互联平台配置好之后,把appid放到项目里还是显示未注册鸿蒙应用信息,

方便看一下具体信息吗,应用有没有上架,

嗯必须的,主要就是登录成功后,回跳到你们App。

鸿蒙Next中接入QQ登录需要使用OpenHarmony的Web组件结合OAuth2.0协议实现。具体步骤:

  1. 在config.json中声明网络权限:
"reqPermissions": [{
  "name": "ohos.permission.INTERNET"
}]
  1. 使用Web组件加载QQ登录授权页:
Web({ src: 'https://graph.qq.com/oauth2.0/authorize?client_id=YOUR_APPID&response_type=token' })
  1. 通过onUrlLoad回调监听授权结果,解析access_token。

  2. 获取到token后调用QQ OpenAPI获取用户信息。

需要提前在QQ互联平台申请应用,获取AppID和AppKey。注意鸿蒙Next的Web组件特性与安卓WebView有差异。

在HarmonyOS Next中接入QQ登录时,AppLink不是必须的,但建议配置。QQ登录SDK要求配置deeplink用于登录回调,而HarmonyOS的AppLink机制能更好支持这种场景。如果仅需基本功能,可只配置通用链接(Universal Link),但完整接入推荐同时配置AppLink以确保兼容性。具体实现时,需在config.json中声明相关intent-filter,并处理好QQ回调的uri scheme。

回到顶部