Nodejs 求助，expressjs，如何实现返回登录前页面？

rt，我的想法是在未登录时跳转到登录页面，把当前的地址作为参数例如 res.redirect(’/login?redir=/current/page’); 然后用get时，req.query.redir获取后面的参数，遇到的问题是，post request时怎么才能获取到这个值？

nodeper 1楼•2 个月前

要实现用户在登录后返回到之前访问的页面，可以使用Express.js来处理这个问题。你的想法是正确的，可以通过将当前页面的URL作为参数传递给登录页面，并在登录成功后重定向回该页面。以下是如何实现这一功能的具体步骤：

在未登录时跳转到登录页面：你可以使用res.redirect方法将用户重定向到登录页面，并传递一个包含当前页面URL的查询参数。
从登录表单提交中获取查询参数：当用户提交登录表单时，你需要在登录路由中处理这个查询参数。
登录成功后重定向回之前的页面：在登录成功后，使用之前保存的查询参数进行重定向。

下面是具体的代码示例：

示例代码

首先，确保你已经安装了Express.js：

npm install express

然后，在你的Express应用中实现这些逻辑：

const express = require('express');
const app = express();
app.use(express.urlencoded({ extended: true })); // 解析 URL 编码的数据

// 假设这是你的登录路由
app.post('/login', (req, res) => {
    const redirUrl = req.body.redir || '/'; // 获取查询参数或默认主页

    // 这里模拟一个登录验证过程
    if (/* 验证通过 */) {
        res.redirect(redirUrl); // 登录成功后重定向到之前的页面
    } else {
        res.send('登录失败');
    }
});

// 假设这是你的受保护页面
app.get('/protected-page', (req, res) => {
    // 检查用户是否已登录
    if (!req.isAuthenticated()) { // 假设你有一个 isAuthenticated 方法来检查用户身份
        res.redirect(`/login?redir=${encodeURIComponent(req.originalUrl)}`); // 将当前页面的 URL 作为查询参数传递
    } else {
        res.send('这是受保护的页面');
    }
});

app.listen(3000, () => {
    console.log('服务器运行在 http://localhost:3000');
});

解释

req.body.redir: 在POST请求中，你可以通过req.body来获取表单数据中的redir字段。
req.originalUrl: 这个属性包含了当前请求的原始URL，你可以将其作为查询参数传递给登录页面。
res.redirect(): 使用res.redirect()方法将用户重定向到指定的URL。

这种方法确保了即使在用户尝试访问受保护页面时被重定向到登录页面，登录成功后也可以自动返回到他们之前尝试访问的页面。

yuanlaile 2楼•2 个月前

app.use(express.bodyParser()); req.body.redir

gougou168 3楼•2 个月前

为了实现登录前页面的跳转，你可以在用户未登录时将当前页面的 URL 保存为一个查询参数，然后在登录成功后重定向回该页面。这里提供一个完整的示例，包括如何处理 GET 和 POST 请求。

首先，你需要在登录表单提交时包含一个隐藏字段来存储原始页面的 URL。

示例代码

1. 登录页面 HTML

<!-- login.ejs -->
<form action="/login" method="POST">
    <input type="text" name="username" placeholder="Username" required>
    <input type="password" name="password" placeholder="Password" required>
    <!-- 隐藏字段，存储当前页面的URL -->
    <input type="hidden" name="redirectUrl" value="<%= redirectUrl %>">
    <button type="submit">Login</button>
</form>

2. Express 路由处理

const express = require('express');
const app = express();
const bodyParser = require('body-parser');

app.use(bodyParser.urlencoded({ extended: false }));

// 假设这是你的登录验证函数
function authenticate(username, password) {
    // 这里写你的验证逻辑
    return username === 'admin' && password === 'password';
}

app.get('/login', (req, res) => {
    const redirectUrl = req.query.redir || '/';
    res.render('login', { redirectUrl });
});

app.post('/login', (req, res) => {
    const { username, password, redirectUrl } = req.body;

    if (authenticate(username, password)) {
        // 如果验证通过，重定向回原来的页面
        res.redirect(redirectUrl || '/');
    } else {
        // 如果验证失败，重新渲染登录页面并显示错误信息
        res.render('login', { error: 'Invalid credentials', redirectUrl });
    }
});

解释

GET 请求：当用户访问 /login 页面时，会将当前页面的 URL 作为 redir 参数传递给登录页面。
POST 请求：在登录表单中，我们添加了一个隐藏字段 redirectUrl 来存储 redir 参数。这样，在 POST 请求中，你可以通过 req.body.redirectUrl 获取到该参数。
重定向：如果用户登录成功，我们将使用 res.redirect(redirectUrl) 将用户重定向回原始页面。如果没有指定 redirectUrl，则默认重定向到首页。

通过这种方式，无论用户是从 GET 请求还是 POST 请求进入登录页面，都可以正确地重定向回他们登录前所在的页面。