Ionic environments


#1

I got a project from another team but they refuse to cooperate. The project consists of a web application and the ionic mobile applications. This is my first time working with Ionic, not to mention modifying an existing project.

The application has different environments: development, staging and production.

When I run the application in a browser or on an android device, when I’m trying to login/sign-up, I always get the production API url when I’m supposed to get development.

I know it’s using the production environment because I see the user being added to the production database.

How can I run the application using ionic serve / ionic run with a specific environment configuration?

The solutions I saw for implementing environments in Ionic were using Grunt or Gulp, but I don’t have Grunt in my project and there’s nothing that has to do with environments in my gulpfile.js

Searched the whole project and didn’t find where the variable ENVIRONMENT gets a value. Tried to print it with console.log and got this error:

error ReferenceError: ENVIRONMENT is not defined

1. Why the production environment is chosen?

2. How can I initialize ENVIRONMENT variable with a value in each environment?

I don’t know much about Ionic/Angularjs yet, so there may be information missing.
These are the files I think relevant to my question:

/www/js/angular/stCommons/constants/api-constants.js

angular.module('stCommons').constant('ApiConstants', {
  'development': {
    'HOST_API': 'http://localhost:3000/api/'
  },
  'staging': {
    'HOST_API': 'http://<< staging url >>/api/'
  },
  'production': {
    'HOST_API': 'https://<< production url >>/api/'
  }
});

/www/js/angular/stApi/services/auth.js

angular.module('stApi').factory('AuthAPI', function($resource, $rootScope, ApiConstants, ENVIRONMENT) {
  return $resource(ApiConstants[ENVIRONMENT]['HOST_API'] + 'sessions', {});
});

angular.module('stApi').factory('SignUpAPI', function($resource, $rootScope, ApiConstants, ENVIRONMENT) {
  return $resource(ApiConstants[ENVIRONMENT]['HOST_API'] + 'users', {});
});

angular.module('stApi').factory('PasswordRecoveryAPI', function($resource, $rootScope, ApiConstants, ENVIRONMENT) {
  return $resource(ApiConstants[ENVIRONMENT]['HOST_API'] + 'passwords', {});
});

/www/js/angular/stApi/services/user.js

angular.module('stApi').factory('UserAPI', function($resource, $rootScope, ApiConstants, ENVIRONMENT) {
  return $resource(ApiConstants[ENVIRONMENT]['HOST_API'] + 'users', {}, {
    update: {
      method: 'PUT'
    }
  });
});

/www/js/angular/stAuth/controllers/login-controller.js

var LoginController;

LoginController = function($scope, $http, $rootScope, $state, AuthService, googleAnalytics) {
  console.log("[Login]");
  googleAnalytics.setTrackView('Login');
  $scope.user = {};
  return $scope.login = function() {
    return AuthService.logIn($scope.user);
  };
};

angular.module('stAuth').controller('LoginController', LoginController);

/www/js/angular/stAuth/controllers/signup-controller.js

var SignupController;

SignupController = function($scope, $rootScope, $state, AuthService, PassengerTypesAPI, googleAnalytics, Notification, localization, $translate) {
  console.log("[Signup]");
  $scope.user = {};
  $scope.user.registration_platform = 'android';
  googleAnalytics.setTrackView('Sign up');
  PassengerTypesAPI.get({
    locale: localization.getLocale()
  }, function(success) {
    return $scope.travelerTypes = success.passenger_types;
  }, function(failure) {
    return Notification.error({
      message: $translate.instant('notification.alert.cannot_get_data')
    });
  });
  return $scope.signUp = function() {
    return AuthService.signUp($scope.user);
  };
};

angular.module('stAuth').controller('SignupController', SignupController);

/www/js/angular/stAuth/services/auth.js

'use strict';
var AuthService;

AuthService = function($http, $q, $state, $rootScope, $cordovaGoogleAnalytics, session, AuthAPI, SignUpAPI, PasswordRecoveryAPI, $translate, $base64, Notification, localization, $ionicLoading) {
  var _setCredentials;
  _setCredentials = function(user) {
    return $base64.encode(user.email + ':' + user.password);
  };
  this.isLoggedIn = function() {
    return session.getUser() !== null;
  };
  this.logIn = function(user, callback, errorCallback) {
    if (callback == null) {
      callback = null;
    }
    if (errorCallback == null) {
      errorCallback = null;
    }
    $http.defaults.headers.common['Authorization'] = 'Basic ' + _setCredentials(user);
    $ionicLoading.show();
    return AuthAPI.save({
      locale: localization.getLocale()
    }, function(success) {
      $ionicLoading.hide();
      session.setToken(success.user.api_token);
      session.setUser(success.user);
      $rootScope.$broadcast('login');
      $state.go('app.home');
      delete $http.defaults.headers.common['Authorization'];
      $http.defaults.headers.common['Authorization'] = "Token " + session.getAccessToken();
      if (typeof callback === "function") {
        callback();
      }
      Notification.success({
        message: $translate.instant('notification.success.login_successful'),
        replaceMessage: true
      });
      return $cordovaGoogleAnalytics.setUserId(success.user.id);
    }, function(failure) {
      $ionicLoading.hide();
      Notification.error({
        message: $translate.instant('notification.alert.cannot_log_in') + ' — ' + failure.data.error_message,
        replaceMessage: true
      });
      if (typeof errorCallback === "function") {
        errorCallback();
      }
      return delete $http.defaults.headers.common['Authorization'];
    });
  };
  this.signUp = function(user, callback, errorCallback) {
    if (callback == null) {
      callback = null;
    }
    if (errorCallback == null) {
      errorCallback = null;
    }
    $ionicLoading.show();
    return SignUpAPI.save({
      user: user,
      locale: localization.getLocale()
    }, function(success) {
      $ionicLoading.hide();
      session.setToken(success.user.api_token);
      session.setUser(success.user);
      $rootScope.$broadcast('login');
      $state.go('app.home');
      delete $http.defaults.headers.common['Authorization'];
      $http.defaults.headers.common['Authorization'] = "Token " + session.getAccessToken();
      if (typeof callback === "function") {
        callback();
      }
      if (user.facebook_uid) {
        Notification.success({
          message: $translate.instant('notification.success.login_facebook')
        });
      } else {
        Notification.success({
          message: $translate.instant('notification.success.signup_successful'),
          replaceMessage: true
        });
      }
      return $cordovaGoogleAnalytics.setUserId(success.user.id);
    }, function(failure) {
      $ionicLoading.hide();
      Notification.error({
        message: $translate.instant('notification.alert.cannot_sign_up') + ' — ' + failure.data.error_message,
        replaceMessage: true
      }, typeof errorCallback === "function" ? errorCallback() : void 0);
      return delete $http.defaults.headers.common['Authorization'];
    });
  };
  this.logOut = function() {
    $ionicLoading.show();
    return AuthAPI["delete"]({
      locale: localization.getLocale()
    }, function(success) {
      $ionicLoading.hide();
      session.destroy();
      $rootScope.$broadcast('logout');
      $state.go('auth.welcome');
      return Notification.success({
        message: $translate.instant('notification.success.log_out'),
        replaceMessage: true
      });
    }, function(failure) {
      Notification.error({
        message: $translate.instant('notification.alert.cannot_log_out'),
        replaceMessage: true
      }, typeof errorCallback === "function" ? errorCallback() : void 0);
      return delete $http.defaults.headers.common['Authorization'];
    });
  };
  this.recoverPassword = function(user, callback, errorCallback) {
    if (callback == null) {
      callback = null;
    }
    if (errorCallback == null) {
      errorCallback = null;
    }
    $ionicLoading.show();
    return PasswordRecoveryAPI.save({
      user: user,
      locale: localization.getLocale()
    }, function(success) {
      $ionicLoading.hide();
      Notification.success({
        message: $translate.instant('notification.success.email_password_recovery')
      });
      return $state.go('auth.welcome');
    }, function(failure) {
      return Notification.error({
        message: $translate.instant('notification.alert.email_password_recovery_error') + ' — ' + failure.data.error_message,
        replaceMessage: true
      });
    });
  };
  this.isAuthenticated = function() {
    return AuthAPI.get({
      locale: localization.getLocale()
    }, function(success) {
      return $rootScope.$broadcast('isAuthenticated', success.valid_token);
    });
  };
  return void 0;
};

angular.module('stAuth').service('AuthService', AuthService);