コンテンツにスキップ

Roku SDKリポジトリガイド

Braze Roku SDKについて

Braze Roku SDKを使用すると、Brazeのメッセージング、分析、ユーザーエンゲージメント機能をアプリケーションに統合できます。

利用を開始するには、以下のリソースを参照してください。

SDKの初期統合

Braze Roku SDKは、分析、セグメンテーション、エンゲージメントに使用できる情報をレポートするためのAPIを提供します。

ステップ1: ファイルを追加する

  1. BrazeSDK.brsをアプリのsourceディレクトリに追加します。
  2. BrazeTask.brsとBrazeTask.xmlをアプリのcomponentsディレクトリに追加します。
  3. デフォルトのアプリ内メッセージUIを使用する場合は、BrazeDefaultInAppMessage.brs、BrazeDefaultInAppMessage.xml、BrazeDefaultInAppMessageStyles.brsもcomponentsディレクトリに追加します。これら3つのファイルは、まとめて配置する限り、componentsのサブフォルダーに置くこともできます。

ステップ2:参照を追加する

次のscript要素を使用して、メインシーンにBrazeSDK.brsへの参照を追加します。

<script type="text/brightscript" uri="pkg:/source/BrazeSDK.brs"/>

ステップ3: 設定する

main.brsで、CreateScene()の前にグローバルノードにBrazeの設定を行い、Sceneのinit()の実行中に設定を利用できるようにします。

screen = CreateObject("roSGScreen")
globalNode = screen.getGlobalNode()
config = {}
config_fields = BrazeConstants().BRAZE_CONFIG_FIELDS
config[config_fields.API_KEY] = "YOUR_API_KEY_HERE"
config[config_fields.ENDPOINT] = "YOUR_ENDPOINT_HERE (e.g. https://sdk.iad-01.braze.com/)"
config[config_fields.HEARTBEAT_FREQ_IN_SECONDS] = 5
globalNode.addFields({brazeConfig: config})
screen.CreateScene("MainScene")

ステップ4: Brazeを初期化する

Brazeインスタンスを初期化します。

m.BrazeTask = createObject("roSGNode", "BrazeTask")
m.Braze = getBrazeInstance(m.BrazeTask)

アプリ内メッセージの設定

すでに独自のUIでアプリ内メッセージをレンダリングしていて、2.3.0以降にアップグレードする場合は、アプリ内メッセージガイドを参照してください。

SDKは、デフォルトUIでモーダルアプリ内メッセージ(MODAL)を表示できます。この機能はデフォルトでオフになっています。オンにするには、BrazeDefaultInAppMessageファイルを追加し(ステップ1)、以下を設定します。

config[config_fields.AUTOMATIC_IAM_DISPLAY] = true

SDKがレンダースレッドでダイアログをアタッチできるように、メインSceneからgetBrazeInstance(m.BrazeTask)を呼び出します。デフォルトのダイアログでは、BrazeInAppMessageを監視したり、UIを作成したりする必要はありません。

スライドアップ、フル、スタイル付きモーダル、HTMLのアプリ内メッセージは、デフォルトUIでは表示されません。SDKはこれらのタイプに対してエラーを記録します。RokuではHTMLのレンダリングはサポートされていません。

アプリ内メッセージを自分でレンダリングする場合は、automatic_iam_displayを未設定のままにして、BrazeTask.BrazeInAppMessageを監視します。

m.BrazeTask.observeField("BrazeInAppMessage", "onInAppMessageReceived")

特定のメッセージをインターセプトしてカスタムUIを表示し、それ以外のメッセージには自動表示を維持するには、Sceneに以下の関数を実装します(また、Scene XMLの<interface>で宣言します)。

function brazeHandleCustomInAppMessage(in_app_message as object) as boolean
  ' Return true if your app displayed the message, false to use the default SDK dialog.
  return false
end function

デフォルトのIAM UIを使用しながらカスタムクリックを処理するには、Sceneに以下を実装します(また、Scene XMLの<interface>で宣言します)。SDKはクリックを記録してメッセージを閉じた後にこの関数を呼び出すため、ナビゲーションでフォーカスを維持できます。戻るボタンで閉じた場合は、この関数は呼び出されません。

function brazeHandleInAppMessageClick(event as object) as void
  in_app_message = event.in_app_message
  button = event.button
  if button <> invalid
    ' Button click. Use button.click_action and button.uri.
    return
  end if
  ' Body click (no buttons). Use in_app_message.click_action and in_app_message.uri.
end function

UIを自分で処理する場合、ハンドラーはキャンペーンによってトリガーされた最上位のアプリ内メッセージにアクセスできます。

in_app_message = m.BrazeTask.BrazeInAppMessage

利用可能なフィールドは以下のとおりです。

  • in_app_message.message - アプリ内メッセージの本文テキスト
  • in_app_message.buttons - ボタンのリスト(空のリストの場合もあります)。
  • in_app_message.id - インプレッションやクリックを記録する際に使用するID
  • in_app_message.extras - キーと値のペア
  • in_app_message.image_url - 画像URL
  • in_app_message.click_action - ボタンがない場合に、IAMの表示中にユーザーが「OK」をクリックしたときの動作です。「URI」または「NONE」を指定できます。
  • in_app_message.dismiss_type - 「AUTO_DISMISS」または「SWIPE」を指定できます
  • in_app_message.display_delay - アプリ内メッセージを表示するまでの待機時間(秒)
  • in_app_message.duration - dismiss_typeが「AUTO_DISMISS」の場合にメッセージを表示する時間(ミリ秒)
  • in_app_message.header - アプリ内メッセージのヘッダーテキスト
  • in_app_message.uri - click_actionが「URI」の場合に表示する内容

ダッシュボードのスタイル設定フィールドを使用することもできます。または、標準のパレットを使用して、Rokuアプリケーション内でアプリ内メッセージを実装し、スタイルを設定することもできます。

  • in_app_message.bg_color - 背景色
  • in_app_message.close_button_color - 閉じるボタンの色
  • in_app_message.frame_color - 背景画面オーバーレイの色
  • in_app_message.header_text_color - ヘッダーテキストの色
  • in_app_message.message_text_color - メッセージテキストの色
  • in_app_message.text_align - 「START」、「CENTER」、または「END」を指定できます

ボタンのフィールドは以下のとおりです。

  • buttons[0].click_action - 「URI」を指定すると、uriフィールドを開くことを示します。「NONE」を指定すると、このボタンでアプリ内メッセージを閉じることを示します。
  • buttons[0].id - ボタン自体のID値
  • buttons[0].text - ボタンに表示するテキスト
  • buttons[0].uri - click_actionが「URI」の場合に表示する内容
  • buttons[0].bg_color - ボタンの背景色
  • buttons[0].border_color - ボタンの枠線の色
  • buttons[0].text_color - ボタンのテキストの色

デフォルトのBrazeDefaultInAppMessage UIは、インプレッションとクリックを自動的に記録します。

独自のUIを実装する場合は、メッセージが表示されたときにインプレッションを記録します。

LogInAppMessageImpression(in_app_message.id, brazetask)

ユーザーがメッセージをクリックしたら、クリックを記録します。

LogInAppMessageClick(in_app_message.id, brazetask)

その後、in_app_message.click_actionを処理します。

ユーザーがボタンをクリックした場合は、ボタンクリックを記録します。

LogInAppMessageButtonClick(inappmessage.id, inappmessage.buttons[selected].id, brazetask)

その後、inappmessage.buttons[selected].click_actionを処理します。

アプリ内メッセージを処理した後は、フィールドをクリアします。

m.BrazeTask.BrazeInAppMessage = invalid

基本的なSDK統合の完了

これで、Brazeはアプリケーションからデータを収集するようになりました。属性、イベント、購入のログ記録について詳しくは、Brazeドキュメントを参照してください。サンプルアプリのシーンMainScene.brsにもAPIの例が含まれています。

BrazeDefaultInAppMessageは、SDKのデフォルトのアプリ内メッセージUIです。サンプルアプリのCustomSideBySideInAppMessage.brsでは、brazeHandleCustomInAppMessage()を使用したカスタムレイアウトを確認できます。

追加リファレンス

torchietvディレクトリには、Braze SDKを統合したサンプルアプリが含まれています。

リポジトリの詳細とサンプルプロジェクトについては、https://github.com/braze-inc/braze-roku-sdkを参照してください。

New Stuff!