728x90

createApi

Backend API로부터 어떻게 데이터를 반환할지에 대한 endpoint 를 정의.

    • baseQuery(args, {signal, disaptch, getState, extra }, extraOptions ) : endpoint에서 queryFn이 쓰이지 않았다면 모든 endpoint는 baseQuery를 거치게 된다. 
      • args: endpoint에서 query 함수 의 return Value, ex) query: () => '/todos/ -> '/todos' 반환
      • signal: AbortSignal 객체
      • dispatch, getState : redux store의 action을  dispatch하거나 state를 getState할 수 있다.
      • extra: thunk.extraArguments와 유사
        • thunk.withExtraArgument = createThunkMiddleware;
      • extraOptions: endpoint에서 extraOptions으로 넘겨준 값
    • endpoints : 서버에 대응해서 작동하는 operation 집합
    • extractRehydrationInfo : RTK Query는 Next.js에서 next-redux-wrapper를 통해 SSR을 제공하는데 이때 api요청과 함께 hydration을 도와준다.
    • tagTypes: endpoint별로 caching과 invalidation의 기준이 되는 string array
    • reducerPath: store에 저장할때 api별로 구분하기위한 unique key
    • serializeQueryArgs: 여러 이유로 캐 custom function
    • keepUnusedDataFor: default는 60초 이다. 설정 시간동안 api query에 대해 subscriber가 없으면 refetch 되게 만든다.
    • refetchOnMountOrArgChange : refetch 발동조건을 api query subscriber마다 줄지 결정한다. 시간 제한을 줄 수 도 있다. 
      • false(default) : 기본적으로는 항상 cache된 데이터를 반환한다. keepUnusedDataFor 시간만큼 api query에 subscriber가 없어야만 이후 api 요청에대해 refetch가 이뤄진다.
      • true: 새로운 subscriber가  query에 추가될 때마다 refetch가 이뤄진다.
      • number: 마지막 api fulfill시간과 현재시간을 비교해서 넘었으면 refetch한다. 여기서 fullfill은 cache된 데이터를 가져오는 것은 해당하지 않는다.
    • refetchOnFocus: default: false. true이면 application window가 focus되면 refetch 발동조건 성립
    • refetchOnReconnect : default false. true이면 network연결이 다시 되면 refetch 발동조건 성립

endpoint

      • query
      • queryFn(arg,{ signal, dispatch, getState }, extraOptions, baseQuery) : query, Mutation을 대체할 수 있다. query(Mutation)을 Customize할때 활용. createApi.baseQuery, transFormResponse를 거치지 않는다.
        • arg: query요청 시 매개변수
        • signal, dispatch, getState : createApi.baseQuery의 매개변수와 동일
        • extraOptions: 자기 자신한테 받은 extraOptions
        • baseQuery: createApi.baseQuery와 동일
      • transformResponse: Response를 변환한다.
      • extraOptions: baseQuery혹은 queryFn으로 전송할 third argument
      • providesTags, invalidatesTags: Cache 데이터에 Tag를 붙여주고 어떤 Tag를 가진 데이터를 refetch 혹은 cache로부터 삭제해야할지 결정한다.
      • keepUnusedDataFor: subscribe되지 않았는지 특정 초가 지나면 refetch 되게 해준다.
      • onQueryStarted(arg, { dispatch, getState, extra, requestId, getCacheEntry, updateCachedData}): api query를 요청할때 호출된다( cache된 데이터를 끌고올때는 호출되지 않는다)
        • arg: query 요청시 매개변수
        • queryFulfilled: query가 fulfill한 데이터를 반환하는 Promise. 이후의 로직 처리도 가능하다
        • getCacheEntry: cache entry의 값
      • onCacheEntryAdded(arg, { dispatch, getState, extra, requestId, getCacheEntry, updateCachedData}) : 새 cache entry가 추가 되었을때(new endpoint + query parameters combination) 실행된다.
        • cacheDataLoaded, cacheDataRemoved : Promise. 이후 로직 처리하기 위해 사용.

+ Recent posts