client.ts 6.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228
  1. 'use client';
  2. import { clsx, type ClassValue } from 'clsx';
  3. import { twMerge } from 'tailwind-merge';
  4. import { TokenData, ResultDto, ApiError } from '@/types/response/common';
  5. import { CLAIM_NAME_IDENTIFIER, CLAIM_EMAIL, CLAIM_NAME } from '@/constants/common';
  6. export function cn(...inputs: ClassValue[]) {
  7. return twMerge(clsx(inputs))
  8. }
  9. // 클라이언트용 fetch 유틸 (Route Handler 호출용)
  10. interface FetchApiOptions extends Omit<RequestInit, 'body'> {
  11. body?: unknown;
  12. }
  13. export async function fetchApi<T>(url: string, options?: FetchApiOptions): Promise<ResultDto<T>> {
  14. const isFormData = options?.body instanceof FormData;
  15. const hasBody = options?.body !== undefined;
  16. const res = (await fetch(url, {
  17. ...options,
  18. headers: {
  19. ...(!isFormData && hasBody ? { 'Content-Type': 'application/json' } : {}),
  20. ...options?.headers
  21. },
  22. body: isFormData ? options.body as BodyInit : (options?.body ? JSON.stringify(options.body) : undefined)
  23. }));
  24. return res.json();
  25. }
  26. // JWT 토큰에서 사용자 정보 추출
  27. export function decodeAccessToken(token: string): TokenData|null {
  28. try {
  29. const base64URL = token.split('.')[1]; // JWT의 Payload 부분
  30. const base64 = base64URL.replace(/-/g, '+').replace(/_/g, '/'); // Base64 형식 변환
  31. const jsonPayload = decodeURIComponent(
  32. atob(base64).split('').map(c => '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2)).join('')
  33. );
  34. const payload = JSON.parse(jsonPayload);
  35. return {
  36. id: payload[CLAIM_NAME_IDENTIFIER] || null,
  37. email: payload[CLAIM_EMAIL] || null,
  38. name: payload[CLAIM_NAME] || null
  39. };
  40. } catch {
  41. return null;
  42. }
  43. }
  44. // 날짜 형식 변환 표시
  45. export function formatDate(dateString: string|null): string {
  46. if (!dateString) {
  47. return '-';
  48. }
  49. const date = new Date(dateString);
  50. const now = new Date();
  51. const diffMs = now.getTime() - date.getTime();
  52. const diffSec = Math.floor(diffMs / 1000);
  53. const diffMin = Math.floor(diffSec / 60);
  54. const diffHour = Math.floor(diffMin / 60);
  55. const diffDay = Math.floor(diffHour / 24);
  56. const diffWeek = Math.floor(diffDay / 7);
  57. const diffMonth = Math.floor(diffDay / 30);
  58. const diffYear = Math.floor(diffDay / 365);
  59. if (diffSec < 60) return '방금 전';
  60. if (diffMin < 60) return `${diffMin}분 전`;
  61. if (diffHour < 24) return `${diffHour}시간 전`;
  62. if (diffDay < 7) return `${diffDay}일 전`;
  63. if (diffWeek < 5) return `${diffWeek}주 전`;
  64. if (diffMonth < 12) return `${diffMonth}개월 전`;
  65. return `${diffYear}년 전`;
  66. }
  67. // 2025.01.01. 12:00:00 으로 조회
  68. export function getDateTime(dateString: string|null) {
  69. if (!dateString) {
  70. return '-';
  71. }
  72. const date = new Date(dateString);
  73. return date.toLocaleString('ko-KR', {
  74. year: 'numeric',
  75. month: '2-digit',
  76. day: '2-digit',
  77. hour: '2-digit',
  78. minute: '2-digit',
  79. second: '2-digit',
  80. hour12: false
  81. }).replace(/\. /g, '.').replace(/\.(\d{2}:)/, ' $1');
  82. }
  83. // 파일 이름 생성
  84. export function getDateFilename(prefix: string): string {
  85. if (!prefix) {
  86. return '';
  87. }
  88. const now = new Date();
  89. const yyyy = now.getFullYear();
  90. const MM = String(now.getMonth() + 1).padStart(2, '0');
  91. const dd = String(now.getDate()).padStart(2, '0');
  92. const hh = String(now.getHours()).padStart(2, '0');
  93. const mm = String(now.getMinutes()).padStart(2, '0');
  94. const ss = String(now.getSeconds()).padStart(2, '0');
  95. return `${prefix}-${yyyy}${MM}${dd}${hh}${mm}${ss}.png`;
  96. }
  97. // HTML 태그 제거
  98. export function stripHtmlTags(str?: string|null): string {
  99. if (!str) {
  100. return '';
  101. }
  102. const div = document.createElement('div');
  103. div.innerHTML = str;
  104. return div.textContent || div.innerText || '';
  105. }
  106. // 비밀번호 정책 안내 문구 생성성
  107. export function getPasswordPolicyMessage(policy: {
  108. passwordUppercaseLength: number;
  109. passwordNumbersLength: number;
  110. passwordSpecialcharsLength: number;
  111. }) {
  112. const parts: string[] = [];
  113. if (policy.passwordUppercaseLength > 0) {
  114. parts.push(`영문 대문자 ${policy.passwordUppercaseLength}자 이상`);
  115. }
  116. if (policy.passwordNumbersLength > 0) {
  117. parts.push(`숫자 ${policy.passwordNumbersLength}자 이상`);
  118. }
  119. if (policy.passwordSpecialcharsLength > 0) {
  120. parts.push(`특수문자 ${policy.passwordSpecialcharsLength}자 이상`);
  121. }
  122. if (parts.length > 0) {
  123. return `비밀번호는 ${parts.join(', ')}를 포함해야 합니다.`;
  124. }
  125. return '';
  126. }
  127. // 특수문자 제거
  128. export function filterSpecialCharacters(str: string) {
  129. return str.replace(/[^\p{L}\p{N}\s]/gu, '');
  130. }
  131. // ResultDto에서 첫 번째 오류 조회
  132. export function getError(errors: ApiError[]|null|undefined, index = 0): string|undefined {
  133. if (!errors || errors.length === 0) {
  134. return undefined;
  135. }
  136. return errors[index]?.description;
  137. }
  138. // 서버 응답 메시지 분석
  139. export function throwError<T>(res: ResultDto<T>): void {
  140. if (res.success) {
  141. return;
  142. }
  143. let message: string|null|undefined = getError(res.errors);
  144. if (!message) {
  145. message = res.message;
  146. }
  147. if (!message) {
  148. switch (res.status) {
  149. case 400: message = '잘못된 요청입니다.'; break;
  150. case 401:
  151. message = '로그인 후 이용해 주세요.';
  152. // 인증 만료 이벤트 발행
  153. window.dispatchEvent(new CustomEvent('auth:unauthorized'));;
  154. break;
  155. case 403: message = '권한이 없습니다.'; break;
  156. case 404: message = '요청하신 페이지를 찾을 수 없습니다.'; break;
  157. case 500: message = '서버 오류가 발생했습니다. 다시 시도해 주세요.'; break;
  158. }
  159. }
  160. if (message) {
  161. throw new Error(message);
  162. }
  163. }
  164. // 1000회 이상 조회된 게시글인지 확인
  165. export function isHotPost(showHotIcon: boolean, post: { views: number; createdAt: string }): boolean {
  166. return (showHotIcon && post.views >= 1000 && Date.now() - new Date(post.createdAt).getTime() < 7 * 24 * 60 * 60 * 1000);
  167. }
  168. // 24시간 이내에 작성된 게시글인지 확인
  169. export function isNewPost(showNewIcon: boolean, post: { createdAt: string }): boolean {
  170. return (showNewIcon && Date.now() - new Date(post.createdAt).getTime() < 24 * 60 * 60 * 1000);
  171. }
  172. // a 태그에 target="_blank" 추가
  173. export function forceTargetBlank(html: string) {
  174. return html.replace(/<a\s+(?![^>]*target=)([^>]*href=["'][^"']+["'])/gi, '<a target="_blank" rel="noopener noreferrer" $1');
  175. };
  176. // 날짜가 현재 날짜보다 지났는지 확인
  177. export function isDateOverdue(dateString: string|null, days = 0): boolean {
  178. if (!dateString) {
  179. return false;
  180. }
  181. const limitDate = new Date(new Date(dateString));
  182. limitDate.setDate(limitDate.getDate() + days);
  183. const now = new Date();
  184. return now > limitDate;
  185. }