'pusher-angular' 不适用于离子应用
'pusher-angular' not works in ionic application
我正在使用离子框架和推送器实时技术开发推送器应用程序。当我在 android 应用程序中 运行 时,app.js 中的 'pusher-angular' 依赖注入在离子应用程序中不起作用。任何建议如何解决它?我想在控制器中启用 $pusher 依赖注入,以便我可以在我的应用程序中使用 Pusher realtime API。有什么建议吗?
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<!-- compiled css output -->
<link href="css/ionic.app.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="lib/ngCordova/dist/ng-cordova.js"></script>
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="//js.pusher.com/3.2/pusher.min.js"></script>
<script src="//cdn.jsdelivr.net/angular.pusher/latest/pusher-angular.min.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/services.js"></script>
</head>
<body ng-app="starter" >
<ion-nav-view></ion-nav-view>
</body>
</html>
app.js
angular.module('starter', ['ionic', 'starter.controllers', 'starter.services','ngCordova'])
.run(function($ionicPlatform, $cordovaSQLite) {
$ionicPlatform.ready(function() {
if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
cordova.plugins.Keyboard.disableScroll(true);
}
if (window.StatusBar) {
StatusBar.styleDefault();
}
db = window.openDatabase("chatChannel.db", "1", "Demo SQLite Test", "2000");
$cordovaSQLite.execute(db, "CREATE TABLE IF NOT EXISTS chat_channel(id interger primary key, chat_room text, last_text text, username text, chat_channel text unique)")
});
})
Controller.js
.controller('ChatRoomCtrl', ['$scope', '$state', '$rootScope', '$ionicScrollDelegate',
function($scope, $state, $rootScope,$ionicScrollDelegate){
var client = new Pusher('ed05a79be9c11b452872', {
cluster: 'ap1',
encrypted: true
});
var my_channel = client.subscribe(subscribeChannel);
my_channel.bind('chat_message', function(data) {
console.log(data);
$scope.messages.push(data);
});
}
我看到的第一个问题是 index.html
。
<script src="//js.pusher.com/3.2/pusher.min.js"></script>
<script src="//cdn.jsdelivr.net/angular.pusher/latest/pusher-angular.min.js"></script>
此行在 Android 应用程序中不起作用,但可在浏览器中起作用。这是因为 android 文件是从 file://
加载的,所以它会尝试加载 file://js.pusher.com/3.2/pusher.min.js
例如。
你需要像这样精确的协议:
<script src="https://js.pusher.com/3.2/pusher.min.js"></script>
<script src="https://cdn.jsdelivr.net/angular.pusher/latest/pusher-angular.min.js"></script>
我正在使用离子框架和推送器实时技术开发推送器应用程序。当我在 android 应用程序中 运行 时,app.js 中的 'pusher-angular' 依赖注入在离子应用程序中不起作用。任何建议如何解决它?我想在控制器中启用 $pusher 依赖注入,以便我可以在我的应用程序中使用 Pusher realtime API。有什么建议吗?
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<!-- compiled css output -->
<link href="css/ionic.app.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="lib/ngCordova/dist/ng-cordova.js"></script>
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="//js.pusher.com/3.2/pusher.min.js"></script>
<script src="//cdn.jsdelivr.net/angular.pusher/latest/pusher-angular.min.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/services.js"></script>
</head>
<body ng-app="starter" >
<ion-nav-view></ion-nav-view>
</body>
</html>
app.js
angular.module('starter', ['ionic', 'starter.controllers', 'starter.services','ngCordova'])
.run(function($ionicPlatform, $cordovaSQLite) {
$ionicPlatform.ready(function() {
if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
cordova.plugins.Keyboard.disableScroll(true);
}
if (window.StatusBar) {
StatusBar.styleDefault();
}
db = window.openDatabase("chatChannel.db", "1", "Demo SQLite Test", "2000");
$cordovaSQLite.execute(db, "CREATE TABLE IF NOT EXISTS chat_channel(id interger primary key, chat_room text, last_text text, username text, chat_channel text unique)")
});
})
Controller.js
.controller('ChatRoomCtrl', ['$scope', '$state', '$rootScope', '$ionicScrollDelegate',
function($scope, $state, $rootScope,$ionicScrollDelegate){
var client = new Pusher('ed05a79be9c11b452872', {
cluster: 'ap1',
encrypted: true
});
var my_channel = client.subscribe(subscribeChannel);
my_channel.bind('chat_message', function(data) {
console.log(data);
$scope.messages.push(data);
});
}
我看到的第一个问题是 index.html
。
<script src="//js.pusher.com/3.2/pusher.min.js"></script>
<script src="//cdn.jsdelivr.net/angular.pusher/latest/pusher-angular.min.js"></script>
此行在 Android 应用程序中不起作用,但可在浏览器中起作用。这是因为 android 文件是从 file://
加载的,所以它会尝试加载 file://js.pusher.com/3.2/pusher.min.js
例如。
你需要像这样精确的协议:
<script src="https://js.pusher.com/3.2/pusher.min.js"></script>
<script src="https://cdn.jsdelivr.net/angular.pusher/latest/pusher-angular.min.js"></script>