如何將客戶端參數傳遞到服務器端的Angular/Node.js/Express

Question

可能是一個非常基本的問題，但我似乎無法找到一個簡單的答案。

我有一個使用Angular的$http的GET方法，它要求從特定網址（URL_OF_INTEREST）承諾。

在此服務器上，我運行一個可處理GET請求的腳本server.js。

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

我可以使用角GET方法如下與URL_OF_INTEREST通信：

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

然而，字段量，貨幣，源和說明需要理想地從Angular客戶端應用程序傳遞。

這是如何實現的？我的快速應用程序如何讀取這些數據？

Answer 1

您需要在您的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) 
     }); 

而在後端，你可以得到你的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); 
     } 
    }); 
}); 

Answer 2

您可以創建一個JS然後使用jQuery的$.param（http://api.jquery.com/jquery.param/）輕鬆將它們序列化爲URL查詢字符串：

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

並在您電話$http：

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

編輯：或者如果你不想使用jQuery：

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

在服務器端，只需要使用req對象得到參數：

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

Answer 3

回答VS很好的解決方案

• HTTP POST 而將數據發送到服務器是優選的。

• HTTP GET方法表示查詢數據，不發送數據。正因爲如此，HTTP請求與GET方法將始終有request.body爲空。但仍然可以通過GET使用查詢字符串將數據發送到服務器。你的情況：

客戶

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

服務器

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

快樂幫助！

Answer 4

HTTP GET 方法

客戶：

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

服務器：

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

HTTP POST 方法

客戶：

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

服務器：

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