如何将变量从客户端传递到Express api

我完全不熟悉node.js并表达。我已经在我的客户端页面上用JavaScript做了一些计算，我想将生成的数字数组发送到我的node.js服务器应用程序。当我不得不发送表单数据时，我只是将表单动作用于我的路线。现在我完全迷失了，不知道从哪里开始。我应该在我的路由中写入哪些代码以及如何从我的客户端应用程序将js变量或数组传递给它？如何将变量从客户端传递到Express api

来源

2017-04-01 Žilvinas

您可以在快速应用程序中创建POST方法路线，并使用jquery通过ajax调用从客户端页面中打开POST api。 –

你能给我很简单的expample吗？我尝试了谷歌搜索它，但所有的例子是非常复杂的JS对象，而不是完全一样我正在寻找 –

相关：[Express js表单数据]（https://stackoverflow.com/questions/24800511/express-js - 形式数据）。另请参阅['req.body']（http://expressjs.com/en/4x/api.html#req.body）的文档。 –

向您的服务器上运行的Express应用程序发送数据数组，最简单的方法是将其作为JSON对象发送。使用jQuery一个简单的例子如下所示：

客户机代码：

var your_calculated_array = []; // Set your calculated array here 
    $.ajax({ 
     type: 'POST', 
     url: 'YOUR_EXPRESS_ENDPOINT', 
     data: { your_data: your_calculated_data }, 
     dataType: 'json', 
     success: function (data) { 
     // Handle the response here 
     } 
    });

服务器端代码（使用身体的解析器的中间件来解析JSON体）：

..... 

var bodyParser = require('body-parser') 
app.use(bodyParser.json()); 

app.post(YOUR_EXPRESS_ENDPOINT, function(req, res) { 
    var calculated_data = req.body.your_data 
    // ... 
}) 

.....

来源

2017-04-01 02:43:24

然而，它一直在试图对服务器做出请求，但我一直在尝试测试它，但即使我在客户端和服务器中的console.log（req.body.your_data）中执行了数据{your_data：“test”}端点控制台总是显示undefined –

简单示例

app.js

var express = require('express') 
var app = express() 

app.set('view engine', 'pug') 

app.get('/', function (req, res) { 
    res.render('index') 
}) 

app.post('/example_route', function (req, res) { 
    res.send({'msg': 'Hello World!'}) 
}) 

app.listen(3000, function() { 
    console.log('Example app listening on port 3000!') 
})

的意见/ index.pug

doctype html 
html 
    head 
    title= 'HomePage' 
    script(src='https://code.jquery.com/jquery-3.2.1.min.js') 
    body 
    button(onclick='$.post("http://localhost:3000/example_route", function(data) {alert(data.msg);})') Click me!

本网页包括来自CDN jQuery和onclick事件使一个POST请求到服务器。

来源

2017-04-01 03:25:23

我试过这个，但我得到这个错误：XMLHttpRequest无法加载http：// localhost：3000/example-route。请求的资源上没有“Access-Control-Allow-Origin”标题。因此不允许原产地'null'访问。 –

这意味着POST请求必须来自它发送数据的同一个站点。在浏览器地址栏中你访问127.0.0.1:3000或localhost：3000？不管它是什么，在浏览器地址栏和onclick监听器代码中都应该相同。 –

我没有托管我的客户端应用程序在任何地方都可以做到这一点，而无需在同一台服务器上运行它？ –

如何将变量从客户端传递到Express api

回答

相关问题