res.sendFile 正在中止，将我发送到 localhost:XXXX/?

Question

我设置了一条正在访问的路由，正如我从 console.logs 中了解到的那样。但是，最后的 res.sendFile 并没有把它带到正确的地方。它把我送到 localhost:XXXX/?.

这是路线：

router.get('/bidder', async (req, res) => {
  console.log('GET /bidder')
  console.log(req.session.user_id)
  
  try {
    const userData = await User.findByPk(req.session.user_id, {
      attributes: { exclude: ['password'] },
      include: [
        { 
          model: Project,
          attributes: ['project_name'],
          through: Bid,
          as: 'project_users'
        }
      ],
    });

    console.log(path.join(__dirname, '/../public', '/bidder.html'))
    res.sendFile(path.join(__dirname, '/../public', '/bidder.html',), function (err) {
      if (err) {
        console.log(err)
      }
    })
  } catch (err) {
    console.log(err)
    res.status(500).json(err);
  }
});

这是让我到达上面的 /bidder 路线的路线：

router.post('/login', async (req, res) => {
  console.log('POST /login');
  try {
      const user = await User.findOne({ where: { email: req.body.email } });

      if (!user) {
          res
              .status(400)
              .json({ message: 'Incorrect email or password, please try again.' });
          return;
      }

      const validPassword = await user.checkPassword(req.body.password);

      if (!validPassword) {
          res
              .status(400)
              .json({ message: 'Incorrect email or password, please try again.' });
          return;
      }

      req.session.save(() => {
        console.log(user);
        console.log(user.id);
        console.log(user.is_poster);
        
        req.session.user_id = user.id;
        req.session.is_poster = user.is_poster;
        req.session.logged_in = true;
        
        console.log(req.session.logged_in)
        
        if (req.session.is_poster == false) {
          console.log('---------------------------')
          console.log(req.session.is_poster)
          console.log(path.join(__dirname, '/../public/bidder.html'))
          
          res.redirect('/bidder')
        } else if (req.session.is_poster == true) {
          console.log('---------------------------')
          console.log(req.session.is_poster)
          console.log(path.join(__dirname, '/../public/poster.html'))
          
          res.redirect('/poster')
        } else {
          console.log('not logged in')
          
          res.redirect('/')
        }
      });

  } catch (err) {
    console.log(err);
    res.status(404).end();
  }
});

它正在记录的错误是：

Error: Request aborted
    at onaborted (C:\Users\camer\Desktop\homework\project-bid-board\node_modules\express\lib\response.js:1025:15)
    at Immediate._onImmediate (C:\Users\camer\Desktop\homework\project-bid-board\node_modules\express\lib\response.js:1067:9)
    at processImmediate (internal/timers.js:464:21) {
  code: 'ECONNABORTED'
}

如果我只是在浏览器中输入 localhost:XXXX/bidder，它就会把我带到正确的 html 页面，这是应该的。

编辑这是提交登录数据关联的JS：

$('#login-button').on('click', function(event) {
    event.preventDefault();
    
    var email = $('#login-email').val()
    var password = $('#login-password').val()

    loginUser(email, password)
})

const loginUser = async (email, password) => {
    const response = await fetch (`/api/user/login`, {
        method: 'POST',
        body: JSON.stringify({ email, password }),
        headers: { 'Content-Type': 'application/json' },
    })

    console.log(response.statusText)
}

这是它正在处理的表格：

                  <form>
                    <div>
                        <label for="username">E-mail / Username:</label>
                        <input class="text-input" id="login-email" type="text" placeholder="me@example.com" />
                    </div>
                    <div>
                        <label for="password">Password:</label>
                        <input class="text-input" type="text" id="login-password" placeholder="password"></input>
                    </div>
                    <section>
                        <button class="btn-lg btn-block" id="login-button">Login</button>
                        <div class="text-center" id="signupSuccessMsg"></div>
                    </section>
                </form>

Answer 1

您 post 在您的 Javascript 中 /login 和 fetch()。 fetch() 本身不会改变浏览器中的任何内容 window - 即使响应是重定向。

相反，fetch() 向您的服务器发出一个 http 请求并获得响应并将其传送到您的 Javascript。完全由您 Javascript 决定如何处理该响应。如果您想遵循重定向，则必须编写 Javascript 以从 fetch() 调用中查找 3xx 响应状态，获取 location header 然后设置window.location 到那个新 URL。这将导致浏览器转到该新页面。

由于您的 Javascript post 登录表单似乎没有做任何特别的事情，您可以删除 Javascript 并让浏览器 post 自己的表单，并确保您的服务器被编程为接受如果 post 直接由浏览器编辑表单的编码方式。然后，浏览器将自动遵循重定向响应或显示 post 返回的任何内容。

res.sendFile 正在中止，将我发送到 localhost:XXXX/?

res.sendFile is being aborted, sending me to localhost:XXXX/?

javascript

node.js

express

express-session