成功的服务器响应而不在 NodeJs / Express 中执行 Ajax 路由答案

【问题标题】：successful server response without executing the Ajax route in NodeJs / Express成功的服务器响应而不在 NodeJs / Express 中执行 Ajax 路由
【发布时间】：2018-01-10 17:12:04
【问题描述】：

我注册了我的登录路径

app.use('/login', require('./routes/login'));

这个模块包含渲染我的登录 HTML 页面的路由和验证登录的 Ajax 调用。

var router = require('express').Router();

router.get('/', function (req, res) { // render login HTML page
        res.render('login');
});

router.post('/validateLogin', function (req, res) { // Ajax call - login button pressed
        var data = req.body;
        var username = data.username;
        var password = data.password;

        var loginIsValid = true; // TEST

        var session = req.session;
        session.user = { // TEST
          userId: 0 // TEST
        };

        res.send({
            isValid: loginIsValid
        });
});

module.exports = router;

客户端有一个登录按钮。此按钮执行对服务器的 Ajax 调用。如果登录有效，用户应该被重定向到另一个页面。

function login() {
    $.ajax({
        type: 'POST',
        url: 'validateLogin', // Ajax route name
        contentType: 'application/json',
        data: JSON.stringify({
            username: $("#edtLoginUsername").val(),
            password: $("#edtLoginPassword").val()
        })
    }).done(function (response) { // server response
        if (response.isValid) { // valid login?
            // redirect the user to another page
        } else {
            alert("invalid login");
        }
    }).fail(function () {

    });
}

代码总是导致“无效登录”。我开始调试response。此变量将我的完整 HTML 作为字符串返回。这不是来自服务器的正确响应对象。

我在我的 Ajax 路由中创建了一个 console.log，但该路由永远不会被调用。

即使不调用服务端的路由，客户端也不会抛出“未找到”的错误并获得成功的响应？

正如我所说的 response 不正确，它只是包含我的完整 HTML 页面作为字符串。

编辑

响应对象包含

"<!DOCTYPE html> <html> <head>
    <meta charset="utf-8">
    <title></title> </head>

<link href="/style/base.css" rel="stylesheet"> <link href="/style/header.css" rel="stylesheet"> <link href="/style/button.css" rel="stylesheet"> <link href="/style/input.css" rel="stylesheet"> <link href="/style/link.css" rel="stylesheet">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>

<body>


<link href="/style/templates/login.css" rel="stylesheet">

<script src="/client/templates/login.js"></script>

<div id="pageContent">
    <div id="loginContainer">
        <img id="logo" src="/resources/logo/img_logo_big.png">

        <div id="frmLogin">
          <div id="frmLoginHeader">
            <p id="loginHeaderTitle">Login</p>
          </div>

          User
          <input class="edt" id="edtLoginUsername" type="text" placeholder="Username">

          Password
          <input class="edt" id="edtLoginPassword" type="password" placeholder="Password">

          <button class="btn" id="btnLogin">Login</button>
      </div>
    </div> </div>


</body> </html> "

【问题讨论】：

response 对象的内容是什么？
你也可以附加响应对象吗？
我更新了我的答案，这个内容是一个字符串
你能检查一次你是否到达了正确的 url ，如果是的话会有什么响应？

标签： javascript jquery node.js ajax express

【解决方案1】：

你创建一个路由前缀来登录你所有的路由现在都在“/login”下

这样您就可以将您的 ajax 网址更改为

url: 'login/validateLogin', // Ajax route name

或者你可以改变你的前缀

app.use('/', require('./routes/login'));

并获取登录页面

router.get('/login', function (req, res) { // render login HTML page
        res.render('login');
});

【讨论】：

首先我将我的 Ajax url 更改为 'login/validateLogin' 和 '/login/validateLogin'，但这不起作用。之后我将router.js 更改为您的第二个建议
您不需要在服务器中使用“/login/validateLogin”作为第一个选项，您只需要更改 ajax url