Question

我正在尝试使用纯JS / jQuery来处理客户端逻辑（而不是像Angular这样的框架）。我现在遇到的问题是如何记录用户。

这是我的login.hbs文件：

<div align="center">
<h2 class="page-header">Account Login</h2>
<form>
  <div class="form-group">
    {{!-- Username --}}
    <input type="text" class="form-control" name="username" placeholder="Username" style="width: 20%">
  </div>
  <div class="form-group">
    {{!-- Password --}}
    <input type="password" class="form-control" name="password" placeholder="Password" style="width: 20%">
  </div>
  <button type="button" class="btn btn-success" onclick="login()">Login</button>
</form>
</div>

此提交请求转到JS文件：login.js：

$(document).ready(function() {
    login = () => {     
        var username = $("[name='username']").val()
        var password = $("[name='password']").val()
        $.ajax({
            type: "PUT",
            url: '/login',
            data: {
                username: username,
                password: password
            },
            success: function(response) {
                console.log('Success:')
                console.log(response)
            },
            error: function(error) {
                console.log("Error:")
                console.log(error)
            }
        })
    }
})

在服务器端，我接受PUT中的index.js次请求：

router.put('/login', function(req, res) {
    // Password is not encrypted here
    console.log('req.body')
    console.log(req.body)

    User.findOne({ username: req.body.username }, function(err, user) {
        // Password is encrypted here
        if (err) throw err
        console.log('user')
        console.log(user)

        bcrypt.compare(req.body.password, user.password, function(err, result) {
            if (result) {
                var token = jwt.encode(user, JWT_SECRET)
                return res.status(200).send({ user: user, token: token })
            } else {
                return res.status(401).send({error: "Something is wrong."})
            }
        })
    })
})

当前流程是：用户输入其凭据，这些凭据将返回到success请求中的ajax方法。凭据显示在浏览器的控制台中（确认服务器和客户端正在通信）。问题是，如何将此请求路由到配置文件页面（或任何其他页面）？也就是说，用户位于http://localhost:3000/login，并且在成功登录后，他们将被路由到http://localhost:3000/profile，例如，他们的个人资料信息出现。我喜欢学习这种类型的路由（服务器端和客户端）的两种方式。谢谢！

使用jQuery / JavaScript进行客户端路由

0 个答案: