React Native 轻松集成分享功能（Android 篇）
生活随笔
收集整理的這篇文章主要介紹了
React Native 轻松集成分享功能（Android 篇）
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
關于推送的集成請參考這篇文章，關于統計的集成請參考這篇文章，本篇文章將引導你集成分享功能。
在集成插件之前，需要在各大開放平臺上成功注冊應用，并通過審核（支持 3 個可選的主流平臺）。支持的平臺如下：
- 微信開放平臺
- QQ 開放平臺
- 微博開放平臺
第一步：安裝
npm install jshare-react-native --save npm install jcore-react-native --save react-native link第二步：配置
如果 link 失敗，則需要進行手動配置 settings.gradle 和 build.gradle 部分
2.1 配置 settings.gradle
your project/settings.gradle
include ':app', ':jshare-react-native', ':jcore-react-native' project(':jshare-react-native').projectDir = new File(rootProject.projectDir, '../node_modules/jshare-react-native/android') project(':jcore-react-native').projectDir = new File(rootProject.projectDir, '../node_modules/jcore-react-native/android')2.2 配置 build.gradle
your project/app/build.gradle
android {...defaultConfig {applicationId "your application id"...manifestPlaceholders = [JSHARE_PKGNAME: "cn.jiguang.share.demo",JPUSH_APPKEY: "your app key", //在此替換你的APPKeyJPUSH_CHANNEL: "developer-default", //應用渠道號, 默認即可TENCENT_APPID: "your tencent app id"]}...signingConfigs {debug {storeFile file("jshare.jks") //你的簽名文件路徑storePassword "sdkteam" //你的文件保存密碼keyAlias "jshare" //你的別名keyPassword "sdkteam" //你的簽名密碼}release {storeFile file("jshare.jks") //你的簽名文件路徑storePassword "sdkteam" //你的文件保存密碼keyAlias "jshare" //你的別名keyPassword "sdkteam" //你的簽名密碼}}buildTypes {release {minifyEnabled enableProguardInReleaseBuildsproguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"signingConfig signingConfigs.debug}debug {signingConfig signingConfigs.debug}}...dependencies {compile project(':jshare-react-native')compile project(':jcore-react-native')} }2.3 配置 AndroidManifest.xml
your app/AndroidManifest.xml
... <application>...<!-- Required. For publish channel feature --><!-- JPUSH_CHANNEL 是為了方便開發者統計APK分發渠道。--><!-- 例如: --><!-- 發到 Google Play 的APK可以設置為 google-play; --><!-- 發到其他市場的 APK 可以設置為 xxx-market。 --><!-- 目前這個渠道統計功能的報表還未開放。--><meta-data android:name="JPUSH_CHANNEL" android:value="${JPUSH_CHANNEL}"/><meta-data android:name="JPUSH_APPKEY" android:value="${JPUSH_APPKEY}"/><meta-data android:name="JSHARE_PKGNAME" android:value="${applicationId}" /><meta-data android:name="TENCENT_APPID" android:value="${TENCENT_APPID}" /><!-- Optional 微信分享回調,wxapi必須在包名路徑下，否則回調不成功--><activityandroid:name=".wxapi.WXEntryActivity"android:theme="@android:style/Theme.NoTitleBar"android:exported="true" /> </application>2.4 添加 WXEntryActivity
需要在你的 app 下新建一個 wxapi 的包名，然后創建 WXEntryActivity。
your app/src/.../wxapi/WXEntryActivity.java
package yourPackageName.wxapi;import cn.jiguang.share.wechat.WeChatHandleActivity;public class WXEntryActivity extends WeChatHandleActivity {}2.5 添加 JGShareSDK.xml
在你的 assets 目錄下添加 JGShareSDK.xml，并且將新浪微博，QQ，微信的 AppId 和 AppSecret 替換成自己的。
<?xml version="1.0" encoding="utf-8"?> <DevInfor><!-- 如果不需要支持某平臺，可缺省該平臺的配置--><!-- 各個平臺的KEY僅供DEMO演示，開發者要集成發布需要改成自己的KEY--><SinaWeiboAppKey="374535501"AppSecret="baccd12c166f1df96736b51ffbf600a2"RedirectUrl="https://www.jiguang.cn"/><QQAppId="1106011004"AppKey="YIbPvONmBQBZUGaN"/><WechatAppId="wxc40e16f3ba6ebabc"AppSecret="dcad950cd0633a27e353477c4ec12e7a"/> </DevInfor>做完了以上步驟，sync 一下項目，如果成功了，接下來就可以開始使用了。
2.6 加入 JSharePackage
your app/src/../MainApplication.java
@Overrideprotected List<ReactPackage> getPackages() {return Arrays.<ReactPackage>asList(new MainReactPackage(),new JSharePackage(SHUTDOWN_TOAST, SHUTDOWN_LOG)); }初始化：還是在 MainAppliation 中加入一下代碼初始化 JShareInterface：
@Override public void onCreate() {super.onCreate();SoLoader.init(this, false);// 在 Init 之前調用，設置為 true，則會打印 debug 級別日志，否則只會打印 warning 級別以上的日志// JShareInterface.setDebugMode(true);JShareInterface.init(this); }第三步：使用
接下來就可以在 JS 中引入 JShareModule 調用它的接口：
your component.js
... import JShareModule from 'jshare-react-native';Android 接口
getPlatformList(cb)
/*** 獲取SDK所有能用的平臺名稱，如要使用某個平臺，必須在JGShareSDK.xml中配置。* Android only* @param {Function} callback 返回值 list 是一個數組*/usage:
JShareModule.getPlatformList((list) => {console.log(list); });share(message, successCallback, failCallback)
/*** 分享* @param {object} message = {* * platformString 必填，用于分享置不同的平臺 //可以是 'wechat_session' / 'wechat_timeLine' / 'wechat_favourite' / 'qq' / 'qzone' / 'sina_weibo' / 'sina_weibo_contact' * type 必填* * {* type: 'text'* platform: platformString // 分享到指定平臺* text: String* imagePath: // 選填，新浪微博本地圖片地址，其他平臺沒有這個字段(iOS 不支持這個字段)* }* * {* type: 'image'* platform: platformString // 分享到指定平臺* imagePath: String // 本地圖片路徑 imagePath, imageUrl imageArray 必須三選一* text: String // 選填* imageUrl: String // 網絡圖片地址，必須以 http 或 https 開頭，imagePath, imageUrl imageArray 必須三選一 (iOS 不支持這個字段)* imageArray: [String] // (選填: 分享到 Qzone 才提供這個字段) 如果需要分享多張圖片需要這個參數，數組中問題圖片路徑 imagePath, imageUrl imageArray 必須三選一* }* * {* type: 'video'* platform: platformString // 分享到指定平臺* title: String // 選填* url: String // 視頻跳轉頁面 url* text: String // 選填* imagePath: String // 選填，縮略圖，本地圖片路徑* * videoUrl: String // QQ 空間本地視頻 (iOS 不支持這個字段)* }* * {* type: 'audio'* platform: platformString // 分享到指定平臺* musicUrl: String //必填 點擊直接播放的 url* url: String //選填，點擊跳轉的 url* imagePath: String //選填，縮略圖，本地圖片路徑，imagePath，imageUrl 必須二選一* imageUrl: String // 選填，網絡圖片路徑，imagePath， imageUrl 必須二選一* title: String // 選填 * text: String // 選填* }* * {* type: 'file'* platform: platformString // 分享到指定平臺* path: String // 必填，文件路徑* fileExt: String // 必填，文件類型后綴* tile: String* }* * {* type: 'emoticon'* platform: platformString // 分享到指定平臺* imagePath: String // 必填，本地圖片路徑* }* * {* type: 'app' // wechat_favourite 不支持* platform: platformString // 分享到指定平臺* url: String // 點擊跳轉 url* extInfo: String // 選填 第三方應用自定義數據* path: String // 選填 對應 app 數據文件* title: String // 選填* text: String // 選填* }* * {* type: 'link'* platform: platformString // 分享到指定平臺* url: String // 必填，網頁 url* imagePath: String // 選填，本地圖片路徑 imagePath，imageUrl 必須二選一 * imageUrl: String // 選填，網絡圖片地址 imagePath imageUrl 必須二選一 (iOS 不支持)* title: String // 選填* text: String // 選填* }* * {* type: 'undefined'* platform: platformString // 分享到指定平臺* }* * @param {Function} success = function (state) {} ## * state = {state: String} state = 'success' / 'fail' / 'cancel' / 'unknow'** @param {Function} fail = function (error) {} ## * error = {code: number, descript: String}*/usage:
var message = {platform: "wechat_session",type: "image",text: "JShare test text",imagePath: "/storage/emulated/0/DCIM/Camera/xx.jpg"}; JShareModule.share(message, (map) => {console.log("share succeed, map: " + map); }, (map) => {console.log("share failed, map: " + map); })getSocialUserInfo(param, successCallback, failCallback)
/*** 獲取社交平臺用戶信息* @param {Object} param = {* platform: String //可以是 'wechat_session' / 'wechat_timeLine' / 'wechat_favourite' / 'qq' / 'qzone' / 'sina_weibo' / 'sina_weibo_contact' * }* @param {Function} success function (userInfo) {} * userInfo = {* name: String * iconUrl: String // 社交平臺頭像鏈接* gender: String // 'female' / 'male'* response: Object // 社交平臺上的原始數據* }** @param {Function} fail = function (error) {} ## * error = {code: number, descript: String}*/usage:
var param = {platform: "wechat_session" }; JShareModule.getSocialUserInfo(param, (map) => {console.log(map);}, (errorCode) => {console.log("errorCode: " + errorCode); });isPlatformAuth(param, callback)
/*** 判斷某平臺是否支持授權* * @param {Object} param = {* platform: String //可以是 'wechat_session' / 'wechat_timeLine' / 'wechat_favourite' / 'qq' / 'qzone' / 'sina_weibo' / 'sina_weibo_contact' * }* @param {Function} callback = (Boolean) => {} */usage:
var param = { platform: "wechat_session" }; JShareModule.isPlatformAuth(param, (result) => { console.log(param.platform + "is Auth: " + result); });isClientValid(param, callback)
/*** 判斷該平臺的分享是否有效* Android only* @param {Object} param = {* platform: String //可以是 'wechat_session' / 'wechat_timeLine' / 'wechat_favourite' / 'qq' / 'qzone' / 'sina_weibo' / 'sina_weibo_contact' * }* @param {Function} callback = (Boolean) => {} */usage:
var param = {platform: "wechat_session" }; JShareModule.isClientValid(param, (result) => {console.log(param.platform + "is valid: " + result); });authorize(param, successCallback, failCallback)
/*** 授權接口* @param {Object} param = {* platform: String //可以是 'wechat_session' / 'wechat_timeLine' / 'wechat_favourite' / 'qq' / 'qzone' / 'sina_weibo' / 'sina_weibo_contact' * }* @param {Function} success * @param {Function} fail */usage:
var param = {platform: "wechat_session" }; JShareModule.authorize(param, (map) => {console.log("Authorize succeed " + map); }, (errorCode) => {console.log("Authorize failed, errorCode : " + errorCode); });isAuthorize(param, callback)
/*** 判斷是否授權接口* @param {Object} param = {* platform: String //可以是 'wechat_session' / 'wechat_timeLine' / 'wechat_favourite' / 'qq' / 'qzone' / 'sina_weibo' / 'sina_weibo_contact' * } * @param {Function} callback = (Boolean) => {} */usage:
var param = { platform: "wechat_session" }; JShareModule.isAuthorize(param, (result) => { console.log("param is Authorize: " + result); });cancelAuthWithPlatform(param, callback)
/*** 刪除用戶授權本地數據* * @param {Object} param = {* platform: String //可以是 'wechat_session' / * 'wechat_timeLine' / * 'wechat_favourite' / * 'qq' / * 'qzone' /* 'sina_weibo' /* 'sina_weibo_contact' * }* @param {Function} callback = (Int) => {}* @code 返回碼，0 表示成功刪除*/usage:
var param = {platform: "wechat_session" }; JShareModule.cancelAuthWithPlatform(param, (code) => {if (code === 0) {console.log("remove authorize succeed");} else {console.log("remove authorize failed, errorCode: " + code);} });
作者：KenChoi - 極光推送
原文：React Native 輕松集成分享功能（Android 篇）
知乎專欄：極光日報
轉載于:https://www.cnblogs.com/jpush88/p/7767080.html
總結
以上是生活随笔為你收集整理的React Native 轻松集成分享功能（Android 篇）的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： C++中delete和delete[]的
- 下一篇： Android.mk解析【转】