How can log-in using $http.post?

1

IONIC CONTROLLER

.controller('LoginCtrl', function($scope, $ionicPopup, $state, $http) {
    $scope.data = {};

    $scope.login = function() {
        $http.post('https://mywebsite/login', $scope.email) THIS PART IS TOTALLY WRONG
        .success(function(data) {
            $state.go('improvements');
        }).error(function(data) {
            console.log(data)
            var alertPopup = $ionicPopup.alert({
                title: 'Login failed!',
                template: 'User/Password is Wrong'
            });
        });
    }
})

I’m trying to login in a web site using an ionic APP, so I used inspect element in form log-in from the website that i want login and I got this:

WEB that I want login

    <label for="session_email">Email</label>
    <input class="form-control" type="email" name="session[email]" id="session_email">

    <label for="session_password">Password</label>
    <input class="form-control" type="password" name="session[password]" id="session_password">

    <label class="checkbox inline" for="session_remember_me">
        <input name="session[remember_me]" type="hidden" value="0"><input type="checkbox" value="1" name="session[remember_me]" id="session_remember_me">
        <span>Remember me on this computer</span>

Anyone could help me ? and I’m so sorry for this newbie question

2

you should send an javascript / json-object with email and password like

{
  email: $scope.email,
  password: $scope.password
}

Inspect your network traffic, to check the repsonse of your backend in chrome --> use F12-key on keyboard and click on network tab.

3

Search the forum for “authentication”, this is a frequent topic that has been covered many times.

4 
.controller('LoginCtrl', function($scope, $ionicPopup, $state, $http) {
    $scope.data = {};

    var user = {
                email: $scope.email,
                password: $scope.password
                }
    $scope.login = function() {
        $http.post('https://mywebpage/login', user)
        .success(function(data) {
            console.log(data)
            $state.go('improvements');
        }).error(function(data) {
            console.log(data)
            var alertPopup = $ionicPopup.alert({
                title: 'Login failed!',
                template: 'User/Password is Wrong'
            });
        });
    }
})

Is it correct ? I dont think so , could you explain me how create a Json-object?
and thank you so much

5

look in the angularjs documentation:
https://docs.angularjs.org/api/ng/service/$http

The first code example show the usage of .get and .post… and there is also an object with parameters created like you did it…

what is going wrong?

6

the server is returning: “POST https://mywebsite/login 422 (Unprocessable Entity)”

7

Use the browser dev tools to trace your request content and copy it here.

8 
https://mywebsite/login

POST mywebsite/login
Accept: application/json, text/plain, */*
Origin: http://evil.com/
X-DevTools-Emulate-Network-Conditions-Client-Id: 0282B9AF-4ED4-4D76-9602-05265C798B47
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.85 Safari/537.36
Referer: http://192.168.1.107:8100/
Accept-Encoding: gzip, deflate
Accept-Language: pt-BR,pt;q=0.8,en-US;q=0.6,en;q=0.4

HTTP/1.1 422 Unprocessable Entity
Server: Cowboy
Date: Sun, 13 Sep 2015 16:58:08 GMT
Connection: keep-alive
Strict-Transport-Security: max-age=31536000
Content-Type: text/html; charset=utf-8
X-Request-Id: 0d318f94-0486-4714-bdfb-3205ecc69e5e
X-Runtime: 0.008569
Content-Length: 1547
Via: 1.1 vegur
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: POST, GET, OPTIONS, PUT, DELETE
Allow: POST, GET, OPTIONS, PUT, DELETE
9

You’re missing the most important part of the log for your kind of error: the request body.

10

Thats all I found, Are you talking about form-data ?

Accept:application/json, text/plain, */*
Accept-Encoding:gzip, deflate
Accept-Language:pt-BR,pt;q=0.8,en-US;q=0.6,en;q=0.4
Connection:keep-alive
Content-Length:0
Cookie:_evolution_of_improvements_session=QXFLOXR2bUQ0ZGIxMlBOMVBTOE11ZkNQMFNFU0lNbzFzM0ZFV3FKQmdqMUN6NUxWTnkzc0hIbFg2SVJQMFdjdDBVTHRrNUpaRXJscGV2cTR5eGhPNVM5QytlMFRMVkRDSFZNaFRPSkFhTEVBSm54b1JwUUw4ZDZFNnIrclBvOEpkNVc5VjZUb1Y5Ly9pL2hNelo3NHJCTVVWZkxNY2lUZWdSQTBGcCtaT0tyR21vQ3VOcDVvMW1KU0xFQnE1cnlsSGlaQ2VtNzFVM0NtMERkM2FlY2FGSnE2dldjS1dlbkw5cENDUmIrOTYreGlMU1JsNml5NDlNR3JEUS96UGxtWC0tek1kOFBnaVJLcFN4TEtnQmEySEtMZz09--6cda6c82d59db05f4a64e5ef4cb3f6a199f10801
Host:mywebsite.com
Origin:http://evil.com/
Referer:http://192.168.1.107:8100/
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.85 Safari/537.36
11

hai friend, I am having the same problem did you find a solution, I am new to ionic. Please suggest a way to do it