Ionic Login Using Rest API Slim Framework

ionic-v1
1

Hi, I use Slim Framework to create Rest Api using this tutorial http://www.androidhive.info/2014/01/how-to-create-rest-api-for-android-app-using-php-slim-and-mysql-day-12-2/, my problem now is how can I use this rest api to make a login in my ionic app… help me please Thanks…

2

read articles about token-authorization in special JWT.

If you want to login via restservice you should work with jwt-tokens. So you need an endpoint that validates username + password and generates a access and refreshtoken for you.

3

@bengtler thanks for replying… I have a piece of code in my app.js

.controller(‘LoginCtrl’, function ($scope, $http) {
$scope.details= {};

$scope.login = function() {
    if ($scope.details.email == undefined || $scope.details.password == undefined) {
        $scope.response = "Email and Password are required";
    }
    else {
        $http ({
            method : 'POST',
            url: 'http://localhost/task_manager/v1/index.php/login',
            data: {
                email : $scope.details.email,
                password : $scope.details.password
            }
        }) .success(function(data) {
            if(data == "0") {
                $scope.response="Email and Password didn't match"
            }
            else {
                state.go('lounge');
            }
        }) .error(function(data) {
            $scope.response="Login details were incorrect"
     })
  }
}

})

is this correct or something I am missing?

4

yeah but this is not a real authentication … the slim tutorial is really short. There you have the complex parts to do. in your app you only need to know what data have to be sent and to which endpoint.

Your endpoint should return the tokens and so on. Read about it… please

5

@bengtler thanks again… I will do that… to add some I test this Rest Api and it works well even the authentication. I just want a hint or clue how to connect my Ionic App to REST API…

6

okay… your are doing it right. i would create an angular const-service which stores the base-url to your API -> so you have one point to change it later instead of replace it everywhere.

$http-stuff should be done in external services not in the controller code.
But the usage of $http looks correctly.

You should use the promise approach of $http instead of success and error callbacks:

$http({...}).then(successFunction, errorFunction);
7

thanks i will do i as soon as I understand it… i am having difficulties understanding it but anyways thanks for you useful information. I already do the CRUD functions in my rest api…

8

Hi again, I manage to create the api and test it (using Advance Rest Chrome App), it works well but when i test it in my ionic app it doesn’t work. Here is my code

.controller(‘LoginCtrl’, function ($scope, $http) {
$scope.details= {};

$scope.login = function () {
    var request = {
        method: "post",
        url: "http://localhost/StudentApp/v1/index.php/studentlogin",
        data: {
            user: $scope.details.username,
            password: $scope.details.password
        },
        headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
    };
    /*Successful HTTP post request or not */
    $http(request).then(function (response) {
        if (response.data == '1') {
            $scope.responseMessage = "You are in";
            state.go('lounge');
        }
        else {
            $scope.responseMessage = "Username or Password is incorrect";
        }
    })
}

})

what is wrong with my code??