API 및 공용 기능들의 동작을 테스트할 수 있습니다
useApi 함수의 다양한 기능을 테스트합니다
useApi 함수의 자동 에러 처리 기능을 테스트합니다. 에러가 발생하면 자동으로 alert가 표시됩니다.
{{
autoErrorResult
}}
{`// 자동 에러 처리 예제
const apiTest = async () => {
const response = await useApi<ApiResponse<object>>(
"/admin/common-codes/USER_STATUS_ACTIVE222"
);
if (response) {
console.log("response:", response);
}
};`}
useApi 함수의 직접 에러 처리 기능을 테스트합니다. 에러 타입에 따른 세밀한 처리를 확인할 수 있습니다.
{{
customErrorResult
}}
{`// 직접 에러 처리 예제
const apiTestWithCustomError = async () => {
try {
const response = await useApi<ApiResponse<object>>(
"/admin/common-codes/USER_STATUS_ACTIVE222",
{
handleError: false, // 에러를 직접 처리
showAlert: false, // alert 표시 안함
}
);
if (response) {
console.log("response:", response);
}
} catch (error: any) {
// 에러 타입에 따른 세밀한 처리
if (error.response?.status === 404) {
alert("요청한 코드를 찾을 수 없습니다.");
} else if (error.response?.status === 403) {
alert("접근 권한이 없습니다.");
} else if (error.response?.status >= 500) {
alert("서버 오류가 발생했습니다.");
} else {
alert("알 수 없는 오류가 발생했습니다.");
}
}
};`}
다양한 API 엔드포인트를 테스트할 수 있습니다.
{{
result.data
}}
{`// 추가 API 테스트 예제
const testValidEndpoint = async () => {
try {
const response = await useApi<ApiResponse<object>>(
"/admin/common-codes/USER_STATUS_ACTIVE",
{
handleError: false,
showAlert: false,
}
);
console.log("성공:", response);
} catch (error: any) {
console.log("에러:", error.message);
}
};
const testNetworkError = async () => {
try {
const response = await useApi<ApiResponse<object>>(
"/non-existent-endpoint",
{
handleError: false,
showAlert: false,
}
);
} catch (error: any) {
console.log("네트워크 에러:", error.message);
}
};`}
API 권한, 메뉴 권한, 컴포넌트 권한의 동작을 테스트합니다
로그인 후 권한 데이터가 자동으로 로드되며, API 권한, 메뉴 권한, 컴포넌트 권한의 동작을 확인할 수 있습니다.
자동 에러 처리: useApi 함수가 에러를 자동으로 처리하고 사용자에게 알림을 표시합니다.
직접 에러 처리: handleError: false 옵션을 사용하여 에러를 직접 처리할 수 있습니다.
에러 타입: 404 (Not Found), 403 (Forbidden), 500+ (Server Error) 등 다양한 에러 상황을 테스트할 수 있습니다.
API 권한: 페이지 라우터 접근 권한을 제어합니다. 권한이 없으면 홈으로 리다이렉트됩니다.
메뉴 권한: 메뉴 표시 여부를 제어합니다. 권한이 없으면 메뉴가 숨겨집니다.
컴포넌트 권한: 버튼 등 UI 컴포넌트의 표시 여부를 제어합니다. 권한이 없으면 컴포넌트가 렌더링되지 않습니다.