将功能从后端节点传递到前端角度

Question

Introduction

I need to verify if a email address is within a API, if so allow a user to enter a section someone cant if they are not a user.

I have built the back-end node code to verify this.

I have 3 functions build in my back-end (node, express) .

The first

Gets data from a front-end form (Angular) post and then uses promise to make the value available to the third function.

The second

This function authenticates and gets my API key and using promise makes this function available to the third function.

The third

This function uses the data from the first (email address) and the API key from the second and post to a API endpoint, If the email is present on the API you get pass, if not fail.

Process

A user enters a email on the front end Angular, hits login then this email is passed to the three back-end functions, then it will pass or fail in the third function.

If this passes I wish to pass $scope.EmailTrue= true; to my Angular controller so that I can ng-hide or ng-show buttons on my front-end.

I was thinking of maybe a simple post to my front-end, but I am new to angular and node so I am unaware if there is a different way of doing this.

Node back-end (3 functions)

//---------------------------------- Grab the packages we need and set variables ---------------------------------------
//----------------------------------------------------------------------------------------------------------------------
var express = require('express');
var request = require('request');
var nodePardot = require('node-pardot');
var bodyParser = require('body-parser');
var rp = require('request-promise');
var app = express();
var port = process.env.PORT || 8080;

// Credential's for pardot API
var password = 'password';
var userkey = 'userkey';
var emailAdmin = 'admin@admin.com';

// Start the server
app.listen(port);
app.use(bodyParser.json()); // support json encoded bodies
app.use(bodyParser.urlencoded({extended: true})); // support encoded bodies
console.log('Test server started! At http://localhost:' + port); // Confirms server start

//---------------------------------- Function to get front end form posted data LOGIN form ----------------------------------------
//----------------------------------------------------------------------------------------------------------------------
var firstFunction = function () {
    return new Promise (function (resolve) {
        setTimeout(function () {
            app.post('/back-end/test', function (req, res) {
                console.log(req.body);
                var login = req.body.LoginEmail;
                res.send(login);
                resolve({
                    data_login_email: login
                });
            });
            console.error("First done");
        }, 2000);
    });
};

//---------------------------------- Function to get API key from Pardot (AUTHENTICATION) ------------------------------
//----------------------------------------------------------------------------------------------------------------------
var secondFunction = function () {
    return new Promise (function (resolve) {
        setTimeout(function () {
            nodePardot.PardotAPI({
                userKey: userkey,
                email: emailAdmin,
                password: password,
                DEBUG: false
            }, function (err, client) {
                if (err) {
                    // Authentication failed
                    console.error("Authentication Failed", err);
                } else {
                    // Authentication successful
                    var api_key = client.apiKey;
                    console.log("Authentication successful !", api_key);
                    resolve({data_api: api_key});
                }
            });
            console.error("Second done");
        }, 2000);
    });
};

//---------------------------------- Function to post data to Pardot ---------------------------------------------------
// ---------------------------------------------------------------------------------------------------------------------

function thirdFunction(result) {
    return new Promise (function () {
        setTimeout(function () {
            var headers = {
                'User-Agent': 'Super Agent/0.0.1',
                'Content-Type': 'application/x-www-form-urlencoded'
            };
// Configure the request
            var api = result[1].data_api;
            var login_email = result[0].data_login_email;
            var options = {
                url: 'https://pi.pardot.com/api/prospect/version/4/do/read',
                method: 'POST',
                headers: headers,
                form: {
                    'email': login_email,
                    'user_key': userkey,
                    'api_key': api
                },
                json: true // Automatically stringifies the body to JSON
            };

// Start the request
            rp(options)
                .then(function (parsedBody) {
                    console.error("pass");
                    // $scope.FormLogin = true;
                })
                .catch(function (err) {
                    console.error("fail");
                });
            console.error("Third done");
        }, 3000);
    }
    );
}

// sequence of functions
Promise.all([firstFunction(), secondFunction()])
    .then(thirdFunction);

Angular controller

FirstModule.controller('LoginController', function TestController($scope, $http) {
    $scope.LoginForm = function () {
        var data = {
            LoginEmail: $scope.formData.LoginEmail
        };

    $http({
        url: 'http://localhost:8080/back-end/test',
        method: "POST",
        data: data,
        headers: {'Content-Type': 'application/x-www-form-urlencoded'}
    }).success(function (data) {
        $scope.formData = data; // assign  $scope.persons here as promise is resolved here
    }).error(function (data, status) {
        $scope.formData = status;
    });

}
});

Angular view

<form class="col-sm-8 col-sm-offset-2">
    <div>
        <div class="form-group">
            <label>Email*</label>
            <input type="email" class="form-control col-sm-12" name="LoginEmail" placeholder="Enter valid E-mail">
        </div>

        <button class=""
                ng-submit="LoginForm()">
            Login<span class=""></span>
        </button>
    </div>
</form>

Answer 1

In Angular you can user the $http service to make an http request and then handle the response.

You can do:

$http.post('/login', {
    email: 'user@email.com',
    password: 'pwd'
}).then(response => {
    // use http status code
    if (response.status === 403) {
        alert('forbidden')'
    } else {
        // do something
    }
})