Express.js项目：点击登录页Submit按钮无跳转问题求助

核心原因很明确：你在login.js里调用了event.preventDefault()，这直接阻止了表单的默认HTTP提交行为。

原本的流程是：点击Submit → 表单以POST方式提交到/login路由 → 后端执行res.redirect('/chat') → 浏览器收到响应后跳转。但现在event.preventDefault()打断了这个默认流程，你只通过socket.emit发送了登录信息——而socket属于WebSocket通信，和HTTP请求是完全独立的两个通道，后端的res.redirect('/chat')根本没有触发的机会，自然不会触发跳转。

另外你提到“之前未配置好静态文件时跳转正常”，那是因为当时MIME类型错误导致login.js没被正确加载执行，event.preventDefault()没生效，表单的默认提交流程正常运行，所以后端的redirect能正常工作。

两种解决方案： #

• 方案一：移除阻止默认行为的代码
  如果你的登录逻辑不需要依赖socket，直接删掉event.preventDefault()，让表单按默认HTTP流程提交，后端的res.redirect就能正常触发浏览器跳转。注意如果同时保留socket.emit会导致登录信息重复发送，需要同步调整逻辑。

• 方案二：基于socket逻辑手动处理跳转
  既然选择用socket发送登录信息，就不要依赖后端HTTP的redirect，改为前后端配合在socket回调里处理跳转：

  1. 后端监听socket的登录事件，验证通过后向前端发送成功信号
  2. 前端在发送登录信息后监听后端的成功响应，收到后手动跳转

前端示例代码（login.js）：

const form = document.querySelector('form');
form.addEventListener('submit', (e) => {
  e.preventDefault();
  console.log('Form submitted');
  // 收集表单数据
  const loginInfo = {
    username: document.querySelector('#username').value,
    password: document.querySelector('#password').value
  };
  socket.emit('login', loginInfo);
});

// 监听后端返回的登录成功事件
socket.on('loginSuccess', () => {
  window.location.href = '/chat';
});

后端示例代码（index.js socket部分）：

const io = require('socket.io')(server); // 假设已经创建了HTTP server

io.on('connection', (socket) => {
  socket.on('login', async (loginData) => {
    // 这里替换成你的登录验证逻辑
    const isValid = await checkUserCredentials(loginData.username, loginData.password);
    if (isValid) {
      socket.emit('loginSuccess');
    } else {
      socket.emit('loginFail', '用户名或密码错误');
    }
  });
});

内容的提问来源于stack exchange，提问作者Timur