登录功能无报错却跳转回登录页问题排查求助

核心错误：前端fetch响应解析语法错误 #

你的前端代码中fetch的响应处理存在语法问题：

// 错误写法
.then(response => response.json)

response.json是Fetch API内置的异步方法，必须添加括号调用才会执行响应体的JSON解析逻辑。你当前的写法是直接将方法本身传递给下一个then回调，导致data变量实际为json函数对象，永远不可能等于字符串success，因此首页跳转逻辑永远不会触发。

修复代码 #

将上述行修改为：

.then(response => response.json())

补充优化：添加异常捕获定位问题 #

当前代码缺失全局错误捕获逻辑，因此请求跨域、参数错误、后端异常等问题都不会抛出可见提示，建议在fetch调用链末尾添加catch块：

fetch(/* 原有请求配置 */)
  .then(response => response.json())
  .then(data => {
    if (data === 'success') {
      this.props.onRouteChange('home');
    } 
  })
  // 新增错误捕获
  .catch(err => {
    console.error('登录请求异常：', err)
  })

其他潜在问题排查 #

如果修复上述语法问题后仍无法正常登录，请依次核对以下配置：

• 确认后端已正确注册body-parser中间件，否则无法解析前端传递的JSON参数：

const bodyParser = require('body-parser')
app.use(bodyParser.json())

• 确认后端已注册cors中间件，避免跨域请求被浏览器拦截：

const cors = require('cors')
app.use(cors())

• 当前后端登录逻辑仅比对数据库users数组的第一条用户数据，需确认你输入的账号密码与该条数据完全一致。

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