iT邦幫忙

2017 iT 邦幫忙鐵人賽
DAY 20
1
Cloud

Xamarin.Forms, ASP.NET Core WEB API搭配AZURE服務與資料庫服務整合應用實例系列 第 20

Day20 - Azure Mobile App & Azure Notification Hubs Part3 IOS篇

在開始本篇IOS之前, 遇到了一個小問題, 因為在測試Android時, 升級了Xamarin的版本, 沒想到這一升, 在試跑IOS模擬器時, 出現底下錯誤
http://ithelp.ithome.com.tw/upload/images/20170101/201033339Rkkf13bd3.png

找到這篇, 說是刪除幾個檔案即可
https://developer.xamarin.com/guides/ios/getting_started/installation/windows/connecting-to-mac/troubleshooting/#Troubleshooting_Build_and_Deployment_Errors
http://ithelp.ithome.com.tw/upload/images/20170101/20103333duNphYgxEm.png

找到底下檔案刪除
http://ithelp.ithome.com.tw/upload/images/20170101/20103333K97wRbNS9c.png

重新佈署後, 又發生底下問題, 因為Visual Stuidio Xamarin版本比Mac版本新
http://ithelp.ithome.com.tw/upload/images/20170102/20103333kEGPQ2Egk3.png

要解決這個問題就是Mac上Xamarin一樣要更到最新, 且xcode也要一併要更新, 這個花了兩天處理, 現在開始擔心會不會斷賽了. 接著進入正題, 要對IOS發訊息, 是需要註冊APNs憑證, 首先到Apple developer站台, 在Identifiers 新增一個新App ID如下
http://ithelp.ithome.com.tw/upload/images/20170102/20103333byHiBkjN70.png

這次選Explicit App ID, 然後填入Bundle ID
http://ithelp.ithome.com.tw/upload/images/20170102/20103333AKtKKFsOjU.png

勾選 Push Notifications
http://ithelp.ithome.com.tw/upload/images/20170102/20103333lkzwMhG2Wg.png

最後按下Register
http://ithelp.ithome.com.tw/upload/images/20170102/2010333355ASuMxSn9.png
http://ithelp.ithome.com.tw/upload/images/20170102/201033339LgjlqQBor.png

接著點選APNs Auth Key, 再點Certificate Signing Request, 這個可以套用Day08的作法
http://ithelp.ithome.com.tw/upload/images/20170102/20103333OyCLVs0ACn.png

接下來點選Apple Push Notification service SSL(Sandbox)
http://ithelp.ithome.com.tw/upload/images/20170102/20103333MpQbFoivCo.png

選擇剛剛新建的App ID
http://ithelp.ithome.com.tw/upload/images/20170102/20103333KA99jtCuyH.png

接著按下Continue
http://ithelp.ithome.com.tw/upload/images/20170102/20103333rpcuVCf0Br.png

選擇Day08產生的檔案, 按下Continue
http://ithelp.ithome.com.tw/upload/images/20170102/20103333G8EUX5IGLf.png

最後就可以下載APNs的憑證
http://ithelp.ithome.com.tw/upload/images/20170102/20103333NdtmGzecIz.png

回到憑證清單, 就可以看到多出一個APNs綁定App ID的專屬憑證
http://ithelp.ithome.com.tw/upload/images/20170102/20103333dariWRqPCG.png

回到App IDs, 即可看到Push Notifications已經enable了
http://ithelp.ithome.com.tw/upload/images/20170102/20103333J35M0rgy4t.png

接下來還要建Provisioning Profile, 細節請參照Day08, 完成之後如下,且必須在xcode將它下載下來, 不然Visual Studio會抓不到這個Provisioning
http://ithelp.ithome.com.tw/upload/images/20170102/20103333iF8FCtOWgY.png

回到MAC OSX裡, 先匯入剛剛的APNs憑證
http://ithelp.ithome.com.tw/upload/images/20170102/20103333KFINLFSgGb.png
http://ithelp.ithome.com.tw/upload/images/20170102/20103333C1okXgnkl5.png

然後按下右鍵, 再Export如下紅框所示
http://ithelp.ithome.com.tw/upload/images/20170102/20103333eJWOLde3EK.png

選擇p12格式按下Save
http://ithelp.ithome.com.tw/upload/images/20170102/201033331bwQkk5Wkh.png

然後輸入密碼按下OK
http://ithelp.ithome.com.tw/upload/images/20170102/201033330CyjIWJuQR.png

回到Azure Portal的Push notification services設定, 選擇Apple, 再上傳剛剛匯出的p12憑證
http://ithelp.ithome.com.tw/upload/images/20170102/20103333rjExba0smv.png

輸入剛設定的密碼, 因為是測試用, 所以選擇Sandbox, 最後按下OK
http://ithelp.ithome.com.tw/upload/images/20170102/20103333XLHt64vWe8.png

完成畫面如下圖
http://ithelp.ithome.com.tw/upload/images/20170102/20103333LpyvbOf7Tj.png

接下來到Visual Studio裡繼續設定, 點選IOS專案屬性, 在IOS Application, 填入剛剛建立的App Name與App ID
http://ithelp.ithome.com.tw/upload/images/20170102/20103333PZtnVzYCNN.png

在IOS Bundle Signing選擇剛建立的Provisioning file
http://ithelp.ithome.com.tw/upload/images/20170102/20103333d1Qf1xULM9.png

在IOS專案目錄下找到Info.plist並打開, 點選Background Modes, 勾選Remote Notifications
http://ithelp.ithome.com.tw/upload/images/20170102/20103333mSoj2H87mB.png

接著可以來寫程式了, 打開AppDelegate.cs, 先加入底下兩個參考
...
using Microsoft.WindowsAzure.MobileServices;
using Newtonsoft.Json.Linq;
...

修改FinishedLaunching函式如下
http://ithelp.ithome.com.tw/upload/images/20170102/20103333zO9lJflfa0.png

加入RegisteredForRemoteNotifications函式如下
http://ithelp.ithome.com.tw/upload/images/20170102/20103333GC7kLrPxKm.png

加入DidReceiveRemoteNotification函式如下
http://ithelp.ithome.com.tw/upload/images/20170102/20103333dU3Fx4Wi6o.png

建置完畢後, 部署到實機IPhone去, 然後到到Azure Portal的Push notification 進行測試
http://ithelp.ithome.com.tw/upload/images/20170102/20103333NSMOHGDKPL.png

成功畫面如下
http://ithelp.ithome.com.tw/upload/images/20170102/20103333T8m6p1EgLn.png

後記: 還好Day08打過基礎, 這IOS篇還不算太難/images/emoticon/emoticon01.gif~


上一篇
Day19 - Azure Mobile App & Azure Notification Hubs Part2 Android篇
下一篇
Day21 - Azure Mobile App & Azure Notification Hubs Part4 整合ASP.NET CORE WEB API篇
系列文
Xamarin.Forms, ASP.NET Core WEB API搭配AZURE服務與資料庫服務整合應用實例32
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言