How to pass client-side parameters to the server-side in Angular/Node.js/Express

不打扰是莪最后的温柔 提交于 2019-11-27 16:45:24

问题


Probably a very basic question, but I cannot seem to find a simple answer.

I have a GET method leveraging Angular's $http that is requesting a promise from a particular url (URL_OF_INTEREST).

On this server, I run an express script server.js script that can handle GET requests.

server.js

var express    = require('express');        // call express
var app        = express();                 // define our app using express
var bodyParser = require('body-parser');
var stripe     = require("stripe")("CUSTOM_TEST_TOKEN");

app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

var port = process.env.PORT || 8080;        
var router = express.Router();              // get an instance of the express Router

router.get('/', function(req, res, next) {

    var stripeToken = "CUSTOM_PAYMENT_TOKEN";

    var charge = stripe.charges.create({
        amount: 1100, // amount in cents, again
        currency: "usd",
        source: stripeToken,
        description: "Example charge"
    }, function(err, charge) {
        if (err && err.type === 'StripeCardError') {
            res.json(err);   
        } else {
            res.json(charge);   
        }
    });
});

app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");

    next();
})

app.use('/api', router); // register our route
app.listen(port); // start our server
console.log('Magic happens on port ' + port);

I can communicate with the URL_OF_INTEREST using an Angular GET method as follows:

$http.get('URL_OF_INTEREST')
        .success(
            function(success){
                console.log(success)
            })
        .error(
            function(error){
                console.log(error)
            });

However, the fields amount, currency, source and description need to be ideally passed on from the Angular client side application.

How can this be achieved and how can my express application read this data?


回答1:


You need to pass the data in your get call as folow:

var data = {
    amount: 3,
    currency: 2,
    source: 3,
    description: 4
};

$http.get('URL_OF_INTEREST', data) // PASS THE DATA AS THE SECOND PARAMETER
    .success(
        function(success){
            console.log(success)
        })
    .error(
        function(error){
            console.log(error)
        });

And in your backend, you can get your url parameters as folow:

router.get('/', function(req, res, next) {

    var amount = req.query.amount; // GET THE AMOUNT FROM THE GET REQUEST

    var stripeToken = "CUSTOM_PAYMENT_TOKEN";

    var charge = stripe.charges.create({
        amount: 1100, // amount in cents, again
        currency: "usd",
        source: stripeToken,
        description: "Example charge"
    }, function(err, charge) {
        if (err && err.type === 'StripeCardError') {
            res.json(err);   
        } else {
            res.json(charge);   
        }
    });
});



回答2:


HTTP GET method

Client:

$http.get('/login', {params: {name: 'ABCXYZ'}})
    .success(
        function(success){
            console.log(success)
        })
    .error(
        function(error){
            console.log(error)
        });

Server:

router.get('/login', function(req, res, next) {
    var username = req.query.name;
    res.json({'status': 200, 'msg': 'success'});
}

HTTP POST method

Client:

$http.post('/login', {params: {name: 'ABCXYZ'}})
    .success(
        function(success){
            console.log(success)
        })
    .error(
        function(error){
            console.log(error)
        });

Server:

router.post('/login', function(req, res, next) {
    var username = req.body.params.name;
    res.json({'status': 200, 'msg': 'success'});
}



回答3:


Answer vs Good Solution

  • HTTP POST is preferred while sending data to the server.

  • HTTP GET method means querying for data, not sending data. Because of that, an HTTP request with GET method will always have request.body empty. But still data can be sent to server via GET using query string. In your case:

Client

$http.get('url_to_be_hit', { name : 'Mr. X'})
    .success(function(res){ //response })
    .error(function(err){ //failure });

Server

app.get('/url_to_be_hit', function(req,res,next){
   //req.query.name
}); 

Happy Helping!




回答4:


You can create a JS object with your parameters, and then use jQuery's $.param (http://api.jquery.com/jquery.param/) to easily serialize them into a URL query string:

var parameters = {
   amount: 123,
   description: 'test'
};

And on your $http call:

$http.get('URL_OF_INTEREST'+'?'+$.param(parameters))
        .success(
            function(success){
                console.log(success)
            })
        .error(
            function(error){
                console.log(error)
            });

EDIT: OR if you don't want to use jQuery:

$http.get('URL_OF_INTEREST', { params: parameters })
        .success(
            function(success){
                console.log(success)
            })
        .error(
            function(error){
                console.log(error)
            });

On server-side, just use the req object to get the parameters:

var amount = req.query.amount;
var description = req.query.description;


来源:https://stackoverflow.com/questions/33108326/how-to-pass-client-side-parameters-to-the-server-side-in-angular-node-js-express

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!