Javascript 如何在 Angular/Node.js/Express 中将客户端参数传递给服务器端

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/33108326/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 14:38:47  来源:igfitidea点击:

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

javascriptangularjsnode.jsexpressangularjs-http

提问by JohnAndrews

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

可能是一个非常基本的问题,但我似乎找不到一个简单的答案。

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

我有一个利用 Angular 的 GET 方法$http,它请求来自特定 url ( URL_OF_INTEREST)的承诺。

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

在这台服务器上,我运行了一个server.js可以处理 GET 请求的快速脚本脚本。

server.js

服务器.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:

我可以使用 Angular GET 方法与 URL_OF_INTEREST 通信,如下所示:

$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.

但是,理想情况下需要从 Angular 客户端应用程序传递金额、货币、来源和描述字段。

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

如何实现这一点以及我的快速应用程序如何读取这些数据?

采纳答案by Bruno Jo?o

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

您需要在 get 调用中传递数据,如下所示:

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:

在你的后端,你可以得到你的 url 参数,如下所示:

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);   
        }
    });
});

回答by Trung Le Nguyen Nhat

HTTP GETmethod

HTTP GET方法

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 POSTmethod

HTTP POST方法

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'});
}

回答by Zeeshan Hassan Memon

Answer vs Good Solution

答案与好的解决方案

  • HTTP POSTis preferred while sending data to the server.

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

  • 向服务器发送数据时首选HTTP POST

  • HTTP GET 方法是查询数据,而不是发送数据。因此,使用GET方法的 HTTP 请求将始终将 request.body 为空。但是仍然可以使用查询字符串通过 GET 将数据发送到服务器。在你的情况下:

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!

乐于助人!

回答by alvarodms

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:

您可以使用参数创建一个 JS 对象,然后使用 jQuery $.param( http://api.jquery.com/jquery.param/) 轻松地将它们序列化为 URL 查询字符串:

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

And on your $httpcall:

并在您的$http电话中:

$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:

编辑或者,如果您不想使用 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 reqobject to get the parameters:

在服务器端,只需使用req对象来获取参数:

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