分享 - Mobile Platform as a Service

此功能僅在 10.1.60 以及以上基準版本中支援，用戶端需在原生代碼中實現分享功能。

onShareAppMessage

在 Page 中定義 onShareAppMessage 函數，設定該頁面的分享資訊。

每個 Page 頁面的右上方菜單中預設會顯示分享按鈕，重寫了 onShareAppMessage 函數，只是自訂分享內容。
該介面在使用者點擊分享按鈕時調用。
此事件需要返回一個 Object，用於自訂分享內容。

入參

參數	類型	說明	最低版本
from	String	觸發來源： button：頁面頁分享按鈕觸發； menu：右上方分享按鈕觸發。	1.10.0
target	Object	如果 `from` 值為 button，則 `target` 為觸發這次分享的 button，否則為 undefined。	1.10.0
webViewUrl	String	頁面中包含 web-view 組件時，返回當前 web-view 的 URL。	1.6.0

傳回值

名稱	類型	必填	描述	最低版本
title	String	是	自訂分享標題。	無
desc	String	否	自訂分享描述：由於分享到微博只支援最大長度 140 個字，因此建議長度不要超過該限制。	無
path	String	是	自訂分享頁面的路徑，`path` 中的自訂參數可在小程式生命週期的 onLoad 方法中擷取（參數傳遞遵循 http get 的傳參規則）。用戶端實現分享情境時，該欄位在原生代碼的名稱對應為 page 。	無
imageUrl	String	否	自訂分享小表徵圖元素，支援網狀圖片路徑、apFilePath 路徑和相對路徑。	1.4.0
bgImgUrl	String	否	自訂分享預覽大圖，建議尺寸 750x825，支援網狀圖片路徑、apFilePath 路徑和相對路徑。	1.9.0
success	Function	否	分享成功後回調。	1.4.0
fail	Function	否	分享失敗後回調。	1.4.0

程式碼範例

Page({
  onShareAppMessage() {
    return {
      title: '小程式樣本',
      desc: '小程式官方樣本 Demo，展示已支援的介面能力及組件。',
      path: 'page/component/component-pages/view/view?param=123'
    };
  },
});

頁面內發起分享

說明

基礎庫版本 1.1.0 開始支援。

通過給 button 組件設定屬性 open-type="share"，可以在使用者點擊按鈕後觸發 Page.onShareAppMessage() 事件，並喚起分享面板，如果當前頁面沒有定義此事件，則點擊後無效果。相關組件：button。

App.onShareAppMessage

可以在 App(Object) 建構函式中設定全域的分享 onShareAppMessage 配置，當調用分享時，如果未配置頁面級的分享設定則會使用全域的分享設定。

my.hideShareMenu(Object)

說明

基礎庫版本 1.7.0 開始支援，低版本需做相容處理。

隱藏分享按鈕。

入參

名稱	類型	必填	說明
success	Function	否	調用成功的回呼函數。
fail	Function	否	調用失敗的回呼函數。
complete	Function	否	調用結束的回呼函數（調用成功、失敗都會執行）。

程式碼範例

my.hideShareMenu();

用戶端擴充功能實現

由於分享的實現自訂程度比較高，因此目前暫不提供原生的小程式分享功能，需要您自己實現。

實現方式

小程式端發起分享時會調用 shareTinyAppMsg 的 JSAPI，它會將 JS 中 onShareAppMessage 方法返回的對象中的參數透傳給用戶端。
用戶端側需實現自訂 JS 外掛程式處理 shareTinyAppMsg 事件。關於 JS 外掛程式如何?，需分別參考 Android 自訂 JSAPI 和 iOS 自訂 JSAPI 。

Android 程式碼範例

說明：小程式右上方選項菜單中的分享按鈕預設隱藏，需要通過配置容器開關顯示，詳情參見容器配置。

在小程式代碼中發起分享樣本如下：

Page({
data: {
  height: 0,
  title: '感謝體驗!\n有任何建議歡迎反饋'
},
onLoad() {
  const { windowHeight, windowWidth, pixelRatio } = my.getSystemInfoSync();
  this.setData({
    height: windowHeight * 750 / windowWidth
  })
},
onShareAppMessage() {
  return {
    title: '結果頁',
    desc: '成功擷取到結果',
    myprop: 'hello', //自訂參數，如果文檔中欄位不滿足需求，可根據需求增加，會被透傳至用戶端
    path: 'pages/result/result'
  }
}
});

用戶端側 H5 外掛程式程式碼範例如下：

  package com.mpaas.demo.nebula;

  import com.alibaba.fastjson.JSONObject;
  import com.alipay.mobile.antui.dialog.AUNoticeDialog;
  import com.alipay.mobile.h5container.api.H5BridgeContext;
  import com.alipay.mobile.h5container.api.H5Event;
  import com.alipay.mobile.h5container.api.H5EventFilter;
  import com.alipay.mobile.h5container.api.H5SimplePlugin;

  public class ShareTinyMsgPlugin extends H5SimplePlugin {

      private static final String ACTION_SHARE = "shareTinyAppMsg";

      @Override
      public void onPrepare(H5EventFilter filter) {
          super.onPrepare(filter);
          filter.addAction(ACTION_SHARE);
      }

      @Override
      public boolean handleEvent(H5Event event, final H5BridgeContext context) {
          String action = event.getAction();
          if (ACTION_SHARE.equals(action)) {
              JSONObject param = event.getParam();
              String title = param.getString("title");
              String desc = param.getString("desc");
              String myprop = param.getString("myprop");
              String path = param.getString("page");
              String appId = event.getH5page().getParams().getString("appId");

              // 此處可調用分享組件，實現後續功能
              String message = "應用ID： " + appId + "\n"
                      + "title: " + title + "\n"
                      + "desc: " + desc + "\n"
                      + "myprop: " + myprop + "\n"
                      + "path: " + path + "\n";

              AUNoticeDialog dialog = new AUNoticeDialog(event.getActivity(),
                      "分享結果", message, "分享成功", "分享失敗");
              dialog.setPositiveListener(new AUNoticeDialog.OnClickPositiveListener() {
                  @Override
                  public void onClick() {
                      JSONObject result = new JSONObject();
                      result.put("success", true);
                      context.sendBridgeResult(result);
                  }
              });
              dialog.setNegativeListener(new AUNoticeDialog.OnClickNegativeListener() {
                  @Override
                  public void onClick() {
                      context.sendError(11, "分享失敗");
                  }
              });
              dialog.show();
              //
              return true;
          }
          return false;
      }
  }

iOS 程式碼範例

小程式右上方的分享按鈕預設為隱藏，您可以在容器初始化時，設定以下介面，以顯示分享按鈕：

說明：需手動引入對應標頭檔 #import <TinyappService/TASUtils.h>。

  - (void)application:(UIApplication *)application afterDidFinishLaunchingWithOptions:(NSDictionary *)launchOptions {

      ...

      [TASUtils sharedInstance].shoulShowSettingMenu = YES;

      ...
  }

自訂實現 shareTinyAppMsg JsApi，接受小程式頁面透傳的參數：

在 MPJsApi4ShareTinyAppMsg 的實作類別中，您可以擷取到小程式頁面分享的參數，進行業務處理。範例程式碼如下：

  #import <NebulaPoseidon/NebulaPoseidon.h>
  @interface MPJsApi4ShareTinyAppMsg : PSDJsApiHandler

  @end

  #import "MPJsApi4ShareTinyAppMsg.h"
  #import <MessageUI/MessageUI.h>      

  @interface MPJsApi4ShareTinyAppMsg()<APSKLaunchpadDelegate>

  @property(nonatomic, strong) NSString *shareUrlString;

  @end

  @implementation MPJsApi4ShareTinyAppMsg

  - (void)handler:(NSDictionary *)data context:(PSDContext *)context callback:(PSDJsApiResponseCallbackBlock)callback
  {
      [super handler:data context:context callback:callback];

      NSString * appId = context.currentSession.createParam.expandParams[@"appId"];
      NSString * page = data[@"page"]?:@"";
      NSString * title = data[@"title"]?:@"";
      NSString * desc = data[@"desc"]?:@"";

      // 拼接分享的內容，調用分享 SDK
      self.shareUrlString = [NSString stringWithFormat:@"http://appId=%@&page=%@&title=%@&desc=desc", appId, page, title, desc];
      [self openPannel];
  }

  - (void)openPannel {
      NSArray *channelArr = @[kAPSKChannelWeibo, kAPSKChannelWeixin, kAPSKChannelWeixinTimeLine, kAPSKChannelSMS, kAPSKChannelQQ, kAPSKChannelQQZone, kAPSKChannelDingTalkSession, kAPSKChannelALPContact, kAPSKChannelALPTimeLine];
      APSKLaunchpad *launchPad = [[APSKLaunchpad alloc] initWithChannels:channelArr sort:NO];
      launchPad.tag = 1000;
      launchPad.delegate = self;

      [launchPad showForView:[[UIApplication sharedApplication] keyWindow] animated:YES];
  }

  #pragma mark - APSKLaunchpadDelegate
  - (void)sharingLaunchpad:(APSKLaunchpad *)launchpad didSelectChannel:(NSString *)channelName {
      [self shareWithChannel:channelName tag:launchpad.tag];
      [launchpad dismissAnimated:YES];
  }

  - (void)shareWithChannel:(NSString *)channelName tag:(NSInteger)tag{
      APSKMessage *message = [[APSKMessage alloc] init];
      message.contentType = @"url";//類型分"text","image", "url"三種
      message.content = [NSURL URLWithString:self.shareUrlString];
      message.icon = [UIImage imageNamed:@"MPShareKit.bundle/Icon_Laiwang@2x.png"];
      message.title = @"這裡是網頁標題";
      message.desc = @"這裡是描述資訊";
      APSKClient *client = [[APSKClient alloc] init];
      client.disableToastDisplay = YES;

      [client shareMessage:message toChannel:channelName completionBlock:^(NSError *error, NSDictionary *userInfo) {
          if(!error) {// 成功
              [AUToast presentToastWithin:[[UIApplication sharedApplication] keyWindow]
                                 withIcon:AUToastIconSuccess
                                     text:@"分享成功"
                                 duration:2
                                   logTag:@"demo"];
          } else {// 失敗
              NSString *desc = error.localizedFailureReason.length > 0 ? error.localizedFailureReason : @"分享失敗";
              [AUToast presentToastWithin:[[UIApplication sharedApplication] keyWindow]
                                 withIcon:AUToastIconNone
                                     text:desc
                                 duration:2
                                   logTag:@"demo"];
              NSLog(@"error = %@", error);
          }
      }];
  }

  @end