SDK方法(QQ)
前置检查
本文介绍QQ的分享和登录功能,可参见QQ鸿蒙接入指南、QQ接口说明、QQ鸿蒙常见问题文档。
确保已在QQ互联平台创建应用,且审核通过。
@umeng/share从1.1.8版本支持QQ,确保已按照快速开始文档的各步骤安装集成成功。
module.json5 配置文件如下修改,可参见QQ环境搭建说明。
// 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": "1112396455", // 业务申请的互联 appId,如果填错会导致 QQ 无法回调
"pathRegex": "\\b(auth|share)\\b",
}
]
}
]可选,QQ互联平台的applinking校验,可参见下图示例,在鸿蒙开发者平台去配置后,再填写到互联开放平台校验,若QQ互联平台未校验applinking会导致无法调用登录功能。

功能说明
一、判断QQ是否安装
import { QQ } from "@umeng/share";
// 判断QQ是否安装方法
// 注意:须先在应用的module.json5文件中先配置 querySchemes: ["https", "qqopenapi"]
QQ.isInstalled((data: Record<string, string>) => {
console.warn(`qq是否安装: ${JSON.stringify(data)}`);
});二、分享面板
分享面板组件可在UI页面中按需使用,控制是否展示。
ShareBoard分享面板组件。
visible可选,若配置则分享或取消会自动关闭面板,若配置则根据开发者限制面板的显示状态,不会自动关闭。
confirm必选,点击面板的确认分享回调。"qq"表示分享QQ好友,"qzone"表示分享QQ空间。
cancel必选,分享面板点击取消的回调。
import { ShareBoard, QQ, qqConfig } from "@umeng/share";
ShareBoard({
visible: this.visible, // 可选,若不传则分享或取消会自动关闭面板,若传则根据开发者限制面板的显示状态,不会自动关闭。
confirm: (pl: string) => {
if (pl === 'qq') { // 分享到QQ好友
// 如下以分享网页链接为例
const params: qqConfig.WebPageObject = {
"msg_style": 0, // 固定值
"title": "鸿蒙ArkTS分享", // 必传
"summary": "qq互联sdk分享到好友",
"brief": "互联分享",
"url": "https://devs.umeng.com/", // 必传
// 图片若不传,则使用的是应用的图标
"picture_url": "https://img.alicdn.com/imgextra/i1/O1CN016IZkgf1bbj0hS3IsD_!!6000000003484-2-tps-1080-1080.png"
};
QQ.shareWebPage(params, (obj: Record<string, string>) => {
console.warn(`分享网页的返回: ${JSON.stringify(obj)}`);
});
};
if (pl === 'qzone') { // 分享到QQ空间
// 。。。。
}
},
cancel: () => {
this.visible = false;
console.log('取消分享了');
},
});
三、分享网页链接(好友)
分享网页链接到QQ好友,即QQ文档中的图文消息。
title大小限制10KB内。
import { QQ, qqConfig } from "@umeng/share";
const params: qqConfig.WebPageObject = {
"msg_style": 0, // 必传,传固定值0即可
"title": "鸿蒙ArkTS分享", // 必传,网页链接的标题
"summary": "qq互联sdk分享到好友", // 可选,网页链接的摘要
"brief": "互联分享", // 可选
"url": "https://devs.umeng.com/", // 必传,网页链接地址
// 可选,网页链接图标
// 图片若不传,则使用的是应用的图标
"picture_url": "https://img.alicdn.com/imgextra/i1/O1CN016IZkgf1bbj0hS3IsD_!!6000000003484-2-tps-1080-1080.png"
};
QQ.shareWebPage(params, (obj: Record<string, string>) => {
console.warn(`分享网页的返回: ${JSON.stringify(obj)}`);
});四、分享图片(好友)
分享图片到QQ好友,即QQ文档中的大图消息。
注意:分享图片限制条件:
图片仅支持uri格式,如果传多张图片,只取列表中的第1张;
图片格式:目前只支持png、jpeg、gif、bmp、webp格式的图片;
图片文件大小:只支持小于等于32M的图片;
图片分辨率:图片宽、高分别限制30000像素,总像素限制250000000。
import { QQ, qqConfig } from "@umeng/share";
const uris: string[] = []; // ["file://com.umeng.hm.share/data/storage/el2/base/haps/entry/files/original-1766137214639.jpg"]
// 或者以从相册选取照片为例,参见文档下方getPictureUriFromAlbum方法调试。
// const uris: string[] = await this.getPictureUriFromAlbum('image');
const params: qqConfig.ImageObject = {
"msg_style": 6, // 必填,传固定值6即可
"share_uris": uris, // 必填,uri格式图片地址,数组类型。如果传多张图片,只取列表中的第1张。
};
QQ.shareImage(params, (obj: Record<string, string>) => {
console.warn(`分享图片的返回: ${JSON.stringify(obj)}`);
});五、分享网页链接(空间)
分享网页链接到QQ空间,即QQ文档中的图文消息。
title大小限制10KB内。
import { QQ, qqConfig } from "@umeng/share";
const params: qqConfig.ZoneWebPageObject = {
"title": "鸿蒙ArkTS分享", // 必传,网页链接的标题
"summary": "qq互联sdk分享到空间", // 可选,网页链接的摘要
"targetUrl": "https://devs.umeng.com/", // 必传,网页链接地址
// 可选,网页链接图标列表
// 首张图即是封面链接(仅支持网络图片链接)
"imageUrls": [
"https://img.alicdn.com/imgextra/i1/O1CN016IZkgf1bbj0hS3IsD_!!6000000003484-2-tps-1080-1080.png",
"https://img.alicdn.com/imgextra/i2/O1CN01OQQ7ec1MNmf3xFWAX_!!6000000001423-2-tps-96-96.png",
],
};
QQ.shareZoneWebPage(params, (obj: Record<string, string>) => {
console.warn(`分享空间的返回: ${JSON.stringify(obj)}`);
});六、QQ登录
QQ登录要确保在QQ互联平台的applinking校验通过,在鸿蒙开发者平台去配置后,再填写到互联开放平台校验。
import { QQ, qqConfig } from "@umeng/share";
let obj: qqConfig.LoginReqOptions = {
"scope": "all", // 可选。申请授权权限列表, 默认值为"all"
"forceWebLogin": false, // 可选。是否强制使用网页登录,默认 false
"useQrCode": false, // 可选。是否使用扫码登录(仅在forceWebLogin为true时生效),默认 false
"networkTimeout": 0, // 可选。配置sdk内部WebView网页加载超时时长(单位ms,仅在>0时生效,如传入<=0 则sdk内部会使用默认值 5000ms)
};
QQ.login(obj, (obj: Record<string, string>) => {
/**
* 返回中有access_token和openid,及申请的开放平台appid,get请求如下地址获取qq的用户信息。
* https://graph.qq.com/user/get_user_info?access_token=YOUR_ACCESS_TOKEN&oauth_consumer_key=YOUR_APP_ID&openid=YOUR_OPENID
**/
console.warn(`qq登录返回: ${JSON.stringify(obj)}`);
});
七、其他参考方法
从手机相册选取照片,返回uris的示例方法,从开发调试时参考。
import common from '@ohos.app.ability.common';
import { fileIo as fs, fileUri } from '@kit.CoreFileKit';
import { photoAccessHelper } from '@kit.MediaLibraryKit';
// 选取相册照片示例,返回选中图片uri的数组格式,即uris。
async getPictureUriFromAlbum(type: 'video'|'image'): Promise<string[]> {
let PhotoSelectOptions = new photoAccessHelper.PhotoSelectOptions();
if (type === 'video') {
PhotoSelectOptions.MIMEType = photoAccessHelper.PhotoViewMIMETypes.VIDEO_TYPE;
PhotoSelectOptions.maxSelectNumber = 1;
}
if (type === 'image') {
PhotoSelectOptions.MIMEType = photoAccessHelper.PhotoViewMIMETypes.IMAGE_TYPE;
PhotoSelectOptions.maxSelectNumber = 18;
}
let photoPicker = new photoAccessHelper.PhotoViewPicker();
let photoSelectResult: photoAccessHelper.PhotoSelectResult = await photoPicker.select(PhotoSelectOptions);
let selectPhoto = photoSelectResult.photoUris;
console.warn(`选中的图片: ${JSON.stringify(selectPhoto)}`);
// 将选中的图片转uri路径
const allPath: string[] = selectPhoto.reduce((m: string[], itemPath) => {
let albumPath = itemPath;
let context = getContext(this) as common.UIAbilityContext;
let filePath = `${context.filesDir}/original-${Date.now()}.${type === 'video' ? 'mp4' : 'jpg'}`;
let file: fs.File | undefined;
file = fs.openSync(albumPath, fs.OpenMode.READ_ONLY);
fs.copyFileSync(file.fd, filePath);
fs.closeSync(file);
let uri: string = fileUri.getUriFromPath(filePath); // uri路径
m.push(uri);
return m;
}, []);
console.log(`选中的图片uri地址: ${JSON.stringify(allPath)}`);
return allPath;
}