React Native中response.json()未定义的Promise拒绝错误排查

问题根源分析 #

你遇到的TypeError: undefined is not an object (evaluating 'response.json')错误，核心原因是Promise链中的返回值丢失：
在你的loginAction里，第一个.then(response => { ... })块中没有返回response，导致下一个.then((response) => response.json())拿到的参数是undefined——自然就找不到json()方法了。

另外从你的响应内容来看，后端返回的并不是标准的JSON对象，而是一个带双引号的JWT字符串（_bodyInit里的内容是包裹在双引号里的token），即使修复了Promise链，直接用response.json()解析也会报错，因为这个字符串本身不是合法的JSON结构（JSON需要键值对，而这里只是一个字符串）。

分步解决方案 #

1. 修复Promise链的返回传递

修改loginAction中的第一个then块，确保返回response，让后续的Promise能拿到正确的响应对象：

export function loginAction(data) { 
  return dispatch => Promise.all([ 
    dispatch(loginStarted()), 
    loginService(data).then(response => { 
      console.log(response); 
      if (!response.ok) { 
        Alert.alert('ERROR', 'User or password is incorrect'); 
        dispatch(loginFailed('User or password is incorrect')); 
      } else { 
        Alert.alert('OK', 'Login is a success'); 
      }
      // 关键：返回response，传递给下一个then
      return response; 
    }).then((response) => response.text()).then((rawToken) => { 
      // 去掉前后的双引号，拿到纯净的JWT
      const token = rawToken.replace(/^"|"$/g, '');
      console.log('解析后的token:', token);
      // 这里可以根据需求处理token，比如直接dispatch或者转成对象
      dispatch(loginSuccess(token)); 
    }) 
  ]); 
}

2. 调整响应解析方式

因为后端返回的是带引号的字符串，所以我们用response.text()替代response.json()，然后通过正则去掉前后的双引号，得到真正的JWT令牌。

3. 优化loginService（可选）

你的loginService里的then(function (response) { return response; })是多余的，可以简化成：

export const loginService = (user) => { 
  return fetch(`${httpApiUrl}/api/userdata/ReactVerify`, { 
    method: 'POST', 
    headers: { 
      'Accept': '*/*', 
      'Content-Type': 'application/json', 
    }, 
    body: JSON.stringify(user) 
  });
};

额外说明 #

如果后续需要解析JWT的内容（比如获取用户信息），可以引入JWT解析库（如jwt-decode），直接解析拿到的纯净token：

import jwtDecode from 'jwt-decode';

// 在拿到token之后
const decodedToken = jwtDecode(token);
console.log('用户信息:', decodedToken);
dispatch(loginSuccess(decodedToken));

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