AxiosError: Сетевая ошибка на iOS (GET-запрос) с Expo, работает нормально на Android

это первый раз, когда я задаю вопрос в stack overflow. я надеюсь, что это поможет мне решить проблему.

О проекте

  • Я использую expo и axios для api запроса
  • .
  • использую хуки для обработки запроса
  • использую Django в качестве бэкенда

Обзор проблемы

  • Api запрос (все типы запросов) работает правильно в Android и Web
  • В IOS POST запрос работает правильно, но Get запрос не работает
  • Получаю эту ошибку при запросе get запроса с IOS «AxiosError: Network Error"
  • Я протестировал Get запрос в IOS с другим приложением API тестера в IOS, тогда он работал нормально

Expo App некоторые коды

app.json


{
  "expo": {
    "name": "MyWard",
    "platforms": [
      "ios",
      "android"
    ],
    "scheme": "com.myward",
    "slug": "myward",
    "version": "1.0.0",
    "orientation": "portrait",
    "icon": "./assets/images/logo/thumbnail.png",
    "userInterfaceStyle": "automatic",
    "ios": {
      "bundleIdentifier": "com.myward",
      "supportsTablet": false,
      "jsEngine": "jsc",
      "infoPlist": {
        "LSApplicationQueriesSchemes": ["whatsapp"]
      },
      "runtimeVersion": {
        "policy": "appVersion"
      }
    },
    "splash": {
      "image": "./assets/images/logo/thumbnail.png",
      "backgroundColor": "#ffffff"
    },
    "jsEngine": "hermes",
    "android": {
      "package": "com.myward",
      "googleServicesFile": "./android/app/google-services.json",
      "runtimeVersion": "1.0.0"
    },
    "web": {
      "bundler": "metro",
      "output": "static",
      "favicon": "./assets/images/logo/thumbnail.png"
    },
    "plugins": [
      "expo-router",
      "expo-localization",
      [
        "expo-build-properties",
        {
          "android": {
            "usesCleartextTraffic": true
          }
        }
      ]
    ],
    "experiments": {
      "typedRoutes": true
    },
    "extra": {
      "router": {
        "origin": false
      },
      "eas": {
        "projectId": "48729d2e-6a7b-4b70-811c-c0b03ad2fd89"
      }
    },
    "owner": "myward",
    "updates": {
      "url": "https://u.expo.dev/48729d2e-6a7b-4b70-811c-c0b03ad2fd89"
    }
  }
}

useApiHook



import { useState, useCallback } from "react";
import axios, { AxiosRequestConfig, Method } from "axios";
import { useGlobalContext } from "@/context/GlobalProvider";

interface UseAxiosFetchProps<T> {
  isFetching: boolean;
  fetch: (
    method: Method,
    endpoint: string,
    data?: any,
    token?: string,
    contentType?: ContentType, // Add this parameter
    reloadEffect?: boolean
  ) => Promise<ApiRespond>; // Return Promise
  isFetchedData: boolean;
}

interface ApiRespond {
  ok: boolean;
  data?: any;
  error?: any;
  status: number;
}
type ContentType = "application/json" | "multipart/form-data";
function useApi<T = any>(): UseAxiosFetchProps<T> {
  const [isFetching, setIsFetching] = useState<boolean>(false);
  const [isFetchedData, setIsFetchedData] = useState<boolean>(false);
  const { setIsLoadingOverlay } = useGlobalContext();
  // Fetch function
  const fetch = useCallback(
    async (
      method: Method,
      endpoint: string,
      data?: any,
      token?: string,
      contentType?: ContentType,
      reloadEffect = true
    ): Promise<ApiRespond> => {
      reloadEffect && setIsLoadingOverlay(true);
      setIsFetching(true);

      const config: AxiosRequestConfig = {
        method,
        url: endpoint,
        headers: {
          ...(token ? { Authorization: Bearer ${token} } : {}),
          ...(contentType ? { "Content-Type": contentType } : {}),
        },
        data
      };
      console.log(config);
      let responseData;
      try {
        const response = await axios.request<T>(config);
        responseData = {
          ok: true,
          data: response.data,
          status: response.status,
        };
      } catch (error: any) {
        console.log(error);
        responseData = {
          ok: false,
          status: error.response ? error.response.status : 408,
          error: error.response?.data,
        };
      } finally {
        reloadEffect && setIsLoadingOverlay(false);
        setIsFetching(false);

        if (!isFetchedData) setIsFetchedData(true);
      }
      return responseData;
    },
    []
  );

  return { isFetching, fetch, isFetchedData };
}

export default useApi;


Первый GET-запрос я делаю здесь


 const verifyUser = useCallback(async () => {
    const token = await _retrieveData("authToken");
    if (token) {
      const response = await fetch(
        "GET",
        API_ENDPOINTS.VERIFY_USER,
        {},
        token,
        "application/json",
        false
      );

      if (response.ok) {
        const data: userDataType = response.data;
        login(
          data.auth_token,
          data.user_preference.language,
          data.user_preference.theme,
          data.profile!,
          data.phone_number
        );
      } else {
        openWelcomeText();
      }
    } else {
      openWelcomeText();
    }
  }, [fetch, login]); // Dependencies: fetch and login

  useEffect(() => {
    verifyUser();
  }, []);



Django backend

settings.py

Пожалуйста, помогите мне решить эту проблему. Я искал это решение в Интернете в течение 5 часов

Проблема решена . Проблема была связана с Axios и методом запроса. В IOS мы должны передавать «GET» для get запроса, а не маленькую букву «get»

Вернуться на верх