https://d226lax1qjow5r.cloudfront.net/blog/blogposts/integrating-the-conversation-api-with-wechat-dr/E_WeChat-Conversation-API_1200x600-1.png

Conversation APIとWeChatの統合

最終更新日 November 8, 2020

所要時間:1 分

注:この記事で説明されているツールや方法の中には、サポートが終了しているものや最新のものではないものがあります。最新の内容やサポートについては、最新の投稿をご確認いただくか、Vonage Community Slackの VonageコミュニティSlack

このブログポストでは、Conversation APIを使用してアプリケーションと外部通信チャネルを確立する方法を紹介し、WeChatを使用してその方法を実演します。

WeChatのパブリックAPIを使用し、それをConversation APIに接続して、WeChatクライアントとVonageクライアント間の双方向メッセージングを可能にします。 カスタムイベント.

こちらの GitHub リポジトリを参照してください。

コンセプト

を使用する予定です。 カスタム・イベントを使ってWeChatのメッセージをシミュレートし、WeChatのパブリックAPIとやりとりするミドルウェアサーバーを構築します。

クライアントがWeChatを使ってメッセージを送信したい場合、'custom:message:wechat'タイプのカスタムイベントをoutbound方向で作成する。そして、ミドルウェアサーバーはそのイベントをピックアップする。 RTCイベントを使ってそのイベントをピックアップし、WeChatのAPIへのHTTPリクエストに変換してメッセージで通知する。

インバウンドメッセージの場合(WeChatクライアントからVonageクライアントへ)、ミドルウェアサーバはWeChatのメッセージングウェブフックを実装し、WeChatから新しいメッセージの通知を受けます。サーバーは 'custom:message:wechat' イベントをインバウンド方向で作成し、ディスパッチします。クライアントはそのイベントを受け取り、WeChat メッセージとして表示します。

An illustration showing the described architectureAn illustration showing the described architecture

前提条件

微信

ウィーチャットは、テンセントが開発した中国の多目的メッセージング、ソーシャルメディア、モバイル決済アプリである。10億人以上のユーザーを抱え、主要なメッセージング・チャンネルとして無視できない存在となっている。中国のWeChatを米国のFacebookと関連付けることができる。

WeChatは、開発者がメッセージを送受信できるAPIを提供している。この投稿では、WeChatのサンドボックスとともにWeChatアカウントを使用します。これはWeChatとのセットアップを簡単にするためであることに注意してください。

このステップバイステップガイドに従って、WeChat API をセットアップすることができます。このステップバイステップは、あなたがすでに私たちのサンプルの統合サーバーを実行していることを前提としています。

  1. サンドボックスアカウントを登録する リンク

  2. サーバーを実行します。この例では、ngrokを使用します。

  3. あなたのngrokアドレスを使用して、ウェブフック情報を記入してください。サーバーエンドポイントは https://[$NGROK_ADDRESS].com/weChatEvent NGROK_ADDRESS]をあなたのngrokアドレスに置き換えてください。

  4. 任意のトークンを埋める

  5. 送信ボタンをクリックし、WeChat がウェブフックを確認するまで待ちます。

  6. これで受信メッセージの準備は完了です!

WeChat ScreenshotWeChat Screenshot

WeChatから当社サーバーへのメッセージ送信を開始するには、WeChatに公式アカウントを追加する必要があります。そのためには

  1. あなたの サンドボックスアカウント

  2. テスト番号QRコード」までスクロールダウンする

  3. WeChatでQRコードをスキャンしてください。

  4. チャットを始める!

WeChat ScreenshotWeChat Screenshot

これで、WeChatクライアントからWeChatアカウントにメッセージを送信し、WeChatサーバーの実行中のインスタンス上の /weChatEventルートで受信できます。

Conversation API

Conversation APIは、Users、Members、Conversationsなどの様々なオブジェクトを作成できる低レベルAPIです。ConversationはAPIの基本コンセプトです。Conversationsは2人以上のUsersの間で交わされるコミュニケーションのコンテナで、1つのやりとりであったり、2人の間のすべてのやりとりの履歴であったりします。

APIについての詳細は ドキュメンテーション.必要なもの

  1. アプリケーション

  2. 対談

  3. APIキーとシークレットへのアクセス

セットアップ

example.envファイルには、統合を立ち上げて実行するために必要なすべてのパラメータが含まれています。この例を簡単にするために、ハードコードされた会話IDを使用しますが、これは必須ではありません。

READMEファイルの指示に従ってください。 ngrokドキュメントを参照してください。

必要なパラメーターをすべて設定したら、「npm start」でコードを実行するだけだ。

WeChatメッセージの送受信

を送信するには アウトバウンドメッセージを送信するには Vonageクライアントからから WeChatクライアント)を送信するには、以下のカスタムイベントを作成する必要があります:

{
	"type":"custom:wechat:message",
	"body":{
		"to":"we_chat_client_id",
		"from":"we_chat_integration_id",
		"content":"Hello from Vonage!",
		"direction":"outbound"
	}
}

インバウンド インバウンドメッセージの場合 WeChatクライアントからから Vonageクライアント)は、同じイベントを作成する必要がありますが、その方向は逆になります。

{
	"type":"custom:wechat:message",
	"body":{
		"to":"we_chat_integration_id",
		"from":"we_chat_client_id",
		"content":"Hello from WeChat!",
		"direction":"outbound"
	}
}

WeChatイベントをディスパッチする方法を示す以下のスニペットをご覧ください:

const dispatchWeChatEvent = (wechat, direction = 'inbound') => {
  var options = {
    uri: `https://api.nexmo.com/v0.1/conversations/${conversationId}/events`,
    method: 'POST',
    headers: {
      Authorization: 'Bearer ' + jwt,
      Accept: 'application/json',
      'Content-Type': 'application/json'
    },
    json: {
      type: 'custom:wechat:message',
      body: {
        to: wechat.getTo(),
        from: wechat.getFrom(),
        content: wechat.getContent(),
        direction
      }
    }
  };

  request(options, (error, response, body) => {
    if (!error && response.statusCode == 200) {
      console.log('successfully sent WeChat message'); 
    }
  });
};

Vonageクライアントはカスタムイベントを受信し、WeChatメッセージとして解析する。

総括

これまでのセクションで、Conversation APIを使ってWeChatとアプリケーションを統合する方法を学びました。しかし、WeChatはConversation APIで統合できるものの一例に過ぎません。WhatsAppのような別のメッセージングチャネル、あるいはEmailのような別のコミュニケーションチャネルであってもよかったのです。

Conversation APIがもたらすカスタムイベントによる柔軟性により、様々なコミュニケーションチャンネルを統合することができます。

このチュートリアルの完成版は GitHub

当社のAPIでできることをもっと知りたい方は、当社の 開発者ポータルをご覧ください!

シェア:

https://a.storyblok.com/f/270183/798x490/2f01fa5ba6/royandfrans.png
Roy Ben Shushan and Frans Siswantoヴォネージの卒業生