Require.js 与 Phonegap 和 iO 推送通知
Posted
技术标签:
【中文标题】Require.js 与 Phonegap 和 iO 推送通知【英文标题】：Require.js with Phonegap and Push Notification for iOs 【发布时间】：2014-01-22 17:10:20 【问题描述】：我正在使用 Phonegap、Backbone.js 和 Require.js 构建一个应用程序。该应用程序实现了 Phonegap 推送通知。目前，index.html 中脚本的加载如下所示：
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8" src="PushNotification.js"></script>
<script type="text/javascript" src="js/app/index.js"></script>
<script type="text/javascript">
app.initialize();
</script>
<script data-main="js/app" src="js/require.js"></script>
index.js 看起来像这样：
var app =
// Application Constructor
initialize: function()
this.bindEvents();
,
// Bind Event Listeners
bindEvents: function()
document.addEventListener('deviceready', this.onDeviceReady, false);
,
onDeviceReady: function()
var pushNotification = window.plugins.pushNotification;
pushNotification.register(app.tokenHandler,app.errorHandler,"badge":"true","sound":"true","alert":"true","ecb":"app.onNotificationAPN");
,
errorHandler:function(error)
//alert('in errorHandler');
//alert(error);
,
/*
*
* For ios
*/
tokenHandler:function(status)
//save the status to server
,
onNotificationAPN: function(event)
//display alert
,
;
在 tokenHandler 中，我想调用我定义为 Require.js 模块的模型。因此，我将 index.js 与 Require.js 集成在一起。 Index.html 变成了这样：
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8" src="PushNotification.js"></script>
<script data-main="js/app" src="js/require.js"></script>
index.js 文件现在看起来像这样：
define(function (require)
var app =
// Application Constructor
initialize: function()
this.bindEvents();
,
// Bind Event Listeners
bindEvents: function()
document.addEventListener('deviceready', this.onDeviceReady, false);
,
onDeviceReady: function()
var pushNotification = window.plugins.pushNotification;
pushNotification.register(app.tokenHandler,app.errorHandler,"badge":"true","sound":"true","alert":"true","ecb":"app.onNotificationAPN");
,
errorHandler:function(error)
//alert('in errorHandler');
//alert(error);
,
/*
*
* For iOS
*/
tokenHandler:function(status)
//save the status to server
,
onNotificationAPN: function(event)
//display alert
,
;
return app;
);
在 app.js 中，我这样做了：
... ... ...
require(['jquery', 'backbone', 'app/router', 'app/index'], function ($, Backbone, Router, Index)
var router = new Router();
Index.initialize();
Backbone.history.start();
);
问题出现在pushNotification.register()的回调中，即app.onNotificationAPN。将 index.js 作为 Require 模块加载，这会导致错误：
processMessage failed: Error
当我使用匿名函数代替对 app.onNotificationAPN 的调用时，我也会遇到同样的错误。
正确的回调应该是什么？
【问题讨论】：
【参考方案1】：我有类似的问题，只是我的 onNotificationAPN 没有被调用。我将此指南用作参考（设置注册呼叫）-Push Notifications guide
尝试使用指南的方式添加回调函数。 您还可以将我的推送通知处理程序作为 requirejs 模块查看。它工作正常:) 顺便说一句，我正在使用带有淘汰赛的 Durandal 来构建我的应用程序。
在我的 index.html 中，我引用了 PushNotification.js，该文件也在我的项目中。
索引.html：
<body>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" src="Scripts/jquery/jquery-2.0.3.min.js"></script>
<!-- PhoneGap plugins -->
<script type="text/javascript" charset="utf-8" src="Scripts/phoneGap/PushNotification.js"></script>
....
<script type="text/javascript" src="Scripts/require.js"></script>
<script>
var useragent = navigator.userAgent.toLowerCase();
if (useragent.match(/android/) || useragent.match(/iphone/) || useragent.match(/ipad/) || useragent.match('ios'))
document.addEventListener('deviceready', onDeviceReady, false);
else
onDeviceReady();
function onDeviceReady()
....
require.config(
baseUrl: 'App',
paths:
"main": "main"
);
require(["main"]);
;
</script>
还有推送通知模块：
define([
'knockout'
], function (
ko
)
var pushNotification = window.plugins.pushNotification;
function addCallback(key, callback)
if (window.callbacks === undefined)
window.callbacks = ;
window.callbacks[key] = callback;
;
function registerDevice()
pushNotification.register(
tokenHandler,
errorHandler,
"badge": "true",
"sound": "false",
"alert": "true",
"ecb": "callbacks.notificationHandler"
);
;
// result contains any message sent from the plugin call
function successHandler(result)
alert('result = ' + result);
;
// result contains any error description text returned from the plugin call
function errorHandler(error)
alert('error = ' + error);
;
function tokenHandler(result)
// Your iOS push server needs to know the token before it can push to this device
// here is where you might want to send it the token for later use.
console.log('post token to rikardo', result);
svc.post('Notification', ko.toJSON( DeviceToken: result ));
addCallback('notificationHandler', onNotificationAPN);
;
// iOS
function onNotificationAPN(event)
var model = ,
type = event.type;
if (event.inAppMessage)
model = JSON.parse(event.inAppMessage);
if (type == 'AchievementViewModel')
pushModalHandler.addItem(model);
pushModalHandler.displayModals('achievement');
if (type == 'TimeQuestViewModel')
pushModalHandler.addItem(model);
pushModalHandler.displayModals('timeQuest');
;
return
registerDevice: registerDevice
;
);
我希望这会有所帮助！
【讨论】：
以上是关于Require.js 与 Phonegap 和 iO 推送通知的主要内容，如果未能解决你的问题，请参考以下文章
与 require.js 和 backbone.stickit 一起使用时出现奇怪的 Backbone.Validation 错误