Why ionic application do not work properly on device?

hi,
I tried to make an hybrid app for my wordpress blog i tried several tutorial but all of them works fine in windows chrome or canary but after build they are not working on real devices.
I tried Mirko Nasato’s lecture and tried this one
http://reactor.apppresser.com/blog/wordpress-api-ionic-app/
but the app is working very well on laptop browser but it not works on real devices.

I don’t understand it why this happen.

Have you tried to remote debug your app on device to see what’s going on?

Hi,
Actually I don’t know how could I do that and I am trying to learn to find the reasons.

hi rsa , i have used to see erros in the console…
Can you try using this command and check using livereload and check
app-name>ionic run android/ios -l
s to see server- log outputs
c to see console- log outputs

Remote debugging is so much more powerful than just displaying console, you can put breakpoints, profile performance, …
Really something you must learn.

Hi There,

when I run Ionic run android -L it shows shows there was a network error (http://192.168.220.1:8100).
but when i run it with ionic run android application lunch with no error.

I think this problem because both system and device must run in single host/network or Please install cordova whitelist plugin… Verify these links…

http://stackoverflow.com/questions/31473814/application-error-issue-in-android-emulator-there-was-an-network-error.

running this command ionic run android -l -c -s shows the there was a network error (http://192.168.220.1:8100) on device but in browser it works properly.

I add that plugins but still the same situation. it try to connect localhost instead of the website that I want to read .json .

Try to change the network link to some other like http://192.168.220.1:8200

Are you accessing the url behind from the corporate proxy?

Hi all
Below is the code I use with replacing domain:

App.js:
angular.module(‘starter’, [‘ionic’, ‘starter.controllers’])

.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
if (window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
}
if (window.StatusBar) {
StatusBar.styleDefault();
}
});
})

.config(function($stateProvider, $urlRouterProvider) {
$stateProvider

.state(‘app’, {
url: “/app”,
abstract: true,
templateUrl: “templates/menu.html”,
})

.state('app.posts', {
  url: "/posts",
  views: {
    'menuContent': {
      templateUrl: "templates/posts.html",
      controller: 'PostsCtrl'
    }
  }
})

.state('app.post', {
  url: "/posts/:postId",
  views: {
    'menuContent': {
      templateUrl: "templates/post.html",
      controller: 'PostCtrl'
    }
  }
})

$urlRouterProvider.otherwise(’/app/posts’);
});

controller.js
angular.module(‘starter.controllers’, [])

.controller(‘PostsCtrl’, function($scope, $http) {
var postsApi = ‘http://ksra.ir/wp-json/posts?_jsonp=JSON_CALLBACK’;

$http.jsonp( postsApi ).
success(function(data, status, headers, config) {
$scope.posts = data;
console.log( data );
}).
error(function(data, status, headers, config) {
console.log( ‘Post load error.’ );
});

})

.controller(‘PostCtrl’, function($scope, $stateParams, $sce, $http ) {

var singlePostApi = ‘http://ksra.ir/wp-json/posts/’ + $stateParams.postId + ‘?_jsonp=JSON_CALLBACK’;

console.log( $stateParams.postId );

$http.jsonp( singlePostApi ).
success(function(data, status, headers, config) {
$scope.post = data;

  $scope.content = $sce.trustAsHtml(data.content);

  console.log(data);

}).
error(function(data, status, headers, config) {
  console.log( 'Single post load error.' );
});

});

I don’t understand, I created a new project and then copy pasted the same code, it is amazing that works very well in any device. why this is happening, I don’t know!!!

I use these code to get json from wordpress website:

(function(){
  var app= angular.module('IKKS', ['ionic','ngCordova']);
app.controller('IKKSctrl',function($http, $scope){

$scope.stories=[];

$http.get('http://ikks.pergig.ir/?json=get_tag_posts&slug=feeding')
  .success(function(response){

console.log(response);
angular.forEach(response.posts, function(posts){
$scope.stories.push (posts);
});
});

});

these code was works properly for KSRA.ir domain but when change it to IKKS.pergig.ir. It gives fallowing error :

"XMLHttpRequest cannot load http://ikks.pergig.ir/?json=get_tag_posts&slug=feeding. No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:8100’ is therefore not allowed access. "

after enabling CROS extension it shows following message

app.js:9

    <html><body><script type="text/javascript" src="/aes.js" ></script><script>function toNumbers(d){var e=[];d.replace(/(..)/g,function(d){e.push(parseInt(d,16))});return e}function toHex(){for(var d=[],d=1==arguments.length&&arguments[0].constructor==Array?arguments[0]:arguments,e="",f=0;f<d.length;f++)e+=(16>d[f]?"0":"")+d[f].toString(16);return e.toLowerCase()}var a=toNumbers("f655ba9d09a112d4968c63579db590b4"),b=toNumbers("98344c2eee86c3994890592585b49f80"),c=toNumbers("b6e9798353d6283149378e3eea86cd42");document.cookie="__test="+toHex(slowAES.decrypt(c,2,a,b))+"; expires=Thu, 31-Dec-37 23:55:55 GMT; path=/"; document.cookie="referrer="+escape(document.referrer); location.href="http://ikks.pergig.ir/?json=get_tag_posts&slug=feeding&ckattempt=1";</script><noscript>This site requires Javascript to work, please enable Javascript in your browser or use a browser with Javascript support</noscript></body></html>

I dont know why this happening, .htaccess file is also exist for rewrite enabling.

I used other code with other script and API it shows the same situation it works for domain KSRA.ir but for IKKS.pergig.ir the fallowing error appears :

<html><body><script type="text/javascript" src="/aes.js" ></script><script>function toNumbers(d){var e=[];d.replace(/(..)/g,function(d){e.push(parseInt(d,16))});return e}function toHex(){for(var d=[],d=1==arguments.length&&arguments[0].constructor==Array?arguments[0]:arguments,e="",f=0;f<d.length;f++)e+=(16>d[f]?"0":"")+d[f].toString(16);return e.toLowerCase()}var a=toNumbers("f655ba9d09a112d4968c63579db590b4"),b=toNumbers("98344c2eee86c3994890592585b49f80"),c=toNumbers("193af920a0cd3775b4284f348d1b23bb");document.cookie="__test="+toHex(slowAES.decrypt(c,2,a,b))+"; expires=Thu, 31-Dec-37 23:55:55 GMT; path=/"; document.cookie="referrer="+escape(document.referrer); location.href="http://ikks.pergig.ir/wp-json/posts?filter[tag]=breeds&ckattempt=1";</script><noscript>This site requires Javascript to work, please enable Javascript in your browser or use a browser with Javascript support</noscript></body></html>

The only differences between these two domain was their PHP version. It seems in lower versions (5.2 and 5.3) that json api was working very well with good result returning. I couldn’t find other reason.