MIME类型错误致脚本无法执行，注册表单跳转失败求助

一、解决MIME类型错误（main.js被识别为text/html） #

这个错误的核心是服务器处理/js/main.js请求时，返回的不是JS文件而是HTML（通常是404页面或首页），大概率是静态文件配置或路由顺序问题：

• 调整静态文件服务的位置：确保express.static配置在所有路由定义之前，比如在index.js中：

  const path = require('path');
  // 先配置静态文件服务，放在路由挂载前
  app.use(express.static(path.join(__dirname, 'public')));
  // 再挂载各类路由
  app.use('/', indexRoutes);
  app.use('/admin', adminRoutes);
  

  如果把静态文件配置放在路由之后，请求/js/main.js会先被路由（比如通配符路由、404路由）拦截，返回HTML页面，导致MIME类型不匹配。

• 确认静态文件目录结构：确保项目根目录下存在public/js/main.js，path.join(__dirname, 'public')要能正确指向包含js文件夹的静态资源目录。

• 检查路由冲突：排查是否有/js开头的自定义路由，或者通配符路由（如app.get('*', ...)）定义在静态文件配置之前，导致请求被提前拦截。

二、解决注册提交后无法跳转到首页的问题 #

注册后不跳转需要从后端路由处理和前端表单两个维度排查：

后端路由排查 #

• 检查注册路由的处理逻辑：在adminRoutes.js中，确保完成注册逻辑（如MongoDB写入）后再执行重定向，且异步操作处理正确：

  router.post('/signup', async (req, res) => {
    try {
      // 等待用户数据写入MongoDB完成
      await User.create({
        username: req.body.username,
        password: req.body.password // 注意：生产环境必须加密密码
      });
      // 注册成功后重定向到首页
      res.redirect('/');
    } catch (err) {
      // 错误时返回注册页并提示
      res.render('signup', { error: '注册失败，请重试' });
    }
  });
  

  必须等待异步操作（如User.create）完成后再调用res.redirect，否则可能因未完成注册或报错导致跳转逻辑未执行。

• 确认路由路径匹配：检查表单的action属性是否与后端注册路由的路径一致（比如后端路由是/admin/signup，表单action就要对应这个路径）。

前端表单排查 #

• 检查signup.ejs的表单代码：确保表单使用POST方法，action路径正确，且未意外阻止默认提交行为：

  <form action="/admin/signup" method="POST">
    <input type="text" name="username" placeholder="用户名">
    <input type="password" name="password" placeholder="密码">
    <button type="submit">注册</button>
  </form>
  

  如果用JS监听了表单提交事件，注意不要阻止默认行为后未手动跳转：

  // 错误示例：阻止默认提交但未处理跳转
  document.querySelector('form').addEventListener('submit', (e) => {
    e.preventDefault();
    // 仅发送请求未做跳转处理
  });
  
  // 正确示例（AJAX提交时）：
  document.querySelector('form').addEventListener('submit', async (e) => {
    e.preventDefault();
    const formData = new FormData(e.target);
    const res = await fetch('/admin/signup', { method: 'POST', body: formData });
    if (res.ok) {
      window.location.href = '/'; // 手动跳转首页
    }
  });
  

三、补充排查信息（若以上方案无效） #

请提供以下代码片段以便进一步定位问题：

• index.js中静态文件服务与路由挂载的完整代码
• adminRoutes.js中注册路由的完整逻辑
• signup.ejs中表单及引入main.js的代码

内容的提问来源于stack exchange，提问作者Buse Nur Çetin