246 lines
8.7 KiB
JavaScript
246 lines
8.7 KiB
JavaScript
// api.js — 서버 REST API 얇은 래퍼
|
|
// 모든 응답 본문은 ApiResponse<T> ( data / count / message ) 형태다.
|
|
// 성공하면 Data 를 벗겨서 돌려주고, 실패하면 ApiError 를 던진다.
|
|
|
|
const BASE = '/api/portfolio';
|
|
|
|
/** 서버가 2xx 가 아닌 응답을 줬을 때 던지는 오류 */
|
|
export class ApiError extends Error {
|
|
constructor(status, message) {
|
|
super(message);
|
|
this.name = 'ApiError';
|
|
this.status = status;
|
|
this.message = message;
|
|
}
|
|
}
|
|
|
|
/** 상태 코드별 한국어 기본 메시지 (서버 message 가 없을 때만 사용) */
|
|
function fallbackMessage(status) {
|
|
if (status === 0) return '서버에 연결할 수 없습니다. 네트워크를 확인해 주세요.';
|
|
if (status === 400) return '요청 내용이 올바르지 않습니다.';
|
|
if (status === 401) return '로그인이 필요합니다.';
|
|
if (status === 403) return '권한이 없습니다.';
|
|
if (status === 404) return '요청한 데이터를 찾을 수 없습니다.';
|
|
if (status === 409) return '이미 존재하거나 처리할 수 없는 요청입니다.';
|
|
if (status === 413) return '파일 용량이 너무 큽니다.';
|
|
if (status === 429) return '요청이 너무 많습니다. 잠시 후 다시 시도해 주세요.';
|
|
if (status === 503) return '서비스를 사용할 수 없습니다.';
|
|
if (status >= 500) return '서버 오류가 발생했습니다.';
|
|
return '요청을 처리하지 못했습니다.';
|
|
}
|
|
|
|
/** 204 / 빈 본문 / JSON 이 아닌 본문에서도 절대 throw 하지 않는 파서 */
|
|
async function readBody(res) {
|
|
if (res.status === 204 || res.status === 205) return null;
|
|
let text = '';
|
|
try {
|
|
text = await res.text();
|
|
} catch {
|
|
return null;
|
|
}
|
|
if (!text || !text.trim()) return null;
|
|
try {
|
|
return JSON.parse(text);
|
|
} catch {
|
|
// JSON 이 아니면 원문을 그대로 메시지 후보로 넘긴다.
|
|
return { message: text };
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 본문 크기 초과처럼 ASP.NET 이 우리 형식(ApiResponse)을 거치지 않고 돌려주는
|
|
* 영문 오류를 한국어로 바꾼다. 해당하지 않으면 빈 문자열.
|
|
*/
|
|
function translateFrameworkError(body) {
|
|
let text = '';
|
|
try {
|
|
text = JSON.stringify(body);
|
|
} catch {
|
|
return '';
|
|
}
|
|
if (/Request body too large|request body size/i.test(text)) {
|
|
const m = /(\d{6,})\s*bytes/.exec(text);
|
|
const mb = m ? Math.floor(Number(m[1]) / (1024 * 1024)) : 0;
|
|
return mb > 0
|
|
? '파일이 너무 큽니다. 최대 ' + mb + 'MB 까지 올릴 수 있습니다.'
|
|
: '파일이 너무 큽니다.';
|
|
}
|
|
if (/Multipart body length limit/i.test(text)) {
|
|
return '파일이 너무 큽니다.';
|
|
}
|
|
return '';
|
|
}
|
|
|
|
/** 응답 본문에서 사람이 읽을 메시지를 고른다. ApiResponse / ProblemDetails 모두 지원 */
|
|
function pickMessage(body) {
|
|
if (!body || typeof body !== 'object') return '';
|
|
|
|
// 프레임워크가 직접 낸 영문 오류를 먼저 걸러 낸다.
|
|
const translated = translateFrameworkError(body);
|
|
if (translated) return translated;
|
|
|
|
const candidates = [body.message, body.Message, body.detail, body.title, body.error];
|
|
for (const value of candidates) {
|
|
if (typeof value === 'string' && value.trim()) return value.trim();
|
|
}
|
|
return '';
|
|
}
|
|
|
|
/** ApiResponse 래퍼에서 Data 만 꺼낸다. 래퍼가 아니면 그대로 돌려준다. */
|
|
function unwrapData(body) {
|
|
if (!body || typeof body !== 'object') return body;
|
|
if ('data' in body) return body.data;
|
|
if ('Data' in body) return body.Data;
|
|
return body;
|
|
}
|
|
|
|
/** ApiResponse 의 Count 를 꺼낸다. 없으면 null */
|
|
function unwrapCount(body) {
|
|
if (!body || typeof body !== 'object') return null;
|
|
if (typeof body.count === 'number') return body.count;
|
|
if (typeof body.Count === 'number') return body.Count;
|
|
return null;
|
|
}
|
|
|
|
/**
|
|
* 공통 요청 함수. 성공 시 파싱된 본문(래핑된 상태)을 그대로 돌려준다.
|
|
* @param {string} path
|
|
* @param {{method?:string, body?:any, form?:FormData}} [options]
|
|
*/
|
|
async function request(path, options = {}) {
|
|
const method = options.method || 'GET';
|
|
const init = {
|
|
method,
|
|
credentials: 'same-origin',
|
|
headers: { Accept: 'application/json' }
|
|
};
|
|
|
|
if (options.form) {
|
|
// multipart 는 브라우저가 boundary 를 붙여야 하므로 Content-Type 을 지정하지 않는다.
|
|
init.body = options.form;
|
|
} else if (options.body !== undefined) {
|
|
init.headers['Content-Type'] = 'application/json';
|
|
init.body = JSON.stringify(options.body);
|
|
}
|
|
|
|
let res;
|
|
try {
|
|
res = await fetch(path, init);
|
|
} catch {
|
|
throw new ApiError(0, fallbackMessage(0));
|
|
}
|
|
|
|
const body = await readBody(res);
|
|
if (!res.ok) {
|
|
throw new ApiError(res.status, pickMessage(body) || fallbackMessage(res.status));
|
|
}
|
|
return body;
|
|
}
|
|
|
|
/** 요청 후 Data 만 벗겨서 돌려준다. */
|
|
async function requestData(path, options) {
|
|
const body = await request(path, options);
|
|
return unwrapData(body);
|
|
}
|
|
|
|
/** 쿼리스트링을 만든다. null/undefined/빈문자열 값은 제외. */
|
|
function queryString(params) {
|
|
const usp = new URLSearchParams();
|
|
for (const key of Object.keys(params || {})) {
|
|
const value = params[key];
|
|
if (value === null || value === undefined || value === '') continue;
|
|
usp.set(key, String(value));
|
|
}
|
|
const text = usp.toString();
|
|
return text ? '?' + text : '';
|
|
}
|
|
|
|
export const api = {
|
|
auth: {
|
|
/** 로그인 상태 조회. 401 을 던지지 않는다. → { authenticated: bool } */
|
|
me() {
|
|
return requestData(BASE + '/auth/me');
|
|
},
|
|
/** 관리자 로그인 */
|
|
login(password) {
|
|
return requestData(BASE + '/auth/login', { method: 'POST', body: { password } });
|
|
},
|
|
/** 관리자 로그아웃 */
|
|
logout() {
|
|
return requestData(BASE + '/auth/logout', { method: 'POST', body: {} });
|
|
}
|
|
},
|
|
|
|
categories: {
|
|
/** 카테고리 전체 목록 → CategoryDto[] */
|
|
async list() {
|
|
const data = await requestData(BASE + '/categories');
|
|
return Array.isArray(data) ? data : [];
|
|
},
|
|
create(dto) {
|
|
return requestData(BASE + '/categories', { method: 'POST', body: dto });
|
|
},
|
|
update(no, dto) {
|
|
return requestData(BASE + '/categories/' + encodeURIComponent(no), { method: 'PUT', body: dto });
|
|
},
|
|
remove(no) {
|
|
return requestData(BASE + '/categories/' + encodeURIComponent(no), { method: 'DELETE' });
|
|
}
|
|
},
|
|
|
|
posts: {
|
|
/**
|
|
* 게시물 목록. Count 는 페이지 크기가 아니라 전체 개수다.
|
|
* @returns {Promise<{items: Array, total: number}>}
|
|
*/
|
|
async list(opts = {}) {
|
|
const category = opts.category && opts.category !== 'all' ? opts.category : '';
|
|
const qs = queryString({ category, page: opts.page, size: opts.size });
|
|
const body = await request(BASE + '/posts' + qs);
|
|
const data = unwrapData(body);
|
|
const items = Array.isArray(data) ? data : [];
|
|
const count = unwrapCount(body);
|
|
return { items, total: typeof count === 'number' ? count : items.length };
|
|
},
|
|
/** 게시물 상세 → PostDetailDto */
|
|
get(no) {
|
|
return requestData(BASE + '/posts/' + encodeURIComponent(no));
|
|
},
|
|
create(dto) {
|
|
return requestData(BASE + '/posts', { method: 'POST', body: dto });
|
|
},
|
|
update(no, dto) {
|
|
return requestData(BASE + '/posts/' + encodeURIComponent(no), { method: 'PUT', body: dto });
|
|
},
|
|
remove(no) {
|
|
return requestData(BASE + '/posts/' + encodeURIComponent(no), { method: 'DELETE' });
|
|
}
|
|
},
|
|
|
|
uploads: {
|
|
/**
|
|
* 업로드 한도와 허용 확장자.
|
|
* @returns {Promise<{maxBytes:number, maxMegabytes:number, allowedExtensions:string[]}>}
|
|
*/
|
|
limit() {
|
|
return requestData(BASE + '/uploads/limit');
|
|
},
|
|
/**
|
|
* 이미지 업로드. 필드 이름은 'file', Content-Type 은 지정하지 않는다.
|
|
* @param {File} file
|
|
* @returns {Promise<{url:string, fileName:string, size:number}>}
|
|
*/
|
|
upload(file) {
|
|
const form = new FormData();
|
|
form.append('file', file);
|
|
return requestData(BASE + '/uploads', { method: 'POST', form });
|
|
},
|
|
/** 업로드된 파일 삭제 (204 → null) */
|
|
remove(url) {
|
|
return requestData(BASE + '/uploads' + queryString({ url }), { method: 'DELETE' });
|
|
}
|
|
}
|
|
};
|
|
|
|
export default api;
|