时间戳

首页 > 解决方案 > 服务调用不会以反应原生方式进行。收到类似“可能未处理的承诺拒绝，参考错误：未定义响应”的警告

javascript - 服务调用不会以反应原生方式进行。收到类似“可能未处理的承诺拒绝，参考错误：未定义响应”的警告

问题描述

我是第一次反应原生并拨打服务电话的新手。我的问题是服务呼叫没有进行并收到警告

可能未处理的 Promise Rejection，引用错误：未定义响应。

我正在尝试使用 loginUser 功能。

api.js

const BASE_URL = "http://localhost:8200";

export const api = async (url, method, body = null, headers = {}) => {

    try {
      const endPoint = BASE_URL.concat(url);
      const reqBody = body ? JSON.stringify(body) : null;

      const fetchParams = {method, headers};

      if((method === "POST" || method === "PUT") && !reqBody) {
          throw new Error("Request body required");
      }

      if(reqBody) {
          console.log("ReQBody--->"+reqBody);
          fetchParams.headers["Content-type"] = "application/json";
          fetchParams.body = reqBody;
      }

      const fetchPromise = await fetch(endPoint, fetchParams);
      const timeOutPromise = new Promise((resolve, reject) => {
          setTimeout(() => {
              reject("Request Timeout");
          }, 3000);
      });

      const response = await Promise.race([fetchPromise, timeOutPromise]);

      return response;
    } catch (e) {
      return e;
    }
}

export const fetchApi = async (url, method, body, statusCode, token = null, loader = false) => {
    console.log("In FetchAPi Function");
    try {
        const headers = {}
        const result = {
            token: null,
            success: false,
            responseBody: null
        };
        if(token) {
            headers["securityKey"] = token;
        }

        const response = await api(url, method, body, headers);

        console.log("fetchApi-->>"+response);

        if(response.status === statusCode) {
            result.success = true;

            let responseBody;
            const responseText = await response.text();

            try {
                responseBody = JSON.parse(responseText);
            } catch (e) {
                responseBody = responseText;
            }

            result.responseBody = responseBody;
            return result;

        }

        let errorBody;
        const errorText = await response.text();

        try {
            errorBody = JSON.parse(errorText);
        } catch (e) {
            errorBody = errorText;
        }

        result.responseBody = errorBody;

        console.log("FetchApi(Result)--->>"+result);

        throw result;
    } catch (error) {
        return error;
    }
}

auth.actions.js

export const loginUser = (payload) => {
    console.log("In LoginUser function2");
    return async (dispatch) => {

        <-----**I am not able to enter into this block**------>

        try {
          dispatch({
            type: "LOGIN_USER_LOADING"
          });
          console.log("In LoginUser function3");
          const response = await fetchApi("/login", "POST", payload, 200);
          if(response.success) {
            dispatch({
                type: "LOGIN_USER_SUCCESS",
            });
            dispatch({
                type: "AUTH_USER_SUCCESS",
                token: response.token
            });
            dispatch({
                type: "GET_USER_SUCCESS",
                payload: response.responseBody
            });
            return response;
          } else {
            throw response;
          }

        } catch (error) {
            dispatch({
                type: "LOGIN_USER_FAIL",
                payload: error.responseBody
            });
            return error;
        }
    }
}

在控制台日志中，我在网络选项卡中看不到任何内容。在 android 模拟器中，出现了上述警告。

我的控制台选项卡

标签： javascriptreactjsreact-native

解决方案

I see that your BASE_URL is served using an http endpoint. You can only make requests to https endpoints from react native projects. A possible workaround is to use ngrok. Just download it and run ./ngrok http 8200 since your port number is 8200. It will expose an HTTPS endpoint and replace your BASE_URL with that link and try fetching the data again.

推荐阅读