Ionic + Laravel

ionic-v1
1

Hello,

I created an Ionic front-end app following this tutorial: http://devdactic.com/user-auth-angularjs-ionic/
But now I want to use actual authentication using a mySQL database. He has a tutorial where he uses node.js as backend but I’m only familiar with Laravel for back-end stuff. Is it possible to use Ionic with Laravel? And how? I’m very new to this btw.

Thanks in advance

2

Here is one to check out.

Also may want to look at the Ionic Custom Auth feature. You could create a simple Authentication script that ties your database to ionic. I am working on this right now, but have a problem I am trying to solve in the script.


Good luck,

RGecy

3

Yea I literally just discover ionic cloud. I’m reading throught it now, will post error if I run into any :slight_smile:

4

If you do not need to store the users on your end, Ionic Auth is the way to go. I need to have other data available and also use login for my website, so I am tryin to get Ionic Custom Auth working. Its giving me a fit though!

RGecy

5

Already I’m stuck on this. Everything from the tutorials works but when I put in my own link to a signup page I get a 404…?

EDIT: tried changing it to ui-sref

login.html:
<ion-view view-title="Sign-In"> <ion-content class="padding"> <div class="list list-inset"> <label class="item item-input"> <input type="text" placeholder="E-mail" ng-model="data.email"> </label> <label class="item item-input"> <input type="password" placeholder="Password" ng-model="data.password"> </label> </div> <button class="button button-block button-positive" ng-click="login(data)">Login</button> <a ui-sref="signup" style="margin-left: 35%">Sign-up here!</a> </ion-content> </ion-view>

app.js:
`angular.module(‘starter’, [‘ionic’, ‘ngMockE2E’, ‘ionic.cloud’])

   .config(function ($stateProvider, $urlRouterProvider, USER_ROLES, $ionicCloudProvider) {
     $ionicCloudProvider.init({
       "core": {
         "app_id": "e91d92e1"
       }
     });
     $stateProvider
       .state('login', {
         url:         '/login',
         templateUrl: 'templates/login.html',
         controller:  'LoginCtrl'
       })
       .state('signup', {
         url:         '/signup',
         templateUrl: 'templates/signup.html',
         controller:  'SignupCtrl'
       })
       .state('main', {
         url:         '/',
         abstract:    true,
         templateUrl: 'templates/main.html'
       })
       .state('main.dash', {
         url:   'main/dash',
         views: {
           'dash-tab': {
             templateUrl: 'templates/dashboard.html',
             controller:  'DashCtrl'
           }
         }
       })
       .state('main.admin', {
         url:   'main/admin',
         views: {
           'admin-tab': {
             templateUrl: 'templates/admin.html'
           }
         },
         data:  {
           authorizedRoles: [USER_ROLES.admin]
         }
       })
       .state('main.public', {
         url:   'main/public',
         views: {
           'public-tab': {
             templateUrl: 'templates/public.html'
           }
         }
       });

     $urlRouterProvider.otherwise(function ($injector, $location) {
       var $state = $injector.get("$state");
       $state.go("main.dash");
     });
   })

   .run(function ($ionicPlatform) {
     $ionicPlatform.ready(function () {
       if (window.cordova && window.cordova.plugins.Keyboard) {
         // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
         // for form inputs)
         cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);

         // Don't remove this line unless you know what you are doing. It stops the viewport
         // from snapping when text inputs are focused. Ionic handles this internally for
         // a much nicer keyboard experience.
         cordova.plugins.Keyboard.disableScroll(true);
       }
       if (window.StatusBar) {
         StatusBar.styleDefault();
       }
     })
   })

   .run(function ($httpBackend) {
     $httpBackend.whenGET('http://localhost:8100/valid')
                 .respond({message: 'This is my valid response!'});

     $httpBackend.whenGET('http://localhost:8100/notauthenticated')
                 .respond(401, {message: "Not Authenticated"});

     $httpBackend.whenGET('http://localhost:8100/notauthorized')
                 .respond(403, {message: "Not Authorized"});

     $httpBackend.whenGET(/templates\/\w+.*/).passThrough();
   })

   .run(function ($rootScope, $state, AuthService, AUTH_EVENTS) {
     $rootScope.$on('$stateChangeStart', function (event, next, nextParams, fromState) {

       if ('data' in next && 'authorizedRoles' in next.data) {
         var authorizedRoles = next.data.authorizedRoles;
         if (!AuthService.isAuthorized(authorizedRoles)) {
           event.preventDefault();
           $state.go($state.current, {}, {reload: true});
           $rootScope.$broadcast(AUTH_EVENTS.notAuthorized);
         }
       }

       if (!AuthService.isAuthenticated()) {
         if (next.name !== 'login') {
           event.preventDefault();
           $state.go('login');
         }
       }
     });
   });

`

I click and nothing happens.

EDIT; I just realised that it’s probably because of my authentication. How do I make an exception for the signup page like?