Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
【Swift編】ニフティクラウドmobile backend レベルアップセミナー
クーポン配信アプリを作ろう!
@ニフティ株式会社
20160804作成(20160913更新)
1 / 100
事前準備
ニフティクラウドmobile backendのアカウント登録がお済みでない方は、
ホームページ右上にある「無料登録」ボタンをクリックして、
アカウント登録を実施してください
2 / 100
150分でアプリ完成させます 講義形式で説明と演習を繰り返して
アプリを作成します
今回のハンズオンセミナーについて
セミナーの形式
3 / 100
今回のハンズオンセミナーについて
学ぶ内容
「mBaaS Shop List」アプリの作成を通して、アクティブユーザー率を上げる
効率的なプッシュ通知の組み込み方を学びます
4 / 100
今回のハンズオンセミナーについて
学ぶ内容
「mBaaS Shop List」アプリの作成を通して、アクティブユーザー率を上げる
効率的なプッシュ通知の組み込み方を学びます
5 / 100
今回のハンズオンセミナーについて
学ぶ内容
「mBaaS Shop List」アプリの作成を通して、アクティブユーザー率を上げる
効率的なプッシュ通知の組み込み方を学びます
6 / 100
ニフティクラウド mobile backendとは
サービス紹介
スマホアプリで汎用的に実装される機能を、クラウドサービスとして提供して
いるサービスです
通称「mBaaS」と呼びます
7 / 100
ニフティクラウド mobile backendとは
iOS SDKの特徴
SDKのインストールが必要です
今回は実装済み
参考:クイックスタート
SDKの初期化処理が必要です
後で処理を実装します
NCMB.setApplicationKey(...
ニフティクラウド mobile backendとは
iOS SDKの特徴
サーバへリクエスト処理には、同期処理と非同期処理があります
//例)保存の場合
/*同期処理 */
save(nil)
/*非同期処理 */
saveInBackgrou...
ハンズオンの概要
作成するアプリについて
クーポン配信アプリをイメージした「mBaaS Shop List」アプリの作成を通し
て、mBaaSの機能を理解していきます
mBaaSの連携部分をコーディングし、アプリを完成させ、次の内容を実現して
...
ハンズオンの概要
作成するアプリについて
11 / 100
ハンズオンの流れ
前半 「mBaaS Shop List」アプリを作ろう!
1. ハンズオンの準備
2. 会員管理機能の作成
3. Shop情報の設定
4. お気に入り機能の作成
後半 プッシュ通知を送ろう!
1. プッシュ通知の準備
2. プ...
「mBaaS Shop List」
アプリを作ろう!
<前半>
13 / 100
1.ハンズオンの準備
14 / 100
ハンズオンの準備
Xcodeプロジェクトをダウンロード
下記リンクをクリックして、ZIPファイルでダウンロードしてください▼
SwiftAdvancePushApp
ディレクトリにある「SwiftAdvancePushApp.xcworkspa...
ハンズオンの準備
プロジェクトにあらかじめ実施していること
mBaaS iOS SDKのインストール
mBaaSとの連携以外の処理のコーディング
アプリのデザインをMain.storyboardで作成し、処理は画面ご
とViewControll...
ハンズオンの準備
mBaaSの準備
mBaaSにログインしてアプリを作成します
17 / 100
ハンズオンの準備
APIキーの設定とSDKの初期化
AppDelegate.swiftを開きます
application(_:didFinishLaunchingWithOptions)メソッド内に処理を実装しま
す[一部実装済み]
//【mB...
2.会員管理機能の作成
19 / 100
会員管理機能の作成
mBaaSの設定
会員管理設定の「メールアドレス/パスワード認証」を許可します
20 / 100
会員管理機能の作成
会員管理①:会員登録用メールを要求する[実装済み]
21 / 100
会員管理機能の作成
会員管理①:会員登録用メールを要求する[実装済み]
SignUpViewController.swiftを開きます
会員登録処理は以下のように実装されます
//【mBaaS:会員管理①】会員登録用メールを要求する
NCMBU...
会員管理機能の作成
会員管理①:会員登録用メールを要求する[実装済み]
それぞれ処理を追記しています
//会員登録用メールの要求失敗時の処理
print("エラーが発生しました:(error!.code)")
self.statusLabel....
会員管理機能の作成
会員管理②:メールアドレスとパスワードでログイン
[実装済み]
24 / 100
会員管理機能の作成
会員管理②:メールアドレスとパスワードでログイン
[実装済み]
LoginViewController.swiftを開きます
ログイン処理は以下のように実装されます
//【mBaaS:会員管理②】メールアドレスとパスワードで...
会員管理機能の作成
会員管理②:メールアドレスとパスワードでログイン
[実装済み]
それぞれ処理を追記しています
//ログイン失敗時の処理
print("ログインに失敗しました:(error.code)")
self.statusLabel.t...
会員管理機能の作成
動作確認(1)ログインをしてみましょう
ここではシュミレーターでビルドし、動作確認を行います
ログイン画面で「会員登録」をタップします
会員登録画面でメールアドレスを入力し「登録メールを送信」をタップします
ログを確認してく...
会員管理機能の作成
動作確認(1)ログインをしてみましょう
会員登録メールが届くので、パスワード設定します
28 / 100
会員管理機能の作成
動作確認(1)ログインをしてみましょう
再びログイン画面に戻り「メールアドレス」と「パスワード」でログインしま
す
ログを確認してください
mBaaSのダッシュボードを確認してください
会員管理にユーザーが登録されました
エ...
会員管理機能の作成
会員管理③:ユーザー情報更新
30 / 100
会員管理機能の作成
会員管理③:ユーザー情報更新
TopViewController.swiftを開きます
初回のみ表示されるユーザー情報登録画面に入力した情報をmBaaSのユーザー
情報に追加する処理を実装します
コメントの下にコードを追記し...
会員管理機能の作成
会員管理③:ユーザー情報更新
//【mBaaS:会員管理③】ユーザー情報更新
//ログイン中のユーザーを取得
letuser=NCMBUser.currentUser()
//ユーザー情報を設定
user.setObject...
会員管理機能の作成
会員管理③:ユーザー情報更新
それぞれ処理を追記します
//更新失敗時の処理
print("ユーザー情報更新に失敗しました:(error.code)")
self.viewLabel.text="登録に失敗しました(更新):...
3.Shop情報の設定
34 / 100
Shop情報の設定
mBaaSにShop情報を用意する(データストア)
ニフティクラウド mobile backendのダッシュボードから「データストア」を開
き、「+作成▼」ボタンをクリックし、「インポート」をクリックします
クラス名に「Sh...
Shop情報の設定
mBaaSにShop情報を用意する(データストア)
こんな感じでインポートされます
36 / 100
Shop情報の設定
mBaaSにShop情報を用意する(ファイルストア)
ニフティクラウド mobile backendのダッシュボードから「ファイルストア」を
開き、「↑アップロード」ボタンをクリックします
ダウンロードしたサンプルプロジェク...
Shop情報の設定
mBaaSにShop情報を用意する(ファイルストア)
こんな感じでアップロードされます
38 / 100
Shop情報の設定
データストア:「Shop」クラスのデータを取得
TopViewController.swiftを開きます
インポートしたShopクラスのデータを取得する処理を実装します
//【mBaaS:データストア】「Shop」クラスのデ...
Shop情報の設定
データストア:「Shop」クラスのデータを取得
それぞれ処理を追記します
//検索失敗時の処理
print("検索に失敗しました:(error.code)")
//検索成功時の処理
print("検索に成功しました")
//...
Shop情報の設定
ファイルストア①:icon画像の取得
41 / 100
Shop情報の設定
ファイルストア①:icon画像の取得
CustomCell.swiftを開きます
CustomCell.swiftはテーブルのセルを作成するファイルです
トップ画面に各ショップのアイコンをmBaaSから取得して表示する処理を...
Shop情報の設定
ファイルストア①:icon画像の取得
それぞれ処理を追記します
//ファイル取得失敗時の処理
print("icon画像の取得に失敗しました:(error.code)")
//ファイル取得成功時の処理
print("icon...
Shop情報の設定
ファイルストア②:Shop画像の取得
44 / 100
Shop情報の設定
ファイルストア②:Shop画像の取得[実装済み]
ShopViewController.swiftを開きます
Shop画面に各ショップの画像をmBaaSから取得して表示する処理も同様に実
装できます
//【mBaaS:ファイ...
Shop情報の設定
動作確認(2)会員情報登録とShop情報表示
再びシュミレーターでビルドし、動作確認を行います
ログイン後初回のみ、ユーザー情報登録画面が表示されます
入力し「登録」をタップします
このとき、会員情報が更新されますので、mB...
Shop情報の設定
動作確認(2)会員情報登録とShop情報表示
トップ画面に「icon画像」「Shop名」「カテゴリ」が表示されます
Shopを1つ選んでタップします
mBaaSに登録されているimageにアクセスし、Shopページ(画像)が...
4.お気に入り機能の作成
48 / 100
お気に入り機能の作成
お気に入り機能について
お気に入り機能は好きなShopをお気に入りとして保存できる機能です
「お気に入り」画面ではSwitchと「登録」ボタンで設定します
「Shop」画面では右上のハートマークをタップすることでShop単...
お気に入り機能の作成
会員管理④:ユーザー情報の更新[実装済み]
FavoriteViewController.swiftを開きます
お気に入り画面からfavoriteデータの更新処理はユーザー情報の登録と同様にし
て実装できます
//【mBa...
お気に入り機能の作成
会員管理⑤:ユーザー情報の更新[実装済み]
ShopViewController.swiftを開きます
Shop画面からもfavoriteデータの更新処理はユーザー情報の登録と同様にして
実装できます
//【mBaaS:会...
お気に入り機能の作成
動作確認(3)お気に入り情報登録・更新
再びシュミレーターでビルドし、動作確認を行います
ログイン後トップ画面下の「お気に入り」をタップします
お気に入り画面からお気に入り登録をしてみましょう
各Shop画面からも同様に登...
プッシュ通知を送ろう!
<後半>
53 / 100
1.プッシュ通知の準備
54 / 100
プッシュ通知の準備
このあとのデバッグについて
以下の用意が必要です
デバッグ用の実機
プッシュ通知用証明書(p12形式)
証明書の取得がまだの場合は下記をご参照ください
【サンプル】アプリにプッシュ通知を組み込もう!
55 / 100
プッシュ通知の準備
mBaaSの設定
プッシュ通知の許可とAPNsの証明書(p12形式)のアップロードを行います
56 / 100
プッシュ通知の準備
プッシュ通知①:デバイストークンの取得
AppDelegate.swiftを開きます
application(_:didFinishLaunchingWithOptions)メソッド内のSDKの初期化を
実装した部分の直ぐ下...
プッシュ通知の準備
プッシュ通知②:デバイストークンの取得後に呼び出され
るメソッド
続けてAppDelegate.swiftを編集します
application(_:didFinishLaunchingWithOptions)メソッド下(外)...
プッシュ通知の準備
プッシュ通知②:デバイストークンの取得後に呼び出され
るメソッド
それぞれ処理を追記します
//端末情報の登録に失敗した時の処理
print("デバイストークン取得に失敗しました:(error.code)")
//端末情報の...
2.プッシュ通知を送信セグメント配信
60 / 100
プッシュ通知を送信:セグメント配信
プッシュ通知③:installationにユーザー情報を紐づける
TopViewController.swiftを開きます
「【mBaaS:会員管理③】ユーザー情報更新」の更新成功時の処理内にセグメ
ント配信...
プッシュ通知を送信:セグメント配信
プッシュ通知③:installationにユーザー情報を紐づける
次のように追記します
//【mBaaS:プッシュ通知③】installationにユーザー情報を紐づける
//使用中端末のinstallati...
プッシュ通知を送信:セグメント配信
プッシュ通知③:installationにユーザー情報を紐づける
それぞれ処理を追記します
//installation更新失敗時の処理
print("installation更新(ユーザー登録)に失敗しまし...
プッシュ通知を送信:セグメント配信
プッシュ通知④:installationにユーザー情報を紐づける
[実装済み]
FavoriteViewController.swift開きます
同様に、お気に入り画面でお気に入り情報が更新されるたびに、in...
プッシュ通知を送信:セグメント配信
プッシュ通知⑤:installationにユーザー情報を紐づける
[実装済み]
ShopViewController.swift開きます
同様に、Shop画面でもお気に入り情報が更新されるたびに、instal...
プッシュ通知を送信:セグメント配信
動作確認の準備
もう一度会員情報登録画面を表示するため、mBaaSの会員管理画面で「クラス
の編集」をクリックします
「nickname」にチェックを入れて上の「削除」ボタンで削除します
66 / 100
プッシュ通知を送信:セグメント配信
動作確認の準備
実機でアプリをビルドします
プッシュ通知の許可をして、ログを確認します
端末側でプッシュ通知が許可されました
デバイストークン取得に成功しました
デバイストークンの取得に成功したら、mBaaS...
プッシュ通知を送信:セグメント配信
動作確認の準備
ログインをし、再びユーザー登録をします
このとき、installationが更新されますのでダッシュボードを確認します
ログを確認してください
エラーコード一覧
68 / 100
プッシュ通知を送信:セグメント配信
動作確認(4)セグメント配信
shopBをお気に入り登録しているユーザーに絞り込んでプッシュ通知を配信してみ
ましょう!
あらかじめshopBをお気に入りに設定しておきます(アプリ側)
mBaaSのダッシュボ...
プッシュ通知を送信:セグメント配信
動作確認(4)セグメント配信
プッシュ通知を作成します
メッセージを入力します
例:ShopBセール開催中!
「iOS端末に配信する」にチェックを入れます
「配信端末」を設定します
70 / 100
プッシュ通知を送信:セグメント配信
動作確認(4)セグメント配信
「installationクラスからの絞込み」を選択します
絞り込み設定をします
ここでコピーしたShopBのobjectIdを貼り付けます
71 / 100
プッシュ通知を送信:セグメント配信
動作確認(4)セグメント配信
「1端末に向けて送信されます」と表示されればOKです
「プッシュ通知を作成する」をクリックします
少し待つと配信されます→端末を確認!
72 / 100
プッシュ通知を送信:セグメント配信
動作確認(4)セグメント配信[おまけ]
いろいろなパターンで送ってみましょう!
別のショップを絞り込み
性別で絞込み
ShopAをお気に入り登録かつ女性で絞込み
ShopDをお気に入り登録かつ東京都で絞込み
...
2.プッシュ通知を送信リッチプッシュ
74 / 100
プッシュ通知を送信:リッチプッシュ
リッチプッシュについて
プッシュ通知登録時にURLを指定することで、開封時にWebビューを表示でき
る機能です
プッシュ通知開封でアプリが起動するときに表示されます
アプリ起動中には表示されませんので動作確認...
プッシュ通知を送信:リッチプッシュ
リッチプッシュについて
今回はShopのセール画像を「公開ファイル」機能を利用して配信します
76 / 100
プッシュ通知を送信:リッチプッシュ
公開ファイルとは
「公開ファイル」機能とは、ファイルストアに保存した画像をリンクでアクセ
スできるようにする機能です
ファイルストアに登録した画像を「公開ファイル」として公開することが可能
です
77 / 1...
プッシュ通知を送信:リッチプッシュ
公開ファイル設定
mBaaSのダッシュボードで、公開ファイル設定「HTTPでの取得」を有効にし
ます
78 / 100
プッシュ通知を送信:リッチプッシュ
公開ファイルURL確認方法
ファイルストアで確認できます
今回は「ShopD_sale.png」の公開ファイルURLを使用してみます
URLをコピーします
79 / 100
プッシュ通知を送信:リッチプッシュ
公開ファイルURL確認方法
ブラウザでリンクをたたいて表示されることを確認してください
80 / 100
プッシュ通知を送信:リッチプッシュ
プッシュ通知⑥:リッチプッシュ通知を表示させる処理
AppDelegate.swiftを開きます
application(_:didFinishLaunchingWithOptions)メソッド内、【プッシュ...
プッシュ通知を送信:リッチプッシュ
プッシュ通知⑥:リッチプッシュ通知を表示させる処理
次のように追記します
//【mBaaS:プッシュ通知⑥】リッチプッシュ通知を表示させる処理
NCMBPush.handleRichPush(remoteNo...
プッシュ通知を送信:リッチプッシュ
動作確認(5)リッチプッシュ
実機でアプリをビルドします
起動し、下記ログを確認したらアプリを完全に閉じます
端末側でプッシュ通知が許可されました
デバイストークン取得に成功しました
83 / 100
プッシュ通知を送信:リッチプッシュ
動作確認(5)リッチプッシュ
プッシュ通知を作成します
メッセージを入力します
URL欄にコピーした公開ファイルURLを貼り付けます
そのまま送信してみましょう
84 / 100
プッシュ通知を送信:リッチプッシュ
動作確認(5)リッチプッシュ
しばらくするとプッシュ通知が届きます
プッシュ通知を開くとWebView画面が現れ、公開ファイルが表示されます
85 / 100
2.プッシュ通知を送信ペイロード
86 / 100
プッシュ通知を送信:ペイロード
ペイロードについて
プッシュ通知にはJSON形式で任意のデータを含めることができ、通知を受信
した時に、そのデータを受け取って処理を行うことができる機能です
データ取得の条件
アプリの起動中にプッシュ通知を受信し...
プッシュ通知を送信:ペイロード
プッシュ通知⑦:アプリが起動中にプッシュ通知からデー
タを取得する
AppDelegate.swiftを開きます
application(_:didFinishLaunchingWithOptions)メソッド外...
プッシュ通知を送信:ペイロード
プッシュ通知⑧:アプリが起動されたときにプッシュ通知
からデータを取得する
AppDelegate.swiftを開きます
application(_:didFinishLaunchingWithOptions)メ...
プッシュ通知を送信:ペイロード
参考:ローカルプッシュ[実装済み]
//LocalNotification配信
funclocalNotificationDeliver(deliveryTime:String,message:String){
...
プッシュ通知を送信:ペイロード
動作確認(6)ペイロード(アプリ起動時)
実機でアプリをビルドします
起動し、下記ログを確認します
端末側でプッシュ通知が許可されました
デバイストークン取得に成功しました
そのままアプリを起動した状態にします
...
プッシュ通知を送信:ペイロード
動作確認(6)ペイロード(アプリ起動時)
プッシュ通知に設定するJSON形式のデータを作成します
JSONデータに設定する時間は、今から5分以上未来の時間に変更してく
ださい
JSONデータに設定するメッセージは...
プッシュ通知を送信:ペイロード
動作確認(6)ペイロード(アプリ起動時)
プッシュ通知を作成します
メッセージを入力が無い場合、サイレントプッシュとして送られます
「JSON」に作成したJSONデータを貼り付けます
93 / 100
プッシュ通知を送信:ペイロード
動作確認(6)ペイロード(アプリ起動時)
プッシュ通知を送信します
プッシュ通知を受信(サイレント)すると次のログが表示されます
ペイロードを取得しました:deliveryTime[2016-09-1317:00...
プッシュ通知を送信:ペイロード
動作確認(6)ペイロード(非起動時)
アプリを完全に閉じます
再びプッシュ通知を作成します
95 / 100
プッシュ通知を送信:ペイロード
動作確認(6)ペイロード(非起動時)
アプリが起動していないので、サイレントプッシュでは気付いてもらえません
アプリを起動してもらう内容でプッシュ通知を作成します
メッセージ  例)明日PM5時よりタイムセールを...
プッシュ通知を送信:ペイロード
動作確認(6)ペイロード(非起動時)
プッシュ通知を受信したら、プッシュ通知からアプリを起動します
起動時にデータを取得します
1度起動してあればアプリは閉じてもOKです
指定時間にプッシュ通知が表示されることを...
まとめ
98 / 100
まとめ
学んだこと
mBaaSの各機能を使用してアプリ作成方法を学んだ!
会員管理機能
データストア
ファイルストア
プッシュ通知
プッシュ通知の活用方法がわかった!
セグメント配信
リッチプッシュ
ペイロード
99 / 100
参考
開催中のセミナーのご案内
随時新しいセミナーを実施していきますのでぜひチェックしてください!
ハンズオン内容が実装された完全版プロジェクト
SwiftAdvancePushApp【完成版】
コードはGitHubに公開しています
maste...
Upcoming SlideShare
Loading in …5
×

【Swift編】クーポン配信アプリを作ろう!

1,168 views

Published on

・ニフティクラウドmobile backendレベルアップセミナー用資料です
・「Download」>「No thanks. Continue to download」をクリックしてPDFをダウンロードしてご利用ください

Published in: Education
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/yyxo9sk7 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Be the first to like this

【Swift編】クーポン配信アプリを作ろう!

  1. 1. 【Swift編】ニフティクラウドmobile backend レベルアップセミナー クーポン配信アプリを作ろう! @ニフティ株式会社 20160804作成(20160913更新) 1 / 100
  2. 2. 事前準備 ニフティクラウドmobile backendのアカウント登録がお済みでない方は、 ホームページ右上にある「無料登録」ボタンをクリックして、 アカウント登録を実施してください 2 / 100
  3. 3. 150分でアプリ完成させます 講義形式で説明と演習を繰り返して アプリを作成します 今回のハンズオンセミナーについて セミナーの形式 3 / 100
  4. 4. 今回のハンズオンセミナーについて 学ぶ内容 「mBaaS Shop List」アプリの作成を通して、アクティブユーザー率を上げる 効率的なプッシュ通知の組み込み方を学びます 4 / 100
  5. 5. 今回のハンズオンセミナーについて 学ぶ内容 「mBaaS Shop List」アプリの作成を通して、アクティブユーザー率を上げる 効率的なプッシュ通知の組み込み方を学びます 5 / 100
  6. 6. 今回のハンズオンセミナーについて 学ぶ内容 「mBaaS Shop List」アプリの作成を通して、アクティブユーザー率を上げる 効率的なプッシュ通知の組み込み方を学びます 6 / 100
  7. 7. ニフティクラウド mobile backendとは サービス紹介 スマホアプリで汎用的に実装される機能を、クラウドサービスとして提供して いるサービスです 通称「mBaaS」と呼びます 7 / 100
  8. 8. ニフティクラウド mobile backendとは iOS SDKの特徴 SDKのインストールが必要です 今回は実装済み 参考:クイックスタート SDKの初期化処理が必要です 後で処理を実装します NCMB.setApplicationKey("YOUR_NCMB_APPLICATIONKEY",clientKey:"YOUR_NCMB_CLIENTKEY") 8 / 100
  9. 9. ニフティクラウド mobile backendとは iOS SDKの特徴 サーバへリクエスト処理には、同期処理と非同期処理があります //例)保存の場合 /*同期処理 */ save(nil) /*非同期処理 */ saveInBackgroundWithBlock(nil) 同期処理と非同期処理 同期処理はその処理が完了するまで、次の処理が実行されません 非同期処理はバックグラウンドで処理を実行し、次の処理を実行します 9 / 100
  10. 10. ハンズオンの概要 作成するアプリについて クーポン配信アプリをイメージした「mBaaS Shop List」アプリの作成を通し て、mBaaSの機能を理解していきます mBaaSの連携部分をコーディングし、アプリを完成させ、次の内容を実現して いきます 会員登録をするとお店情報を見ることができます お店のお気に入り登録ができ、お気に入り登録をしたお店からプッシュ通 知で届きます 性別や都道府県限定のプッシュ通知ができます お店からのプッシュ通知でクーポンを直接配信することができます 決まった時間に通知を出すようにプッシュ通知を仕掛けることができます 10 / 100
  11. 11. ハンズオンの概要 作成するアプリについて 11 / 100
  12. 12. ハンズオンの流れ 前半 「mBaaS Shop List」アプリを作ろう! 1. ハンズオンの準備 2. 会員管理機能の作成 3. Shop情報の設定 4. お気に入り機能の作成 後半 プッシュ通知を送ろう! 1. プッシュ通知の準備 2. プッシュ通知を送信:セグメント配信 3. プッシュ通知を送信:リッチプッシュ 4. プッシュ通知を送信:ペイロード 12 / 100
  13. 13. 「mBaaS Shop List」 アプリを作ろう! <前半> 13 / 100
  14. 14. 1.ハンズオンの準備 14 / 100
  15. 15. ハンズオンの準備 Xcodeプロジェクトをダウンロード 下記リンクをクリックして、ZIPファイルでダウンロードしてください▼ SwiftAdvancePushApp ディレクトリにある「SwiftAdvancePushApp.xcworkspace」をダブルクリ ックして、Xcodeを開いてください 15 / 100
  16. 16. ハンズオンの準備 プロジェクトにあらかじめ実施していること mBaaS iOS SDKのインストール mBaaSとの連携以外の処理のコーディング アプリのデザインをMain.storyboardで作成し、処理は画面ご とViewControllerにコーディングしています 16 / 100
  17. 17. ハンズオンの準備 mBaaSの準備 mBaaSにログインしてアプリを作成します 17 / 100
  18. 18. ハンズオンの準備 APIキーの設定とSDKの初期化 AppDelegate.swiftを開きます application(_:didFinishLaunchingWithOptions)メソッド内に処理を実装しま す[一部実装済み] //【mBaaS】 APIキーの設定とSDKの初期化 NCMB.setApplicationKey("YOUR_NCMB_APPLICATIONKEY",clientKey:"YOUR_NCMB_CLIENTKEY") 初期化処理の「YOUR_NCMB_APPLICATIONKEY」,「YOUR_NCMB_CLIENTKEY」の部 分をアプリ作成時に発行されたAPIキーに書き換えてください APIキーは、mBaaSのダッシュボードから「アプリ設定」→「基本」にあ ります 18 / 100
  19. 19. 2.会員管理機能の作成 19 / 100
  20. 20. 会員管理機能の作成 mBaaSの設定 会員管理設定の「メールアドレス/パスワード認証」を許可します 20 / 100
  21. 21. 会員管理機能の作成 会員管理①:会員登録用メールを要求する[実装済み] 21 / 100
  22. 22. 会員管理機能の作成 会員管理①:会員登録用メールを要求する[実装済み] SignUpViewController.swiftを開きます 会員登録処理は以下のように実装されます //【mBaaS:会員管理①】会員登録用メールを要求する NCMBUser.requestAuthenticationMailInBackground(address.text){(error:NSError!)->Voidin iferror!=nil{ //会員登録用メールの要求失敗時の処理 }else{ //会員登録用メールの要求失敗時の処理 } } 22 / 100
  23. 23. 会員管理機能の作成 会員管理①:会員登録用メールを要求する[実装済み] それぞれ処理を追記しています //会員登録用メールの要求失敗時の処理 print("エラーが発生しました:(error!.code)") self.statusLabel.text="エラーが発生しました:(error!.code)" //会員登録用メールの要求失敗時の処理 print("登録用メールを送信しました") self.statusLabel.text="登録用メールを送信しました" //TextFieldを空にする self.address.text="" 23 / 100
  24. 24. 会員管理機能の作成 会員管理②:メールアドレスとパスワードでログイン [実装済み] 24 / 100
  25. 25. 会員管理機能の作成 会員管理②:メールアドレスとパスワードでログイン [実装済み] LoginViewController.swiftを開きます ログイン処理は以下のように実装されます //【mBaaS:会員管理②】メールアドレスとパスワードでログイン NCMBUser.logInWithMailAddressInBackground(address.text,password:password.text){(user:NCMBUser iferror!=nil{ //ログイン失敗時の処理 }else{ //ログイン成功時の処理 } } 25 / 100
  26. 26. 会員管理機能の作成 会員管理②:メールアドレスとパスワードでログイン [実装済み] それぞれ処理を追記しています //ログイン失敗時の処理 print("ログインに失敗しました:(error.code)") self.statusLabel.text="ログインに失敗しました:(error.code)" //ログイン成功時の処理 print("ログインに成功しました:(user.objectId)") //AppDelegateにユーザー情報を保持 self.appDelegate.current_user=userasNCMBUser //TextFieldを空にする self.cleanTextField() //statusLabelを空にする self.statusLabel.text="" //画面遷移 self.performSegueWithIdentifier("login",sender:self) 26 / 100
  27. 27. 会員管理機能の作成 動作確認(1)ログインをしてみましょう ここではシュミレーターでビルドし、動作確認を行います ログイン画面で「会員登録」をタップします 会員登録画面でメールアドレスを入力し「登録メールを送信」をタップします ログを確認してください エラーコード一覧 27 / 100
  28. 28. 会員管理機能の作成 動作確認(1)ログインをしてみましょう 会員登録メールが届くので、パスワード設定します 28 / 100
  29. 29. 会員管理機能の作成 動作確認(1)ログインをしてみましょう 再びログイン画面に戻り「メールアドレス」と「パスワード」でログインしま す ログを確認してください mBaaSのダッシュボードを確認してください 会員管理にユーザーが登録されました エラーコード一覧 29 / 100
  30. 30. 会員管理機能の作成 会員管理③:ユーザー情報更新 30 / 100
  31. 31. 会員管理機能の作成 会員管理③:ユーザー情報更新 TopViewController.swiftを開きます 初回のみ表示されるユーザー情報登録画面に入力した情報をmBaaSのユーザー 情報に追加する処理を実装します コメントの下にコードを追記していきます //【mBaaS:会員管理③】ユーザー情報更新 かなり下の方にあります 31 / 100
  32. 32. 会員管理機能の作成 会員管理③:ユーザー情報更新 //【mBaaS:会員管理③】ユーザー情報更新 //ログイン中のユーザーを取得 letuser=NCMBUser.currentUser() //ユーザー情報を設定 user.setObject(self.nickname.text,forKey:"nickname") user.setObject(self.GENDER_CONFIG[self.genderSegCon.selectedSegmentIndex],forKey:"gender") user.setObject(self.prefecture.text,forKey:"prefecture") user.setObject([]asArray<String>,forKey:"favorite") //user情報の更新 user.saveInBackgroundWithBlock({(error:NSError!)->Voidin iferror!=nil{ //更新失敗時の処理 }else{ //更新成功時の処理 } }) 32 / 100
  33. 33. 会員管理機能の作成 会員管理③:ユーザー情報更新 それぞれ処理を追記します //更新失敗時の処理 print("ユーザー情報更新に失敗しました:(error.code)") self.viewLabel.text="登録に失敗しました(更新):(error.code)" //更新成功時の処理 print("ユーザー情報更新に成功しました") //AppDelegateに保持していたユーザー情報の更新 self.appDelegate.current_user=userasNCMBUser //【mBaaS:プッシュ通知③】installationにユーザー情報を紐づける /*****後でここに処理を記述します*****/ //画面を閉じる self.registerView.hidden=true //ニックネーム表示用ラベルの更新 self.nicknameLabel.text="(self.appDelegate.current_user.objectForKey("nickname"))さん、こんにちは!" //画面更新 self.checkShop() 33 / 100
  34. 34. 3.Shop情報の設定 34 / 100
  35. 35. Shop情報の設定 mBaaSにShop情報を用意する(データストア) ニフティクラウド mobile backendのダッシュボードから「データストア」を開 き、「+作成▼」ボタンをクリックし、「インポート」をクリックします クラス名に「Shop」と入力します ダウンロードしたサンプルプロジェクトにあるSettingフォルダ内の 「Shop.json」を選択してアップロードします 35 / 100
  36. 36. Shop情報の設定 mBaaSにShop情報を用意する(データストア) こんな感じでインポートされます 36 / 100
  37. 37. Shop情報の設定 mBaaSにShop情報を用意する(ファイルストア) ニフティクラウド mobile backendのダッシュボードから「ファイルストア」を 開き、「↑アップロード」ボタンをクリックします ダウンロードしたサンプルプロジェクトにあるSettingフォルダ内の「icon」 「Shop」「Sale」内にあるファイルをすべてをアップロードします 37 / 100
  38. 38. Shop情報の設定 mBaaSにShop情報を用意する(ファイルストア) こんな感じでアップロードされます 38 / 100
  39. 39. Shop情報の設定 データストア:「Shop」クラスのデータを取得 TopViewController.swiftを開きます インポートしたShopクラスのデータを取得する処理を実装します //【mBaaS:データストア】「Shop」クラスのデータを取得 //「Shop」クラスのクエリを作成 letquery=NCMBQuery(className:"Shop") //データストアを検索 query.findObjectsInBackgroundWithBlock({(objects:Array!,error:NSError!)->Voidin iferror!=nil{ //検索失敗時の処理 }else{ //検索成功時の処理 } }) 39 / 100
  40. 40. Shop情報の設定 データストア:「Shop」クラスのデータを取得 それぞれ処理を追記します //検索失敗時の処理 print("検索に失敗しました:(error.code)") //検索成功時の処理 print("検索に成功しました") //AppDelegateに「Shop」クラスの情報を保持 self.appDelegate.shopList=objectsas!Array //テーブルの更新 self.shopTableView.reloadData() 40 / 100
  41. 41. Shop情報の設定 ファイルストア①:icon画像の取得 41 / 100
  42. 42. Shop情報の設定 ファイルストア①:icon画像の取得 CustomCell.swiftを開きます CustomCell.swiftはテーブルのセルを作成するファイルです トップ画面に各ショップのアイコンをmBaaSから取得して表示する処理を実装 します //【mBaaS:ファイルストア①】icon画像の取得 //取得した「Shop」クラスデータからicon名を取得 letimageName=object.objectForKey("icon_image")as!String //ファイル名を設定 letimageFile=NCMBFile.fileWithName(imageName,data:nil) //ファイルを検索 imageFile.getDataInBackgroundWithBlock{(data:NSData!,error:NSError!)->Voidin iferror!=nil{ //ファイル取得失敗時の処理 }else{ //ファイル取得成功時の処理 } } 42 / 100
  43. 43. Shop情報の設定 ファイルストア①:icon画像の取得 それぞれ処理を追記します //ファイル取得失敗時の処理 print("icon画像の取得に失敗しました:(error.code)") //ファイル取得成功時の処理 print("icon画像の取得に成功しました") //icon画像を設定 self.iconImageView_top.image=UIImage.init(data:data) 43 / 100
  44. 44. Shop情報の設定 ファイルストア②:Shop画像の取得 44 / 100
  45. 45. Shop情報の設定 ファイルストア②:Shop画像の取得[実装済み] ShopViewController.swiftを開きます Shop画面に各ショップの画像をmBaaSから取得して表示する処理も同様に実 装できます //【mBaaS:ファイルストア②】Shop画像の取得 //取得した「Shop」クラスデータからshop画面用の画像名を取得 letimageName=appDelegate.shopList[shopIndex].objectForKey("shop_image")as!String //ファイル名を設定 letimageFile=NCMBFile.fileWithName(imageName,data:nil) //ファイルを検索 imageFile.getDataInBackgroundWithBlock{(data:NSData!,error:NSError!)->Voidin iferror!=nil{ //ファイル取得失敗時の処理 /*省略 */ }else{ //ファイル取得成功時の処理 /*省略 */ } } 45 / 100
  46. 46. Shop情報の設定 動作確認(2)会員情報登録とShop情報表示 再びシュミレーターでビルドし、動作確認を行います ログイン後初回のみ、ユーザー情報登録画面が表示されます 入力し「登録」をタップします このとき、会員情報が更新されますので、mBaaSのダッシュボードを確認 してみましょう ログを確認してください エラーコード一覧 46 / 100
  47. 47. Shop情報の設定 動作確認(2)会員情報登録とShop情報表示 トップ画面に「icon画像」「Shop名」「カテゴリ」が表示されます Shopを1つ選んでタップします mBaaSに登録されているimageにアクセスし、Shopページ(画像)が表示 されます 会員ページをタップします ユーザー情報が表示されます エラーコード一覧 47 / 100
  48. 48. 4.お気に入り機能の作成 48 / 100
  49. 49. お気に入り機能の作成 お気に入り機能について お気に入り機能は好きなShopをお気に入りとして保存できる機能です 「お気に入り」画面ではSwitchと「登録」ボタンで設定します 「Shop」画面では右上のハートマークをタップすることでShop単位で設 定できます(♥…ON,♡…OFF) 49 / 100
  50. 50. お気に入り機能の作成 会員管理④:ユーザー情報の更新[実装済み] FavoriteViewController.swiftを開きます お気に入り画面からfavoriteデータの更新処理はユーザー情報の登録と同様にし て実装できます //【mBaaS:会員管理④】ユーザー情報の更新 //ログイン中のユーザーを取得 letuser=NCMBUser.currentUser() //favoriteに更新された値を設定 user.setObject(appDelegate.favoriteObjectIdTemporaryArray,forKey:"favorite") //ユーザー情報を更新 user.saveInBackgroundWithBlock{(error:NSError!)->Voidin iferror!=nil{ //更新に失敗した場合の処理 /*省略 */ }else{ //更新に成功した場合の処理 /*省略 */ } } 50 / 100
  51. 51. お気に入り機能の作成 会員管理⑤:ユーザー情報の更新[実装済み] ShopViewController.swiftを開きます Shop画面からもfavoriteデータの更新処理はユーザー情報の登録と同様にして 実装できます //【mBaaS:会員管理⑤】ユーザー情報の更新 //ログイン中のユーザーを取得 letuser=NCMBUser.currentUser() //更新された値を設定 user.setObject(favoriteObjectIdArray,forKey:"favorite") //ユーザー情報を更新 user.saveInBackgroundWithBlock{(error:NSError!)->Voidin iferror!=nil{ //更新に失敗した場合の処理 /*省略 */ }else{ //更新に成功した場合の処理 /*省略 */ } } 51 / 100
  52. 52. お気に入り機能の作成 動作確認(3)お気に入り情報登録・更新 再びシュミレーターでビルドし、動作確認を行います ログイン後トップ画面下の「お気に入り」をタップします お気に入り画面からお気に入り登録をしてみましょう 各Shop画面からも同様に登録してみましょう ログを確認してください エラーコード一覧 52 / 100
  53. 53. プッシュ通知を送ろう! <後半> 53 / 100
  54. 54. 1.プッシュ通知の準備 54 / 100
  55. 55. プッシュ通知の準備 このあとのデバッグについて 以下の用意が必要です デバッグ用の実機 プッシュ通知用証明書(p12形式) 証明書の取得がまだの場合は下記をご参照ください 【サンプル】アプリにプッシュ通知を組み込もう! 55 / 100
  56. 56. プッシュ通知の準備 mBaaSの設定 プッシュ通知の許可とAPNsの証明書(p12形式)のアップロードを行います 56 / 100
  57. 57. プッシュ通知の準備 プッシュ通知①:デバイストークンの取得 AppDelegate.swiftを開きます application(_:didFinishLaunchingWithOptions)メソッド内のSDKの初期化を 実装した部分の直ぐ下に処理を実装します //【mBaaS:プッシュ通知①】デバイストークンの取得 //デバイストークンの要求 if(NSFoundationVersionNumber>NSFoundationVersionNumber_iOS_7_1){ /**iOS8以上 **/ //通知のタイプを設定したsettingを用意 lettype:UIUserNotificationType=[.Alert,.Badge,.Sound] letsetting=UIUserNotificationSettings(forTypes:type,categories:nil) //通知のタイプを設定 application.registerUserNotificationSettings(setting) //DevoceTokenを要求 application.registerForRemoteNotifications() }else{ /**iOS8未満 **/ lettype:UIRemoteNotificationType=[.Alert,.Badge,.Sound] UIApplication.sharedApplication().registerForRemoteNotificationTypes(type) } 57 / 100
  58. 58. プッシュ通知の準備 プッシュ通知②:デバイストークンの取得後に呼び出され るメソッド 続けてAppDelegate.swiftを編集します application(_:didFinishLaunchingWithOptions)メソッド下(外)に次のメソッ ドを実装します //【mBaaS:プッシュ通知②】デバイストークンの取得後に呼び出されるメソッド funcapplication(application:UIApplication,didRegisterForRemoteNotificationsWithDeviceTokendeviceToken:NSData) //端末情報を扱うNCMBInstallationのインスタンスを作成 letinstallation=NCMBInstallation.currentInstallation() //デバイストークンの設定 installation.setDeviceTokenFromData(deviceToken) //端末情報をデータストアに登録 installation.saveInBackgroundWithBlock{(error:NSError!)->Voidin iferror!=nil{ //端末情報の登録に失敗した時の処理 }else{ //端末情報の登録に成功した時の処理 } } } 58 / 100
  59. 59. プッシュ通知の準備 プッシュ通知②:デバイストークンの取得後に呼び出され るメソッド それぞれ処理を追記します //端末情報の登録に失敗した時の処理 print("デバイストークン取得に失敗しました:(error.code)") //端末情報の登録に成功した時の処理 print("デバイストークン取得に成功しました") 59 / 100
  60. 60. 2.プッシュ通知を送信セグメント配信 60 / 100
  61. 61. プッシュ通知を送信:セグメント配信 プッシュ通知③:installationにユーザー情報を紐づける TopViewController.swiftを開きます 「【mBaaS:会員管理③】ユーザー情報更新」の更新成功時の処理内にセグメ ント配信のために必要なユーザー情報をinstallationに紐付けるための処理を実 装します 上記コメントや処理を一度削除します //【mBaaS:プッシュ通知③】installationにユーザー情報を紐づける //【mBaaS:プッシュ通知③】installationにユーザー情報を紐づける /*****後でここに処理を記述します*****/ //画面を閉じる self.registerView.hidden=true //ニックネーム表示用ラベルの更新 self.nicknameLabel.text="(self.appDelegate.current_user.objectForKey("nickname"))さん、こんにちは!" //画面更新 self.checkShop() 61 / 100
  62. 62. プッシュ通知を送信:セグメント配信 プッシュ通知③:installationにユーザー情報を紐づける 次のように追記します //【mBaaS:プッシュ通知③】installationにユーザー情報を紐づける //使用中端末のinstallation取得 letinstallation:NCMBInstallation?=NCMBInstallation.currentInstallation() ifinstallation!=nil{ //ユーザー情報を設定 installation!.setObject(self.nickname.text,forKey:"nickname") installation!.setObject(self.GENDER_CONFIG[self.genderSegCon.selectedSegmentIndex],forKey: installation!.setObject([]asArray<String>,forKey:"favorite") installation!.saveInBackgroundWithBlock({(error:NSError!)->Voidin iferror!=nil{ //installation更新失敗時の処理 }else{ //installation更新成功時の処理 } }) } 62 / 100
  63. 63. プッシュ通知を送信:セグメント配信 プッシュ通知③:installationにユーザー情報を紐づける それぞれ処理を追記します //installation更新失敗時の処理 print("installation更新(ユーザー登録)に失敗しました:(error.code)") //installation更新成功時の処理 print("installation更新(ユーザー登録)に成功しました") //画面を閉じる self.registerView.hidden=true //ニックネーム表示用ラベルの更新 self.nicknameLabel.text="(self.appDelegate.current_user.objectForKey("nickname"))さん、こんにちは!" //画面更新 self.checkShop() 63 / 100
  64. 64. プッシュ通知を送信:セグメント配信 プッシュ通知④:installationにユーザー情報を紐づける [実装済み] FavoriteViewController.swift開きます 同様に、お気に入り画面でお気に入り情報が更新されるたびに、installation情 報を書き換えられます //【mBaaS:プッシュ通知④】installationにユーザー情報を紐づける letinstallation:NCMBInstallation?=NCMBInstallation.currentInstallation() ifinstallation!=nil{ //お気に入り情報を設定 installation!.setObject(self.appDelegate.favoriteObjectIdTemporaryArray,forKey:"favorite" //installation情報の更新 installation!.saveInBackgroundWithBlock({(error:NSError!)->Voidin iferror!=nil{ //installation更新失敗時の処理 }else{ //installation更新成功時の処理 } }) } 64 / 100
  65. 65. プッシュ通知を送信:セグメント配信 プッシュ通知⑤:installationにユーザー情報を紐づける [実装済み] ShopViewController.swift開きます 同様に、Shop画面でもお気に入り情報が更新されるたびに、installation情報を 書き換えるます //【mBaaS:プッシュ通知⑤】installationにユーザー情報を紐づける letinstallation:NCMBInstallation?=NCMBInstallation.currentInstallation() ifinstallation!=nil{ //お気に入り情報を設定 installation!.setObject(favoriteObjectIdArray,forKey:"favorite") //installation情報の更新 installation!.saveInBackgroundWithBlock({(error:NSError!)->Voidin iferror!=nil{ //installation更新失敗時の処理 }else{ //installation更新成功時の処理 } }) } 65 / 100
  66. 66. プッシュ通知を送信:セグメント配信 動作確認の準備 もう一度会員情報登録画面を表示するため、mBaaSの会員管理画面で「クラス の編集」をクリックします 「nickname」にチェックを入れて上の「削除」ボタンで削除します 66 / 100
  67. 67. プッシュ通知を送信:セグメント配信 動作確認の準備 実機でアプリをビルドします プッシュ通知の許可をして、ログを確認します 端末側でプッシュ通知が許可されました デバイストークン取得に成功しました デバイストークンの取得に成功したら、mBaaSダッシュボードで確認します エラーコード一覧 67 / 100
  68. 68. プッシュ通知を送信:セグメント配信 動作確認の準備 ログインをし、再びユーザー登録をします このとき、installationが更新されますのでダッシュボードを確認します ログを確認してください エラーコード一覧 68 / 100
  69. 69. プッシュ通知を送信:セグメント配信 動作確認(4)セグメント配信 shopBをお気に入り登録しているユーザーに絞り込んでプッシュ通知を配信してみ ましょう! あらかじめshopBをお気に入りに設定しておきます(アプリ側) mBaaSのダッシュボードからShopクラスのデータを開き、shopBの 「objectId」をコピーします 69 / 100
  70. 70. プッシュ通知を送信:セグメント配信 動作確認(4)セグメント配信 プッシュ通知を作成します メッセージを入力します 例:ShopBセール開催中! 「iOS端末に配信する」にチェックを入れます 「配信端末」を設定します 70 / 100
  71. 71. プッシュ通知を送信:セグメント配信 動作確認(4)セグメント配信 「installationクラスからの絞込み」を選択します 絞り込み設定をします ここでコピーしたShopBのobjectIdを貼り付けます 71 / 100
  72. 72. プッシュ通知を送信:セグメント配信 動作確認(4)セグメント配信 「1端末に向けて送信されます」と表示されればOKです 「プッシュ通知を作成する」をクリックします 少し待つと配信されます→端末を確認! 72 / 100
  73. 73. プッシュ通知を送信:セグメント配信 動作確認(4)セグメント配信[おまけ] いろいろなパターンで送ってみましょう! 別のショップを絞り込み 性別で絞込み ShopAをお気に入り登録かつ女性で絞込み ShopDをお気に入り登録かつ東京都で絞込み and more... 73 / 100
  74. 74. 2.プッシュ通知を送信リッチプッシュ 74 / 100
  75. 75. プッシュ通知を送信:リッチプッシュ リッチプッシュについて プッシュ通知登録時にURLを指定することで、開封時にWebビューを表示でき る機能です プッシュ通知開封でアプリが起動するときに表示されます アプリ起動中には表示されませんので動作確認にはアプリを閉じておく必 要があります(仕様) 75 / 100
  76. 76. プッシュ通知を送信:リッチプッシュ リッチプッシュについて 今回はShopのセール画像を「公開ファイル」機能を利用して配信します 76 / 100
  77. 77. プッシュ通知を送信:リッチプッシュ 公開ファイルとは 「公開ファイル」機能とは、ファイルストアに保存した画像をリンクでアクセ スできるようにする機能です ファイルストアに登録した画像を「公開ファイル」として公開することが可能 です 77 / 100
  78. 78. プッシュ通知を送信:リッチプッシュ 公開ファイル設定 mBaaSのダッシュボードで、公開ファイル設定「HTTPでの取得」を有効にし ます 78 / 100
  79. 79. プッシュ通知を送信:リッチプッシュ 公開ファイルURL確認方法 ファイルストアで確認できます 今回は「ShopD_sale.png」の公開ファイルURLを使用してみます URLをコピーします 79 / 100
  80. 80. プッシュ通知を送信:リッチプッシュ 公開ファイルURL確認方法 ブラウザでリンクをたたいて表示されることを確認してください 80 / 100
  81. 81. プッシュ通知を送信:リッチプッシュ プッシュ通知⑥:リッチプッシュ通知を表示させる処理 AppDelegate.swiftを開きます application(_:didFinishLaunchingWithOptions)メソッド内、【プッシュ通知 ①】デバイストークンの取得の下に処理を実装します ifletremoteNotification=launchOptions?[UIApplicationLaunchOptionsRemoteNotificationKey]as //【mBaaS:プッシュ通知⑥】リッチプッシュ通知を表示させる処理 /*ここに書きます */ //【mBaaS:プッシュ通知⑧】アプリが起動されたときにプッシュ通知からデータを取得する } 81 / 100
  82. 82. プッシュ通知を送信:リッチプッシュ プッシュ通知⑥:リッチプッシュ通知を表示させる処理 次のように追記します //【mBaaS:プッシュ通知⑥】リッチプッシュ通知を表示させる処理 NCMBPush.handleRichPush(remoteNotificationas[NSObject:AnyObject]) 82 / 100
  83. 83. プッシュ通知を送信:リッチプッシュ 動作確認(5)リッチプッシュ 実機でアプリをビルドします 起動し、下記ログを確認したらアプリを完全に閉じます 端末側でプッシュ通知が許可されました デバイストークン取得に成功しました 83 / 100
  84. 84. プッシュ通知を送信:リッチプッシュ 動作確認(5)リッチプッシュ プッシュ通知を作成します メッセージを入力します URL欄にコピーした公開ファイルURLを貼り付けます そのまま送信してみましょう 84 / 100
  85. 85. プッシュ通知を送信:リッチプッシュ 動作確認(5)リッチプッシュ しばらくするとプッシュ通知が届きます プッシュ通知を開くとWebView画面が現れ、公開ファイルが表示されます 85 / 100
  86. 86. 2.プッシュ通知を送信ペイロード 86 / 100
  87. 87. プッシュ通知を送信:ペイロード ペイロードについて プッシュ通知にはJSON形式で任意のデータを含めることができ、通知を受信 した時に、そのデータを受け取って処理を行うことができる機能です データ取得の条件 アプリの起動中にプッシュ通知を受信してデータを取得 プッシュ通知受信後、アプリを起動時にデータを取得 今回は、配信時間とメッセージのデータを設定し、時限式でローカルプッシュ を表示させる内容を実装します プッシュ通知に設定するJSON形式のデータの例 {"deliveryTime":"2016-09-1317:00:00","message":"タイムセールスタート!"} 87 / 100
  88. 88. プッシュ通知を送信:ペイロード プッシュ通知⑦:アプリが起動中にプッシュ通知からデー タを取得する AppDelegate.swiftを開きます application(_:didFinishLaunchingWithOptions)メソッド外に次のメソッドを 実装します //【mBaaS:プッシュ通知⑦】アプリが起動中にプッシュ通知からデータを取得する funcapplication(application:UIApplication,didReceiveRemoteNotificationuserInfo:[NSObject:AnyObject]) //プッシュ通知情報の取得 letdeliveryTime=userInfo["deliveryTime"]as!String letmessage=userInfo["message"]as!String //値を取得した後の処理 if!deliveryTime.isEmpty&&!message.isEmpty { print("ペイロードを取得しました:deliveryTime[(deliveryTime)],message[(message)]") //ローカルプッシュ配信 localNotificationDeliver(deliveryTime,message:message) } } 88 / 100
  89. 89. プッシュ通知を送信:ペイロード プッシュ通知⑧:アプリが起動されたときにプッシュ通知 からデータを取得する AppDelegate.swiftを開きます application(_:didFinishLaunchingWithOptions)メソッド内、【mBaaS:プッ シュ通知⑥】リッチプッシュ通知を表示させる処理の下に処理を実装します //【mBaaS:プッシュ通知⑧】アプリが起動されたときにプッシュ通知からデータを取得する //プッシュ通知情報の取得 ifletdeliveryTime=remoteNotification.objectForKey("deliveryTime")as?String{ ifletmessage=remoteNotification.objectForKey("message")as?String{ //ローカルプッシュ配信 localNotificationDeliver(deliveryTime,message:message) } } 89 / 100
  90. 90. プッシュ通知を送信:ペイロード 参考:ローカルプッシュ[実装済み] //LocalNotification配信 funclocalNotificationDeliver(deliveryTime:String,message:String){ //配信時間(String→NSDate)を設定 letformatter=NSDateFormatter() formatter.dateFormat="yyyy-MM-ddHH:mm:ss" letdeliveryTime=formatter.dateFromString(deliveryTime) //ローカルプッシュを作成 LocalNotificationManager.scheduleLocalNotificationAtData(deliveryTime!,alertBody:message,userInfo: } 90 / 100
  91. 91. プッシュ通知を送信:ペイロード 動作確認(6)ペイロード(アプリ起動時) 実機でアプリをビルドします 起動し、下記ログを確認します 端末側でプッシュ通知が許可されました デバイストークン取得に成功しました そのままアプリを起動した状態にします 91 / 100
  92. 92. プッシュ通知を送信:ペイロード 動作確認(6)ペイロード(アプリ起動時) プッシュ通知に設定するJSON形式のデータを作成します JSONデータに設定する時間は、今から5分以上未来の時間に変更してく ださい JSONデータに設定するメッセージは、自由に変更してください {"deliveryTime":"2016-09-1317:00:00","message":"タイムセールスタート!"} 作成したらコピーをしておいてください 92 / 100
  93. 93. プッシュ通知を送信:ペイロード 動作確認(6)ペイロード(アプリ起動時) プッシュ通知を作成します メッセージを入力が無い場合、サイレントプッシュとして送られます 「JSON」に作成したJSONデータを貼り付けます 93 / 100
  94. 94. プッシュ通知を送信:ペイロード 動作確認(6)ペイロード(アプリ起動時) プッシュ通知を送信します プッシュ通知を受信(サイレント)すると次のログが表示されます ペイロードを取得しました:deliveryTime[2016-09-1317:00:00],message[タイムセールスタート!] 指定時間にプッシュ通知が表示されることを確認してください エラーコード一覧 94 / 100
  95. 95. プッシュ通知を送信:ペイロード 動作確認(6)ペイロード(非起動時) アプリを完全に閉じます 再びプッシュ通知を作成します 95 / 100
  96. 96. プッシュ通知を送信:ペイロード 動作確認(6)ペイロード(非起動時) アプリが起動していないので、サイレントプッシュでは気付いてもらえません アプリを起動してもらう内容でプッシュ通知を作成します メッセージ  例)明日PM5時よりタイムセールを行います! JSON形式のデータを貼り付けます JSONデータ作成  例)翌日のPM5時を設定 {"deliveryTime":"2016-09-1317:00:00","message":"タイムセールスタート!"} 時間は今から5分以上未来の時間に変更してください 96 / 100
  97. 97. プッシュ通知を送信:ペイロード 動作確認(6)ペイロード(非起動時) プッシュ通知を受信したら、プッシュ通知からアプリを起動します 起動時にデータを取得します 1度起動してあればアプリは閉じてもOKです 指定時間にプッシュ通知が表示されることを確認してください 97 / 100
  98. 98. まとめ 98 / 100
  99. 99. まとめ 学んだこと mBaaSの各機能を使用してアプリ作成方法を学んだ! 会員管理機能 データストア ファイルストア プッシュ通知 プッシュ通知の活用方法がわかった! セグメント配信 リッチプッシュ ペイロード 99 / 100
  100. 100. 参考 開催中のセミナーのご案内 随時新しいセミナーを実施していきますのでぜひチェックしてください! ハンズオン内容が実装された完全版プロジェクト SwiftAdvancePushApp【完成版】 コードはGitHubに公開しています master:完成版 seminar_version:セミナー版 100 / 100

×