[ Cordova ] 無法使用mobile service plugin結合azure PushNotification 的替代方案

Cordova App 要使用 Azure Notification Hubs服務,正常來說可以用透過 "cordova-plugin-ms-azure-mobile-apps"  + "phonegap-plugin-push" 這二個plugin來達成,詳細可以參考我放在github的範例(https://github.com/iangithub/Cordova-Azure-Notification-Hubs),但這幾天一位朋友告知好像無法正常運作,會有404錯誤,本篇提供另一個替代方案,讓Cordova App可以正常使用Azure Notification Hubs服務

Cordova App使用Azure Notification Hubs服務
原先做法: 透過 "cordova-plugin-ms-azure-mobile-apps"  + "phonegap-plugin-push" 二個plugin來達成(https://github.com/iangithub/Cordova-Azure-Notification-Hubs)
問題情況:原程式發生404,錯誤訊息為 "Failed to load resource: the server responded with a status of 404 - Cannot GET /push/installations/xxxxx"
替代方案:自建azure mobile apps backend,搭配 azure NH SDK,提供api 來取代" cordova-plugin-ms-azure-mobile-apps " plugin  
      採用plugin的做法在今年3月之前應該都還是正常可以使用的(至少在3月授課時是可以使用的),然而相同的程式碼目前卻會出現404錯誤,進一步查看Plugin的原始碼及錯誤訊息,發現404的回應自於"cordova-plugin-ms-azure-mobile-apps" Plugin 的MobileServices.Cordova.js中,有個executeRequest function會呼叫 "/push/installations" ,而這個function主要是在進行Azure Notification Hubs的註冊,於是就懷疑是否這個uri 已經有改變了而plugin沒改,但是經過一番文件查找的功夫後,遍尋不著有關文件資料,所以就放棄直接修改uri的念頭,當然一方面也無法證實是不是uri 真的有改,同時另一方面也透過一些管道詢問,但仍然沒有下文( Cordova快不行了 ? )。
  於是轉個方向,自建mobile app backend,然後把註冊Azure Notification Hubs的工作交給backend去處理,而建立mobile app backend其實就是個web api 專案,這部份可以直接參考 https://azure.microsoft.com/zh-tw/documentation/articles/notification-hubs-aspnet-backend-windows-dotnet-wns-notification/ 的範例,這裡就不多做描述了。
接下來把重點移到 cordova 專案上,原先的程式碼應該這樣的
//PushNotification.
var push = PushNotification.init({
	android: {
		senderID: "your google project code(數字)" 
	},
	ios: {
		alert: "true",
		badge: "true",
		sound: "true",
	},
	windows: {}
});

/*
原本使用WindowsAzure.MobileServiceClient來實作註冊Azure NH
但MobileService.Cordova.js / executeRequest方法中的'push/installations/'
uri 似乎是錯誤,目前皆會回傳404導致無法進行Azure NH註冊
*/
push.on('registration', function (data) {
	console.log('PNS data'+data.registrationId);
	azureClient.push.register('gcm', data.registrationId);
});

現在呢,我們把 push.on('registration'..... 以下面程式碼取代,原本是叫用 WindowsAzure.MobileServiceClient 的 push.register 來實作註冊Azure NH,現在改為叫用自建的 mobile apps backend api 。

push.on('registration', function (data) {
	//取得pns值,各平台的pns值不同
	var pnsid = data.registrationId;

	/*
		自建mobile app backend,開放API來做註冊Azure HN的動作
		取代MobileService plugin 回應 404 的問題
	*/
	$.post("http://ianmobileapp2.azurewebsites.net/api/register/post",
		function (data, status) {
			//取得 Azure HN 註冊ID值
			console.log(data + ";" + status);

			$.ajax({
				type: 'put',
				url: 'http://your mobile app backend.azurewebsites.net/api/register/Put/?id=' + data,
				data: {
					platform: 'gcm',
					Handle: pnsid,
					Tags: ''
				}
			})
		});
});

完成後,我們可以透過 Visual Studio 2015 直接連接 Azure 來測試,可以看到已順利註冊Azure NH服務。

同樣的可以切換到測試傳送頁面,直接發放推播測試,可以看到順利發出推播的記錄。

結論:

  透過自建 mobile apps backend 搭配 azure NH SDK,提供api 來取代" cordova-plugin-ms-azure-mobile-apps " plugin,讓cordova app 一樣可以正常使用 Azure Notification Hubs,至於為何原本正常可以使用的" cordova-plugin-ms-azure-mobile-apps " plugin回應404的現象,至截稿前仍不得而知 ( 從訊息來看只能推斷可能uri 有換,但plugin還沒修改 ) 。

完整專案:https://github.com/iangithub/cordovaazurenhbackend

 

 

若本文對您有所幫助,歡迎轉貼,但請在加註【轉貼】及來源出處,並在附上本篇的超連結,感恩您的配合囉。

By No.18