https://github.com/haxibiao/react-native-qq-lib
🔥 React Native bridging library that integrates QQ SDKs. QQ 登陆 分享，集成 QQ SDK
https://github.com/haxibiao/react-native-qq-lib
qq qq-sdk react react-native react-native-module react-native-qq share
Last synced: 15 days ago
JSON representation
🔥 React Native bridging library that integrates QQ SDKs. QQ 登陆 分享，集成 QQ SDK
- Host: GitHub
- URL: https://github.com/haxibiao/react-native-qq-lib
- Owner: haxibiao
- Created: 2020-09-03T07:07:24.000Z (almost 5 years ago)
- Default Branch: master
- Last Pushed: 2021-11-12T04:24:14.000Z (over 3 years ago)
- Last Synced: 2025-05-21T22:14:34.913Z (about 1 month ago)
- Topics: qq, qq-sdk, react, react-native, react-native-module, react-native-qq, share
- Language: Objective-C
- Homepage: https://www.npmjs.com/package/react-native-qq-lib
- Size: 4.08 MB
- Stars: 25
- Watchers: 3
- Forks: 19
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# react-native-qq-lib
[](https://badge.fury.io/js/react-native-qq-lib)
React Native bridging library that integrates QQ SDKs. QQ 登陆 分享，集成 QQ SDK react-native 版本需要 0.40.0 及以上
## 前言
首先向各位声明，本库是在 [react-native-qq](https://github.com/reactnativecn/react-native-qq) 基础上进行重写。
本身是维护给自己使用的，考虑到自身使用和其它开发者的需要，最终决定开一个新仓库，提供给新项目使用。
最后，感谢 [lvbingru](https://github.com/lvbingru)，[tdzl2003](https://github.com/tdzl2003) 和各位开发者为 react-native-qq 做出的贡献。
### 集成 QQ SDK 包版本
> Android SDK 版本：v3.5.4.11（2021-04-27）
> IOS SDK 版本：v3.3.9（2020-04-27）
## 如何安装
### 首先安装 npm 包
```bash
yarn add github:haxibiao/react-native-qq-lib
```
或
```bash
npm install -D github:haxibiao/react-native-qq-lib
```
然后执行
```bash
cd ios && pod install && cd ..
```
### 安装 iOS 工程
在工程 plist 文件中加入 qq 白名单：(ios9 以上必须)
请以文本方式打开 Info.plist，在其中添加
```xml
LSApplicationQueriesSchemes
mqqapi
mqq
mqqOpensdkSSoLogin
mqqconnect
mqqopensdkdataline
mqqopensdkgrouptribeshare
mqqopensdkfriend
mqqopensdkapi
mqqopensdkapiV2
mqqopensdkapiV3
mqzoneopensdk
wtloginmqq
wtloginmqq2
mqqwpa
mqzone
mqzonev2
mqzoneshare
wtloginqzone
mqzonewx
mqzoneopensdkapiV2
mqzoneopensdkapi19
mqzoneopensdkapi
mqzoneopensdk
```
在`Info->URL Types` 中增加 QQ 的 scheme： `Identifier` 设置为`qq`, `URL Schemes` 设置为你注册的 QQ 开发者账号中的 APPID，需要加前缀`tencent`，例如`tencent1104903684`
在你工程的`AppDelegate.m`文件中添加如下代码：
```
#import
#import
#import
- (BOOL)application:(UIApplication *)application handleOpenURL:(NSURL *)url {
if ([TencentOAuth CanHandleOpenURL:url]) {
return [TencentOAuth HandleOpenURL:url];
}
return YES;
}
- (BOOL)application:(UIApplication *)application
continueUserActivity:(NSUserActivity *)userActivity
restorationHandler:(void(^)(NSArray> * __nullable
restorableObjects))restorationHandler {
// 触发回调方法
[RCTLinkingManager application:application continueUserActivity:userActivity restorationHandler:restorationHandler];
NSURL *url = userActivity.webpageURL;
if (url && [TencentOAuth CanHandleUniversalLink:url]) {
return [TencentOAuth HandleUniversalLink:url];
}
return YES;
}
```
### 安装 Android 工程
在`android/app/build.gradle`里，defaultConfig 栏目下添加如下代码：
```
manifestPlaceholders = [
QQ_APPID: "<平台申请的APPID>"
]
```
以后如果需要修改 APPID，只需要修改此一处。
## 如何使用
### 引入包
```
import * as QQAPI from 'react-native-qq-lib';
```
### API
#### QQAPI.init()
初始化，调用其他api时请先调用该api（3.1.0以前版本无需调用此方法,会自动初始化）
#### QQAPI.login([scopes])
- scopes: 登录所申请的权限，默认为 get_simple_userinfo。 需要多个权限时，以逗号分隔。
调用 QQ 登录，可能会跳转到 QQ 应用或者打开一个网页浏览器以供用户登录。在本次 login 返回前，所有接下来的 login 调用都会直接失败。
返回一个`Promise`对象。成功时的回调为一个类似这样的对象：
```javascript
{
"access_token": "CAF0085A2AB8FDE7903C97F4792ECBC3",
"openid": "0E00BA738F6BB55731A5BBC59746E88D"
"expires_in": "1458208143094.6"
"oauth_consumer_key": "12345"
}
```
#### QQAPI.shareToQQ(data)
分享到 QQ 好友，参数同 QQAPI.shareToQzone，返回一个`Promise`对象
#### QQAPI.shareToQzone(data)
分享到 QZone，参数为一个 object，可以有如下的形式：
```javascript
// 分享图文消息
{
type: 'news',
title: 分享标题,
description: 描述,
webpageUrl: 网页地址,
imageUrl: 远程图片地址,
}
// 分享文本消息
{
type: 'text',
text: 分享内容,
}
// 分享图片
// By：这里的 imageUrl 和 imageLocalUrl 都要传而且保持一致（别问我为啥埋这个坑，问就是腾讯的 SDK 这样搞的）
// 支持的路径如： file:// content:// /data/user/0/com.xxxxx/cache/
{
type: 'image',
imageUrl: 图片路径,
imageLocalUrl: 图片路径,
}
// 其余格式尚未实现。
```
图片路径不支持 http 和 https 网络地址（网络地址的先自己下载图片，这里推荐[rn-fetch-blob](https://github.com/joltup/rn-fetch-blob#readme)库）。
```
import RNFetchBlob from 'rn-fetch-blob';
const _image = 图片地址或路径;
if (RegExp(/http:\/\//).exec(_image) || RegExp(/https:\/\//).exec(_image)) {
// 判断是网络地址的话先下载图片，然后再分享图片
RNFetchBlob.config({
fileCache: true,
appendExt: "png",
})
.fetch("GET", _image)
.then((res) => {
const qq = QQAPI.shareToQzone({
type: "image",
imageUrl: res.path(),
imageLocalUrl: res.path(),
});
qq.then(() => {
__onSucceed();
}).catch(() => {
});
})
.catch((error) => {
});
} else {
const qq = QQAPI.shareToQzone({
type: "image",
imageUrl: _image,
imageLocalUrl: _image,
});
qq.then(() => {
}).catch(() => {
});
}
```
## 常见问题
#### Android: 调用 QQAPI.login()没有反应
通常出现这个原因是因为 Manifest 没有配置好，检查 Manifest 中有关 Activity 的配置。
#### Android: 已经成功激活 QQ 登录，但回调没有被执行
通常出现这个原因是因为 MainActivity.java 中缺少 onActivityResult 的调用。
#### Android: 应用商店检测到未授权前获取隐私信息
出现这个原因是因为sdk在同意隐私政策之前就自动初始化了，目前3.1.0版本已将初始化api暴露，取消了自动初始化，可在RN端自由调整初始化时机。