Mobile Platform as a Service:共有

onShareAppMessage

Page オブジェクトで onShareAppMessage 関数を定義して、ページの共有情報を構成します。

• デフォルトでは、各ページの右上隅にあるメニューに [共有] ボタンが表示されます。onShareAppMessage 関数をオーバーライドして、共有コンテンツをカスタマイズできます。

• この関数は、ユーザーが [共有] ボタンをクリックしたときに呼び出されます。

• このイベントハンドラは、共有コンテンツをカスタマイズするために Object を返す必要があります。

入力パラメーター

戻り値

コードサンプル

Page({
  onShareAppMessage() {
    return {
      title: 'Miniapp Sample',
      desc: 'Official miniapp sample demo, showing supported API capabilities and components.',
      path: 'page/component/component-pages/view/view?param=123'
    };
  },
});

ページからの共有の開始

ボタンコンポーネントに open-type="share" プロパティを設定できます。ユーザーがボタンをクリックすると、Page.onShareAppMessage() イベントがトリガーされ、共有パネルが開きます。現在のページで onShareAppMessage 関数が定義されていない場合、ボタンをクリックしても効果がありません。詳細については、「button」をご参照ください。

App.onShareAppMessage

App(Object) コンストラクターでグローバルな onShareAppMessage 構成を設定できます。ページレベルの共有設定が構成されていない場合、共有が呼び出されるとグローバル共有設定が使用されます。

my.hideShareMenu(Object)

共有ボタンを非表示にします。

入力パラメーター

コードサンプル

my.hideShareMenu();

クライアント側の拡張機能の実装

ミニプログラムフレームワークは、実装が高度にカスタマイズ可能であるため、ネイティブの共有機能を提供していません。したがって、この機能を実装する必要があります。

実装

1. ミニプログラムから共有が開始されると、shareTinyAppMsg JavaScript API (JSAPI) が呼び出されます。この API は、JavaScript の onShareAppMessage メソッドから返されたオブジェクトのパラメーターをクライアントに渡します。

2. クライアントは、shareTinyAppMsg イベントを処理するためにカスタム JS プラグインを実装する必要があります。JS プラグインの実装方法の詳細については、「Android カスタム JSAPI」および「iOS カスタム JSAPI」をご参照ください。

Android コードサンプル

注：ミニプログラムの右上隅にあるオプションメニューの共有ボタンは、デフォルトで非表示になっています。このボタンを表示するには、コンテナーを構成する必要があります。詳細については、「コンテナー構成」をご参照ください。

• 次のコードサンプルは、ミニプログラムで共有を開始する方法を示しています：

  Page({
  data: {
    height: 0,
    title: 'Thank you for trying it out!\\nWe welcome any feedback'
  },
  onLoad() {
    const { windowHeight, windowWidth, pixelRatio } = my.getSystemInfoSync();
    this.setData({
      height: windowHeight * 750 / windowWidth
    })
  },
  onShareAppMessage() {
    return {
      title: 'Result Page',
      desc: 'Successfully retrieved the result',
      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 = "App ID: " + appId + "\n"
                        + "title: " + title + "\n"
                        + "desc: " + desc + "\n"
                        + "myprop: " + myprop + "\n"
                        + "path: " + path + "\n";
  
                AUNoticeDialog dialog = new AUNoticeDialog(event.getActivity(),
                        "Sharing Result", message, "Share Successful", "Share Failed");
                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, "Share failed");
                    }
                });
                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 = @"This is the web page title";
        message.desc = @"This is the description";
        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:@"Share successful"
                                   duration:2
                                     logTag:@"demo"];
            } else { // 失敗
                NSString *desc = error.localizedFailureReason.length > 0 ? error.localizedFailureReason : @"Share failed";
                [AUToast presentToastWithin:[[UIApplication sharedApplication] keyWindow]
                                   withIcon:AUToastIconNone
                                       text:desc
                                   duration:2
                                     logTag:@"demo"];
                NSLog(@"error = %@", error);
            }
        }];
    }
  
    @end