WeChatミニプログラムの友達への転送機能

hzc
リリース: 2020-06-28 10:03:03
転載
3692 人が閲覧しました

今日は、WeChat アプレットの転送機能について簡単に説明します。なぜ簡単に説明する必要があるのでしょうか。主に友人やグループへの転送について説明しているからです。友人のサークルへの別の種類の共有もあります。もう少し複雑です。最初に少し説明します。モーメントに共有するには主に 2 つの方法があります。1 つはバックグラウンドでポスター画像を直接生成する方法、もう 1 つはフロントエンドのキャンバスを通じてポスターを生成する方法です。詳しくは機会があればお話しますが、本題に戻り、転送友達の話を続けましょう。

最初に WeChat アプレットの API を紹介します: onShareAppMessage(options)

Page で onShareAppMessage 関数を定義して、ページの転送情報を設定します。

  • このイベントハンドラが定義されている場合のみ、右上隅のメニューに「進む」ボタンが表示されます

  • 呼び出されますユーザーが進むボタンをクリックしたとき

  • #このイベントは、カスタム転送コンテンツのオブジェクトを返す必要があります

オプション パラメーターの説明

パラメータタイプ説明最小バージョンfromStringイベント ソースを転送します。 button: ページ内の転送ボタン; menu: 右上隅の転送メニュー1.2.4targetObjectIf from 値が button の場合、ターゲットはこの転送イベントをトリガーしたボタンです。それ以外の場合は未定義です1.2.4
カスタム転送フィールド

フィールド#説明#デフォルト値#最小バージョン#titleパス#imageUrl# で始まる完全なパスである必要があります。 ##カスタマイズされた画像パスは、ローカル ファイル パス、コード パッケージ ファイル パス、またはネットワーク イメージ パスにすることができます。PNG と JPG をサポートしています。imageUrl が渡されない場合は、デフォルトのスクリーンショットが使用されます。表示される画像のアスペクト比は 5:4#fail##1.1.0shareTickets という別の値があり、これは次のように正常に返されます。 1 つの項目は、転送オブジェクトに対応する shareTicket です。API は最初にこれについて説明し、次に転送の実装について説明します。
タイトルを転送 現在のアプレット名
転送パス 現在のページのパスは、/
##1.5.0
##success
転送成功時のコールバック関数
#1.1.0
転送失敗時のコールバック関数
#complete 転送終了時のコールバック関数 (転送が成功または失敗した場合に実行されます
1.1.0


最初の画像:
まず、onLoad で wx.showShareMenu を設定します。

  onLoad: function (e) {
    wx.showShareMenu({
      // 要求小程序返回分享目标信息
      withShareTicket: true
    }); 
  },
ログイン後にコピー

次に、onShareAppMessage を設定します。
/* 转发*/
  onShareAppMessage: function (ops) {    if (ops.from === 'button') {
      // 来自页面内转发按钮
      console.log(ops.target)
    }    return {
      title: '转发dom',
      path: `pages/index/index`,
      success: function (res) {
        // 转发成功
        console.log("转发成功:" + JSON.stringify(res));
        var shareTickets = res.shareTickets;
        // if (shareTickets.length == 0) {
        //   return false;
        // }
        // //可以获取群组信息
        // wx.getShareInfo({
        //   shareTicket: shareTickets[0],
        //   success: function (res) {
        //     console.log(res)
        //   }
        // })
      },
      fail: function (res) {
        // 转发失败
        console.log("转发失败:" + JSON.stringify(res));
      }
    }
  },
ログイン後にコピー

取得するための wx.getShareInfo について説明します。転送の詳細

完全な js コードは

//index.js
//获取应用实例
const app = getApp()

Page({
  data: {
    motto: 'Hello World',
  },
  onLoad: function (e) {
    wx.showShareMenu({
      // 要求小程序返回分享目标信息
      withShareTicket: true
    }); 
  },
  /* 转发*/
  onShareAppMessage: function (ops) {    if (ops.from === 'button') {
      // 来自页面内转发按钮
      console.log(ops.target)
    }    return {
      title: '转发dom',
      path: `pages/index/index`,
      success: function (res) {
        // 转发成功
        console.log("转发成功:" + JSON.stringify(res));
        var shareTickets = res.shareTickets;
        // if (shareTickets.length == 0) {
        //   return false;
        // }
        // //可以获取群组信息
        // wx.getShareInfo({
        //   shareTicket: shareTickets[0],
        //   success: function (res) {
        //     console.log(res)
        //   }
        // })
      },
      fail: function (res) {
        // 转发失败
        console.log("转发失败:" + JSON.stringify(res));
      }
    }
  },
})
ログイン後にコピー

賢い学生は次のステップが wxml コードであることを知っておくべきです

<view class="container">
  <view class="userinfo">
   <button open-type="share">分享好友</button>
  </view>
  <view class="usermotto">
    <text class="user-motto">{{motto}}</text>
  </view>
</view>
ログイン後にコピー
ボタンをクリックして共有すると、 、ボタンは open-type= "share" に設定する必要があります。そうしないと機能しません。

この記事が良くて役立つと思われる場合は、お友達と共有して「いいね!」してください。何も理解できない場合は、以下にメッセージを残してください。

推奨チュートリアル: 「

WeChat ミニ プログラム

以上がWeChatミニプログラムの友達への転送機能の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:juejin.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート