属性“get”在类型“()=> AxiosCacheInstance”上不存在

n9vozmp4  于 2023-10-18  发布在  iOS
关注(0)|答案(1)|浏览(123)

新的打字/React,并寻求帮助,特别是这个错误,并在一般任何其他不正确的。
我有一个名为api-client.ts的axios API客户端

//import axios, {CanceledError} from "axios";
import { default as axios } from 'axios'
import { setupCache } from 'axios-cache-interceptor';
import {    ReasonPhrases, StatusCodes, getReasonPhrase, getStatusCode, } from 'http-status-codes';
import { useNavigate } from "react-router-dom";

function apiClient() {

  const axiosInstance = axios.create({
    withCredentials: true,
    baseURL: "https://localhost:44372/api/v1/",
    headers: {
      "Content-type": "application/json"
    },
    timeout: 60 * 1000 // 1 minute.
    //disabled this to implement react-error-boundary (https://www.npmjs.com/package/react-error-boundary)
    /* ,
    validateStatus: function (status) {
      return status < StatusCodes.INTERNAL_SERVER_ERROR; //this allows axios to not treat status as error codes https://axios-http.com/docs/handling_errors
    } */
  });

  const navigate = useNavigate();

  axiosInstance.interceptors.response.use(
    (response) => {
      //debugger;
      return response;
    },
    (error) => {
      //debugger;
      switch (error.response.status) {
        case 401:
          // Handle Unauthorized calls here
          // Display an alert
          break;
        case 403:
          // Handle Unauthorized calls here
          // Display an alert
          //alert('403 Unauthorized');
          navigate("/status/404");
          break;
        case 500:
          // Handle 500 here
          // redirect
          break;
        // and so on..
      }

      if (error.response.status == 400) {
      }
      return Promise.reject(error);
    }
  );

  const apiClientCached = setupCache(axiosInstance);

  return apiClientCached;

}

export default apiClient;

我将其导入到我的服务中(auth-service.ts)

//import {apiClientOld} from "./api-client-old";
import apiClient from "./api-client";

class AuthService {

      getLoggedInUser() {
        return apiClient.get(`/Authorization/GetLoggedInUser`);
      }

      getLoggedInUserRoles() {
        return apiClient.get(`/Authorization/GetSecurityAttributesAsync`);
      } 

      testAuthorized() {
        return apiClient.get('/Authorization/TestAuthorized');
      }

      testUnauthorized() {
        return apiClient.get('/Authorization/TestUnauthorized');
      }
}

export default new AuthService();

我试图解决的问题是为什么.get抛出这个异常

Property 'get' does not exist on type '() => AxiosCacheInstance'.

提前感谢您
我的旧代码可以工作,尽管我不得不将其重写为一个函数组件,以便导航工作。
api-client-old.ts

import axios, {CanceledError} from "axios";
import { setupCache } from 'axios-cache-interceptor';
import {    ReasonPhrases, StatusCodes, getReasonPhrase, getStatusCode, } from 'http-status-codes';
import { useNavigate } from "react-router-dom";

const axiosInstance = axios.create({
  withCredentials: true,
  baseURL: "https://localhost:44372/api/v1/",
  headers: {
    "Content-type": "application/json"
  },  
  timeout: 60 * 1000 // 1 minute.
  //disabled this to implement react-error-boundary (https://www.npmjs.com/package/react-error-boundary)
  /* ,
  validateStatus: function (status) {
    return status < StatusCodes.INTERNAL_SERVER_ERROR; //this allows axios to not treat status as error codes https://axios-http.com/docs/handling_errors
  } */
  
})

export const apiClient = setupCache(axiosInstance)

export {CanceledError};

const navigate = useNavigate();
axiosInstance.interceptors.response.use(  
  (response) => {
    //debugger;
    return response;
  },
  (error) => {
    //debugger;
    switch (error.response.status) {
      case 401:
        // Handle Unauthorized calls here
        // Display an alert
        break;
      case 403:
        // Handle Unauthorized calls here
        // Display an alert
        //alert('403 Unauthorized');
        navigate("/status/404");
        break;
      case 500:
        // Handle 500 here
        // redirect
        break;
      // and so on..
    }

    if (error.response.status == 400) {
    }
    return Promise.reject(error);
  }
);
i2loujxw

i2loujxw1#

如果你调用return apiClient().get('/Authorization/TestUnauthorized')会怎么样?

相关问题