jQuery $ .post和$ .ajax POST请求不适用于Express中的app.post()方法

我需要将数据从Express应用程序的前端发送到后端,然后使用需要显示该数据的EJS呈现页面。

问题app.post()方法,当我通过$.post$.ajax发出“手动”POST请求时, res.render()函数似乎没有完全或正确执行

假设我通过JQuery发出这个POST请求

 $.post("/test", { testData: 'Some test data.' }); 

或者通过AJAX发出POST请求

 $.ajax({ type: 'POST', data: { testData: 'Some test data here.' }), url: '/test', }) 

我配置我的app.post()方法来处理Express中的路由

 app.post('/test', function(req, res) { res.render('./test.ejs', { testMessage: req.body.testData }); }); 

变量testData将通过app.post()方法发送和接收。 所以说如果我这样做: console.log(req.body.testData) ,输出将是Some test data ,所以那里没有问题。

问题在于res.render()函数,如果POST请求是通过$.post或通过AJAX $.ajax ,它根本不起作用。 res.render()函数不会通过$.post$.ajax发出的POST请求执行或呈现页面。

奇怪的是,如果通过表单执行相同的POST请求(我不希望在我的应用程序中执行,因为POST请求不应该发送从输入接收的数据),使用EXACT相同的app.post()路由处理程序表达完美。

例如,使用类似下面的表单工作并允许res.render()显示页面,而$.post()$.ajax方法不允许。 为什么会这样?

 

我发现StackOverflow上的另一个问题与我的非常相似,但除了表单选项(我不能使用)之外没有明确的解决方法: Express.js不会在Post Action中渲染

有什么建议?

使用Ajax的关键是HTTP响应返回给JavaScript并且不替换整个页面。

如果要加载新页面,请不要使用Ajax。 使用表格。

如果要在JavaScript中处理响应,则需要为其添加处理程序。

 $.post("/test", { testData: 'Some test data.' }).done(function( data, textStatus, jqXHR ) { // Do something smarter than alert(data); }); 

正如其他人所指出的那样,jQuery .post,.ajax等不期望重定向,它期望JSON,所以这不起作用。 但是,您可以通过一些简单的JavaScript获得您正在寻找的效果。 这就是我遇到类似问题时的方法:

首先,我创建了一个URL字符串,将我想要传递给服务器的数据作为查询参数附加

 var urlString = 'http://hostaddress/myRoute?data1='+myData1+'data2='myData2; 

其次,我做了一个window.location.replace,如下所示:

 window.location.replace(urlString); 

第三,我在Express中创建了一个GET路由来处理传入的请求:

 app.get('/myRoute', function(req,res){ var myData1 = req.query.data1; var myData2 = req.query.data2; res.render('myView',{data1:myData1,data2:myData2}); 

希望有所帮助。

我遇到了同样的问题,并在不使用$ .post或$ .ajax的情况下解决了这个问题。 首先,我从表单元素中取出按钮:

 
class="form-control" required>

并且我将发布表单条件绑定到单击按钮事件。 我也可以发布我想要的价值。 例如:

 $(".btn").click(function(){ if($(".form-control").val() ){ $(".form-control").val("Desired Value"); $("#form-test").submit(); }else alert("TestData is empty"); });