產品一直催我在 RN 項目中添加分享功能，一直沒找到合適的庫，今天讓我看到了一個插件分享給大家。 在集成插件之前，需要在各大開放平臺上成功注冊應用，并通過審核（支持 3 個可選的主流平臺）。支持的平臺如下：

• 微信開放平臺
• QQ 開放平臺
• 微博開放平臺

第一步 安裝:

在你的項目路徑下執行命令：

npm install jshare-react-native --save npm install jcore-react-native --save react-native link

第二步：配置

配置 info.plist

在 info.plist 文件中添加如下鍵值對

<key>LSApplicationQueriesSchemes</key> <array><!-- 微信 URL Scheme 白名單--><string>wechat</string><string>weixin</string><!-- 新浪微博 URL Scheme 白名單--><string>sinaweibohd</string><string>sinaweibo</string><string>sinaweibosso</string><string>weibosdk</string><string>weibosdk2.5</string><!-- QQ、Qzone URL Scheme 白名單--><string>mqqapi</string><string>mqq</string><string>mqqOpensdkSSoLogin</string><string>mqqconnect</string><string>mqqopensdkdataline</string><string>mqqopensdkgrouptribeshare</string><string>mqqopensdkfriend</string><string>mqqopensdkapi</string><string>mqqopensdkapiV2</string><string>mqqopensdkapiV3</string><string>mqqopensdkapiV4</string><string>mqzoneopensdk</string><string>wtloginmqq</string><string>wtloginmqq2</string><string>mqqwpa</string><string>mqzone</string><string>mqzonev2</string><string>mqzoneshare</string><string>wtloginqzone</string><string>mqzonewx</string><string>mqzoneopensdkapiV2</string><string>mqzoneopensdkapi19</string><string>mqzoneopensdkapi</string><string>mqqbrowser</string><string>mttbrowser</string> </array>

添加 URL Types

URL Types 設置

要是實現跳轉還需要在 Xcode 工程目錄中的 [TARGETS] -> [Info] 中設置：

HTTPS 設置

Apple 將從 2017 年開始執行 ATS(App Transport Security)，所有進行審核的應用中網絡請求全部支持 HTTPS，屆時以下配置將會失效，請提前做好準備。

目前 JSHARE 支持不存在新浪微博客戶端情況下的網頁分享，但是由于新浪微博的 api 尚未針對 https 做優化所以需要針對新浪的做對應的 https 設置。在 JSHARE 中是默認關閉新浪微博的網頁端分享的，如需使用這個功能則需要在 JSHARELaunchConfig 類的實例中將 isSupportWebSina 屬性設置為 YES。

以 iOS10 SDK 編譯的工程會默認以 SSL 安全協議進行網絡傳輸，即 HTTPS，如果依然使用 HTTP 協議請求網絡會報系統異常并中斷請求。目前可用如下這種方式保持用 HTTP 進行網絡連接：

在 info.plist 中加入安全域名白名單（右鍵 info.plist 用 source code 打開）

<key>NSAppTransportSecurity</key> <dict><!-- 配置允許 http 的任意網絡 End--><key>NSExceptionDomains</key><dict><!-- 集成新浪微博對應的 HTTP 白名單--><key>sina.com.cn</key><dict><key>NSIncludesSubdomains</key><true/><key>NSThirdPartyExceptionAllowsInsecureHTTPLoads</key><true/><key>NSThirdPartyExceptionRequiresForwardSecrecy</key><false/></dict><key>sinaimg.cn</key><dict><key>NSIncludesSubdomains</key><true/><key>NSThirdPartyExceptionAllowsInsecureHTTPLoads</key><true/><key>NSThirdPartyExceptionRequiresForwardSecrecy</key><false/></dict><key>sinajs.cn</key><dict><key>NSIncludesSubdomains</key><true/><key>NSThirdPartyExceptionAllowsInsecureHTTPLoads</key><true/><key>NSThirdPartyExceptionRequiresForwardSecrecy</key><false/></dict><key>sina.cn</key><dict><!-- 適配 iOS10 --><key>NSExceptionMinimumTLSVersion</key><string>TLSv1.0</string><key>NSIncludesSubdomains</key><true/><key>NSThirdPartyExceptionRequiresForwardSecrecy</key><false/></dict><key>weibo.cn</key><dict><!-- 適配 iOS10 --><key>NSExceptionMinimumTLSVersion</key><string>TLSv1.0</string><key>NSIncludesSubdomains</key><true/><key>NSThirdPartyExceptionRequiresForwardSecrecy</key><false/></dict><key>weibo.com</key><dict><!-- 適配 iOS10 --><key>NSExceptionMinimumTLSVersion</key><string>TLSv1.0</string><key>NSIncludesSubdomains</key><true/><key>NSThirdPartyExceptionAllowsInsecureHTTPLoads</key><true/><key>NSThirdPartyExceptionRequiresForwardSecrecy</key><false/></dict><!-- 新浪微博--> </dict> </dict>

第三步：Usage 使用

import JShareModule from 'jshare-react-native'; JShareModule.setup(param) // iOS 需要調用初始化函數, parm 這個參數 ，需要填入應用注冊信息，詳情可以參考 API 文檔

成功初始化后，就可以調用分享接口，我們先要構造消息對象，然后再調用 share()

//// platformString：'wechat_session' / 微信好友(會話) // 'wechat_timeLine' / 微信朋友圈 // 'wechat_favourite' / 微信收藏 // 'qq' / QQ 好友 // 'qzone' / QQ 空間 // 'sina_weibo' / 新浪微博 // 'sina_weibo_contact'/ 新浪微博聯系人////// textMessage =// {// type: 'text'// platform: platformString // 分享到指定平臺// text: String// imagePath: // 選填，新浪微博本地圖片地址，其他平臺沒有這個字段(iOS 不支持這個字段)// }// // imageMessage =// {// 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 必須三選一// }// // videoMessage =// {// type: 'video'// platform: platformString // 分享到指定平臺// title: String // 選填// url: String // 視頻跳轉頁面 url// text: String // 選填// imagePath: String // 選填，縮略圖，本地圖片路徑// // videoUrl: String // QQ 空間本地視頻 (iOS 不支持這個字段)// }// // audioMessage =// {// type: 'audio'// platform: platformString // 分享到指定平臺// musicUrl: String //必填 點擊直接播放的 url// url: String //選填，點擊跳轉的 url// imagePath: String //選填，縮略圖，本地圖片路徑，imagePath，imageUrl 必須二選一// imageUrl: String // 選填，網絡圖片路徑，imagePath，imageUrl 必須二選一// title: String // 選填 // text: String // 選填// }// // fileMessage =// {// type: 'file'// platform: platformString // 分享到指定平臺// path: String // 必填，文件路徑// fileExt: String // 必填，文件類型后綴// tile: String// }// // emoticonMessage =// {// type: 'emoticon'// platform: platformString // 分享到指定平臺// imagePath: String // 必填，本地圖片路徑// }// // appMessage =// {// 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 // 選填// }// 消息分享可以分享如上的類型，不同消息需要構建不同的消息對象// 當前支持 文字、圖片、音頻、視頻、文件、鏈接、app、表情JShareModule.share(message, successCallback, failCallback)

示例代碼（分享文本到微信好友）

var shareParam = {platform: "wechat_session",type: "text",text: "JShare test text" }; shareParam.imagePath = this.state.path // this.state.path 是本地圖片的路徑 JShareModule.share(shareParam, (result) => {console.log("share succeed, result: " + result); }, (error) => {console.log("share failed, map: " + error); });

到此我們已經成功集成了分享功能，其他的 API 使用建議參考 文檔

總結

以上是生活随笔為你收集整理的React Native 轻松集成分享功能（ iOS 篇）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。