Skip to main content

​
概要

モバイルフレンドリーなWebサイトを持っていて、Apple App StoreまたはGoogle Play Store用のダウンロード可能なモバイルアプリに変換したい場合、Median.coは強力なソリューションです。また、プッシュ通知を有効にするためのOneSignalとのシームレスな統合も提供しています。

​
セットアップ

​
1. Median.coでアプリを作成する

  1. Median.co入門ガイドに従ってください。
  2. <https://median.co/app>でアプリを構築します。

​
2. OneSignalをセットアップする

  1. onesignal.comにアクセスしてアカウントを作成します。
  2. OneSignalアプリとプラットフォームを設定します。

​
OneSignalアプリとプラットフォームを設定

プッシュ通知の必須セットアップ OneSignalでプッシュ通知の送信を開始するには、まずサポートするすべてのプラットフォーム（Apple（APNs）、Google（FCM）、Huawei（HMS）、Amazon（ADM））でOneSignalアプリを設定する必要があります。
組織がすでにOneSignalアカウントを持っている場合は、管理者ロールへの招待をリクエストしてアプリを設定します。それ以外の場合は、無料アカウントにサインアップして開始してください。
単一のOneSignalアプリで複数のプラットフォーム（iOS、Android、Huawei、Amazon、Web）を管理できます。
1

アプリを作成または選択

  • 既存のアプリにプラットフォームを追加するには、OneSignalダッシュボードでSettings > Push & In-Appに移動します。
  • 新規に開始するには、New App/Websiteをクリックしてプロンプトに従います。

新しいアプリを作成する例

2

プラットフォームをセットアップして有効化

  • アプリと組織の明確で認識可能な名前を選択します。
  • 設定するプラットフォーム（iOS、Androidなど）を選択します。
  • Next: Configure Your Platformをクリックします。

最初のOneSignalアプリ、組織、チャネルをセットアップする例

3

プラットフォーム認証情報を設定

プラットフォームに基づいてプロンプトに従います：認証情報を入力した後、Save & Continueをクリックします。
4

ターゲットSDKを選択

開発プラットフォーム（iOS、Android、React Native、Unityなど）に一致するSDKを選択し、Save & Continueをクリックします。

使用しているSDKを選択してドキュメントに移動

5

SDKをインストールしてApp IDを保存

プラットフォームが設定されると、OneSignal App IDが表示されます。このIDをコピーして保存してください - SDKのインストールと初期化時に必要になります。他のユーザーと共同作業する場合は、Inviteボタンを使用して開発者またはチームメイトを追加し、Doneをクリックしてセットアップを完了します。

App IDを保存して追加のチームメンバーを招待

完了したら、選択したプラットフォームのSDKインストールガイドに従って、OneSignalの統合を完了します。

​
3. OneSignalをMedianアプリにリンクする

OneSignal App IDをMedian.co（GoNative）アプリ設定に貼り付けます。

​
OneSignal SDK統合のテスト

このガイドは、プッシュ通知、サブスクリプション登録、アプリ内メッセージングをテストすることで、OneSignal SDK統合が正しく機能していることを確認するのに役立ちます。

​
モバイルサブスクリプションを確認する

1

テストデバイスでアプリを起動します。

初期化中にrequestPermissionメソッドを追加した場合、ネイティブのプッシュ許可プロンプトが自動的に表示されます。

iOSおよびAndroidのプッシュ許可プロンプト

2

OneSignalダッシュボードを確認します

プロンプトを受け入れる前に、OneSignalダッシュボードを確認します：
  • オーディエンス > サブスクリプションに移動します。
  • 「未購読」ステータスの新しいエントリが表示されるはずです。

「未購読」ステータスのサブスクリプションを示すダッシュボード

3

アプリに戻り、プロンプトで許可をタップします。

4

OneSignalダッシュボードのサブスクリプションページを更新します。

サブスクリプションのステータスが購読済みと表示されるはずです。

「購読済み」ステータスのサブスクリプションを示すダッシュボード

モバイルサブスクリプションの作成に成功しました。 モバイルサブスクリプションは、ユーザーがデバイスでアプリを初めて開いたとき、または同じデバイスでアプリをアンインストールして再インストールしたときに作成されます。

​
テストサブスクリプションを設定する

テストサブスクリプションは、メッセージを送信する前にプッシュ通知をテストするのに役立ちます。
1

テストサブスクリプションに追加します。

ダッシュボードで、サブスクリプションの横にある**オプション（三点）**ボタンをクリックし、テストサブスクリプションに追加を選択します。

テストサブスクリプションにデバイスを追加

2

サブスクリプションに名前を付けます。

後でテストサブスクリプションタブでデバイスを簡単に識別できるように、サブスクリプションに名前を付けます。

「サブスクリプションに名前を付ける」フィールドを示すダッシュボード

3

テストユーザーセグメントを作成します。

オーディエンス > セグメント > 新しいセグメントに移動します。
4

セグメントに名前を付けます。

セグメントにTest Usersという名前を付けます（この名前は後で使用されるため重要です）。
5

テストユーザーフィルターを追加して、セグメントを作成をクリックします。

テストユーザーフィルターで「テストユーザー」セグメントを作成

テストユーザーのセグメントの作成に成功しました。 これで、この個々のデバイスとテストユーザーのグループにメッセージを送信するテストができます。

​
API経由でテストプッシュを送信する

1

App API KeyとApp IDを取得します。

OneSignalダッシュボードで、**設定 > キーとID**に移動します。
2

提供されたコードを更新します。

以下のコードのYOUR_APP_API_KEYとYOUR_APP_IDを実際のキーに置き換えます。このコードは、先ほど作成したTest Usersセグメントを使用します。
curl -X \
POST --url 'https://api.onesignal.com/notifications' \
 --header 'content-type: application/json; charset=utf-8' \
 --header 'authorization: Key YOUR_APP_API_KEY' \
 --data \
 '{
  "app_id": "YOUR_APP_ID",
  "target_channel": "push",
  "name": "Testing basic setup",
  "headings": {
  	"en": "👋"
  },
  "contents": {
    "en": "Hello world!"
  },
  "included_segments": [
    "Test Users"
  ],
  "ios_attachments": {
    "onesignal_logo": "https://avatars.githubusercontent.com/u/11823027?s=200&v=4"
  },
  "big_picture": "https://avatars.githubusercontent.com/u/11823027?s=200&v=4"
}'
3

コードを実行します。

ターミナルでコードを実行します。
4

画像と確認済み配信を確認します。

すべてのセットアップ手順が正常に完了した場合、テストサブスクリプションは画像を含む通知を受信するはずです：

iOSおよびAndroidでの画像付きプッシュ通知

画像は折りたたまれた通知ビューで小さく表示されます。通知を展開して完全な画像を表示します。
5

確認済み配信を確認します。

ダッシュボードで、配信 > 送信済みメッセージに移動し、メッセージをクリックして統計を表示します。確認済み統計が表示されるはずです。これは、デバイスがプッシュを受信したことを意味します。

確認済み配信を示す配信統計

プロフェッショナルプラン以上をご利用の場合は、オーディエンスアクティビティまでスクロールして、サブスクリプションレベルの確認を表示します：

オーディエンスアクティビティでデバイスレベルの確認済み配信

API経由でセグメントに通知を正常に送信しました。
  • 画像を受信しませんでしたか？通知サービス拡張機能が欠落している可能性があります。
  • 確認済み配信がありませんか？アプリグループの設定を確認してください。
  • 問題が発生していますか？APIリクエストとアプリ起動の開始から終了までのログを.txtファイルにコピーペーストします。その後、両方をsupport@onesignal.comと共有してください。

​
アプリ内メッセージを送信する

アプリ内メッセージを使用すると、ユーザーがアプリを使用している間にコミュニケーションを取ることができます。
1

デバイスでアプリを閉じるかバックグラウンドにします。

これは、新しいセッションが開始される_前_に、ユーザーがアプリ内オーディエンス基準を満たす必要があるためです。OneSignalでは、アプリがバックグラウンドまたは閉じられた状態から少なくとも30秒後にユーザーがアプリを開くと、新しいセッションが開始されます。詳細については、アプリ内メッセージの表示方法に関するガイドを参照してください。
2

アプリ内メッセージを作成します。

  • OneSignalダッシュボードで、メッセージ > アプリ内 > 新しいアプリ内に移動します。
  • ウェルカムメッセージを見つけて選択します。
  • オーディエンスを以前使用したTest Usersセグメントに設定します。

アプリ内メッセージで「Test Users」セグメントをターゲットにする

3

必要に応じてメッセージコンテンツをカスタマイズします。

アプリ内ウェルカムメッセージのカスタマイズ例

4

トリガーを「アプリ起動時」に設定します。

5

頻度をスケジュールします。

**スケジュール > このメッセージをどのくらいの頻度で表示しますか？**で、トリガー条件が満たされるたびにを選択します。

アプリ内メッセージのスケジューリングオプション

6

メッセージをライブにします。

メッセージをライブにするをクリックして、テストユーザーがアプリを開くたびに利用できるようにします。
7

アプリを開いてメッセージを確認します。

アプリ内メッセージがライブになったら、アプリを開きます。次のように表示されるはずです：

デバイスに表示されるウェルカムアプリ内メッセージ

メッセージが表示されませんか？
  • 新しいセッションを開始します
    • アプリを再度開く前に、少なくとも30秒間アプリを閉じるかバックグラウンドにする必要があります。これにより、新しいセッションが開始されます。
    • 詳細については、アプリ内メッセージの表示方法を参照してください。
  • まだTest Usersセグメントに含まれていますか？
    • アプリを再インストールしたりデバイスを切り替えたりした場合は、デバイスをテストサブスクリプションに再度追加し、Test Usersセグメントに含まれていることを確認してください。
  • 問題が発生していますか？
    • 上記の手順を再現しながら、デバッグログの取得に従ってください。これにより、support@onesignal.comと共有できる追加のログが生成され、問題の調査を支援します。
OneSignal SDKのセットアップに成功し、次のような重要な概念を学びました：

​
プッシュ許可のプロンプト

アプリを開いたときにすぐにrequestPermission()を呼び出す代わりに、より戦略的なアプローチを取ります。許可をリクエストする前に、アプリ内メッセージを使用してプッシュ通知の価値を説明します。 ベストプラクティスと実装の詳細については、プッシュ許可のプロンプトガイドを参照してください。

​
FAQ

​
クライアント側でOneSignalデータにアクセスするにはどうすればよいですか？

Median Native JavaScript Bridgeメソッドmedian_onesignal_infoを使用して、OneSignal Subscription ID（oneSignalUserId）とサブスクリプションステータスを取得します。
javascript
  var osSubscriptionId = "the OneSignal Subscription ID string";
  var isSubscribedToPushNotifications;

  median.onesignal.onesignalInfo().then(function (oneSignalInfo) {
    console.log(oneSignalInfo);
    osSubscriptionId = oneSignalInfo.oneSignalUserId;
    isSubscribedToPushNotifications = oneSignalInfo.oneSignalSubscribed;
  });
詳細はMedian.coドキュメントを参照してください

​
Medianアプリにディープリンクプッシュ通知を送信するにはどうすればよいですか？

Medianアプリは、ポップアップブラウザを開く代わりに、ネイティブエクスペリエンスのためにディープリンクを使用します。

​
OneSignalダッシュボードを使用する場合：

  • 起動URLフィールドは使用しないでください。
  • 代わりに、追加データフィールドを使用します。
    • キーを追加：targetUrl（大文字の「U」）
    • 値を追加：ユーザーに開いてほしいURL。

targetUrlで追加データを使用

​
REST APIを使用する場合：

プッシュペイロードのdataオブジェクトにtargetUrlを含めます。例： 
{
  "app_id": "YOUR-APP-ID",
  "include_player_ids": ["USER-ID"],
  "data": { "targetUrl": "https://example.com/page" },
  "contents": { "en": "Check out this page!" }
}

​
Webとモバイルの両方に送信しますか？

Webとモバイルに同時に送信する場合： 起動URLセクションで、「Web/アプリ用の異なるURL」を選択します。 APP URLフィールドを空白のままにして、上書きを防ぎます。

WebとモバイルのためにURLを設定