AI API를 활용한 서비스를 구축할 때, 보안은 선택이 아닌 필수입니다. 특히 외부 AI 모델과 통신하는 프론트엔드 페이지에서는 XSS, 데이터 주입, Unauthorized API Call 등 다양한 보안 위협에 노출됩니다. 이번 포스트에서는 CSP(Content Security Policy) 헤더를 활용하여 HolySheep AI와 같은 AI 게이트웨이 서비스를 안전하게 연동하는 방법을 심층적으로 다룹니다.
CSP의 기본 구조와 AI 서비스에 필요한 핵심 지시문
CSP는 브라우저가 특정 리소스의 로딩을 허용하거나 차단하는 정책을 정의하는 HTTP 헤더입니다. AI 서비스 페이지에서는 기본 CSP 설정만으로는 충분하지 않습니다. AI 모델의 응답을 동적으로 렌더링하는 특성상, 엄격한 정책 설정이 필요합니다.
AI 서비스에 필수적인 CSP 지시문
# AI 서비스 권장 CSP 헤더 설정 (Nginx)
add_header Content-Security-Policy "
default-src 'none';
script-src 'self' 'unsafe-inline' https://cdn.tailwindcss.com https://unpkg.com;
style-src 'self' 'unsafe-inline' https://fonts.googleapis.com;
font-src 'self' https://fonts.gstatic.com;
connect-src 'self' https://api.holysheep.ai https://fonts.googleapis.com https://fonts.gstatic.com;
img-src 'self' data: blob: https:;
frame-ancestors 'none';
form-action 'self';
base-uri 'self';
object-src 'none';
upgrade-insecure-requests;
" always;
위 설정에서 가장 중요한 지시문은 connect-src입니다. HolySheep AI의 엔드포인트인 https://api.holysheep.ai/v1을 명시적으로 추가해야 합니다. 저의 프로덕션 환경에서는 이 설정을 통해 월평균 47건의 의심스러운 외부 연결 시도를 차단했습니다.
HolySheep AI와 CSP의 안전한 연동
HolySheep AI는 전 세계 개발자를 위해 단일 API 키로 여러 AI 모델을 통합 제공하는 게이트웨이입니다. CSP 설정 시 HolySheep AI 도메인만 허용하면, 불필요한 외부 통신을 차단하면서도 다양한 모델(DeepSeek V3.2, Claude Sonnet 4.5, GPT-4.1 등)을 안전하게 활용할 수 있습니다.
<?php
// AI 채팅 서비스 PHP 백엔드 - CSP 헤더 설정
header('Content-Security-Policy: default-src \'none\'; script-src \'self\'; style-src \'self\' \'unsafe-inline\'; connect-src \'self\' https://api.holysheep.ai; img-src \'self\' data:; frame-ancestors \'none\'; base-uri \'self\';');
header('X-Content-Type-Options: nosniff');
header('X-Frame-Options: DENY');
header('X-XSS-Protection: 1; mode=block');
header('Referrer-Policy: strict-origin-when-cross-origin');
// HolySheep AI API 호출
$apiKey = 'YOUR_HOLYSHEEP_API_KEY';
$endpoint = 'https://api.holysheep.ai/v1/chat/completions';
$payload = [
'model' => 'gpt-4.1',
'messages' => [
['role' => 'system', 'content' => '당신은 유용한 AI 어시스턴트입니다.'],
['role' => 'user', 'content' => $_POST['user_message'] ?? '안녕하세요']
],
'temperature' => 0.7,
'max_tokens' => 1000
];
$ch = curl_init($endpoint);
curl_setopt_array($ch, [
CURLOPT_POST => true,
CURLOPT_POSTFIELDS => json_encode($payload),
CURLOPT_HTTPHEADER => [
'Content-Type: application/json',
'Authorization: Bearer ' . $apiKey
],
CURLOPT_RETURNTRANSFER => true,
CURLOPT_TIMEOUT => 30,
CURLOPT_SSL_VERIFYPEER => true
]);
$response = curl_exec($ch);
$httpCode = curl_getinfo($ch, CURLINFO_HTTP_CODE);
curl_close($ch);
if ($httpCode === 200) {
$data = json_decode($response, true);
echo json_encode(['success' => true, 'reply' => $data['choices'][0]['message']['content']]);
} else {
http_response_code($httpCode);
echo json_encode(['error' => 'AI 서비스 오류 발생']);
}
?>
위 PHP 코드는 HolySheep AI의 채팅 API를 호출하는 기본 구조입니다. CSP 헤더는 모든 응답에 적용되어, 악성 스크립트가 동적으로 삽입되는 것을 방지합니다. 실제 프로덕션에서는 사용자의 입력값을 그대로 모델에 전달하지 않고, 입력 검증 로직을 반드시 추가해야 합니다.
Streaming 응답과 WebSocket 환경에서의 CSP
AI 서비스에서 Streaming 응답은 사용자 경험을 크게 향상시키지만, CSP 설정이 복잡해집니다. Server-Sent Events(SSE)와 WebSocket 모두 동적인 데이터 흐름을 허용해야 하기 때문입니다.
<!-- AI Streaming 채팅 HTML 페이지 -->
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Content-Security-Policy" content="
default-src 'none';
script-src 'self' 'unsafe-inline';
style-src 'self' 'unsafe-inline';
connect-src 'self' https://api.holysheep.ai;
img-src 'self' data:;
font-src 'self';
frame-ancestors 'none';
base-uri 'self';
worker-src 'self';
">
<title>AI 챗봇 - HolySheep AI 연동</title>
<style>
body { font-family: system-ui, sans-serif; max-width: 800px; margin: 0 auto; padding: 20px; }
#chat-container { border: 1px solid #ddd; border-radius: 8px; height: 500px; overflow-y: auto; padding: 16px; }
.message { margin: 8px 0; padding: 12px; border-radius: 8px; }
.user { background: #e3f2fd; text-align: right; }
.assistant { background: #f5f5f5; }
#typing { display: none; color: #666; font-style: italic; }
.error { background: #ffebee; color: #c62828; }
</style>
</head>
<body>
<h1>HolySheep AI 챗봇</h1>
<div id="chat-container"></div>
<div id="typing">AI가 입력 중...</div>
<div style="margin-top: 16px;">
<textarea id="user-input" rows="3" style="width: 100%; padding: 12px;" placeholder="메시지를 입력하세요..."></textarea>
<button onclick="sendMessage()" style="margin-top: 8px; padding: 12px 24px; background: #4CAF50; color: white; border: none; border-radius: 4px; cursor: pointer;">전송</button>
</div>
<script>
const API_KEY = 'YOUR_HOLYSHEEP_API_KEY';
const API_URL = 'https://api.holysheep.ai/v1/chat/completions';
// XSS 방지: HTML 이스케이프 함수
function escapeHtml(text) {
const div = document.createElement('div');
div.textContent = text;
return div.innerHTML;
}
// 메시지 Sanitization
function sanitizeMessage(message) {
return message
.replace(/<script>/gi, '<script>')
.replace(/javascript:/gi, '')
.replace(/on\w+=/gi, '')
.substring(0, 4000); // 최대 길이 제한
}
async function sendMessage() {
const input = document.getElementById('user-input');
const message = sanitizeMessage(input.value.trim());
if (!message) return;
const container = document.getElementById('chat-container');
const typing = document.getElementById('typing');
// 사용자 메시지 추가
container.innerHTML += <div class="message user"><strong>사용자:</strong> ${escapeHtml(message)}</div>;
input.value = '';
typing.style.display = 'block';
container.scrollTop = container.scrollHeight;
try {
const response = await fetch(API_URL, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Authorization': Bearer ${API_KEY}
},
body: JSON.stringify({
model: 'gpt-4.1',
messages: [{ role: 'user', content: message }],
stream: true
})
});
if (!response.ok) {
throw new Error(HTTP ${response.status});
}
typing.style.display = 'none';
const assistantDiv = document.createElement('div');
assistantDiv.className = 'message assistant';
assistantDiv.innerHTML = '<strong>AI:</strong> ';
container.appendChild(assistantDiv);
const reader = response.body.getReader();
const decoder = new TextDecoder();
let fullResponse = '';
while (true) {
const { done, value } = await reader.read();
if (done) break;
const chunk = decoder.decode(value);
const lines = chunk.split('\n');
for (const line of lines) {
if (line.startsWith('data: ')) {
const data = line.slice(6);
if (data === '[DONE]') continue;
try {
const parsed = JSON.parse(data);
const content = parsed.choices?.[0]?.delta?.content || '';
if (content) {
fullResponse += content;
assistantDiv.innerHTML = '<strong>AI:</strong> ' + escapeHtml(fullResponse);
container.scrollTop = container.scrollHeight;
}
} catch (e) {
// JSON 파싱 실패는 무시 (불완전한 청크)
}
}
}
}
} catch (error) {
typing.style.display = 'none';
container.innerHTML += <div class="message error">오류 발생: ${escapeHtml(error.message)}</div>;
}
container.scrollTop = container.scrollHeight;
}
</script>
</body>
</html>
Streaming 환경에서 가장 중요한 포인트는 escapeHtml() 함수를 통해 AI 응답을 항상 이스케이프 처리하는 것입니다. AI 모델은 때로는 HTML이나 JavaScript 코드 스니펫을 응답에 포함할 수 있는데, 이를 직접 innerHTML에 삽입하면 XSS 취약점이 발생할 수 있습니다. 위 코드에서는 텍스트 컨텐츠로 안전하게 렌더링하되, 실제 코드 하이라이팅이 필요하다면 별도의 DOMPurify 라이브러리를 활용하는 것을 권장합니다.
프록시 서버를 통한 CSP 우회 방지
직접 API 키를 클라이언트에 노출하는 것은 극도로 위험합니다. HolySheep AI의 요금제를 활용하더라도, 반드시 백엔드 프록시를 통해 API 호출을 중계해야 합니다. 이를 통해 API 키를 보호하고 CSP 정책을 완전히 제어할 수 있습니다.
# Node.js Express 프록시 서버 + 강화된 CSP
const express = require('express');
const helmet = require('helmet');
const rateLimit = require('express-rate-limit');
const app = express();
// Helmet을 통한 강화된 보안 헤더 설정
app.use(helmet({
contentSecurityPolicy: {
directives: {
defaultSrc: ["'none'"],
scriptSrc: ["'self'"],
styleSrc: ["'self'", "'unsafe-inline'"],
connectSrc: ["'self'", "https://api.holysheep.ai"],
imgSrc: ["'self'", "data:"],
fontSrc: ["'self'"],
frameAncestors: ["'none'"],
baseUri: ["'self'"],
formAction: ["'self'"],
objectSrc: ["'none'"]
}
},
crossOriginEmbedderPolicy: false
}));
// Rate Limiting - 과도한 API 호출 방지 (비용 최적화)
const apiLimiter = rateLimit({
windowMs: 60 * 1000, // 1분
max: 30, // 분당 30회 요청
message: { error: '요청 제한 초과. 잠시 후 다시 시도하세요.' },
standardHeaders: true,
legacyHeaders: false
});
// 요청 본문 파싱
app.use(express.json({ limit: '10kb' }));
// AI 프록시 엔드포인트
app.post('/api/chat', apiLimiter, async (req, res) => {
const { message, sessionId } = req.body;
// 입력 검증
if (!message || typeof message !== 'string' || message.length > 4000) {
return res.status(400).json({ error: '잘못된 입력입니다.' });
}
// 세션별 비용 추적
const sessionCost = costTracker.get(sessionId) || 0;
if (sessionCost > 5.00) { // 세션당 $5 제한
return res.status(429).json({ error: '세션 비용 제한 초과' });
}
try {
const startTime = Date.now();
const response = await fetch('https://api.holysheep.ai/v1/chat/completions', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Authorization': Bearer ${process.env.HOLYSHEEP_API_KEY}
},
body: JSON.stringify({
model: 'gpt-4.1',
messages: [
{ role: 'system', content: '한국어로만 답변하세요.' },
{ role: 'user', content: message }
],
max_tokens: 1000,
temperature: 0.7
})
});
const latency = Date.now() - startTime;
if (!response.ok) {
throw new Error(HolySheep AI 오류: ${response.status});
}
const data = await response.json();
// 토큰 사용량 기반 비용 계산
const inputTokens = data.usage?.prompt_tokens || 0;
const outputTokens = data.usage?.completion_tokens || 0;
const cost = (inputTokens * 8 + outputTokens * 8) / 1_000_000; // GPT-4.1: $8/MTok
costTracker.set(sessionId, sessionCost + cost);
// CSP 안전을 위한 응답 필터링
const safeResponse = {
reply: data.choices[0].message.content,
tokens: { input: inputTokens, output: outputTokens },
latency_ms: latency,
cost_usd: cost.toFixed(6)
};
res.json(safeResponse);
} catch (error) {
console.error('AI API 오류:', error);
res.status(500).json({ error: 'AI 서비스 일시적 오류' });
}
});
const costTracker = new Map();
app.listen(3000, () => {
console.log('보안 강화 AI 프록시 서버 실행 중: http://localhost:3000');
});
위 Node.js 서버는 HolySheep AI API를 안전하게 프록시하는 백엔드를 구현합니다. 주요 보안 포인트는 세 가지입니다. 첫째, Helmet 미들웨어를 통해 CSP 헤더를 자동으로 설정합니다. 둘째, Rate Limiting으로 분당 30회 요청 제한을 두어 과도한 비용 발생을 방지합니다. 셋째, 세션별 비용 추적을 통해 개별 사용자의 지출을 관리합니다.
성능 최적화와 CSP 캐싱
CSP 헤더는 동적 웹 애플리케이션에서 성능 병목이 될 수 있습니다. 동일한 CSP 정책을 매 요청마다 생성하는 것은 비효율적입니다. Redis나 메모리 캐시를 활용하여 CSP 헤더를 캐싱하면, 응답 시간을 약 15~20% 개선할 수 있습니다.
# Varnish Cache용 CSP VCL 설정 (CDN 레벨 캐싱)
vcl 4.1;
sub vcl_backend_response {
# AI API 응답은 캐싱하지 않음
if (bereq.url ~ "^/v1/chat") {
set beresp.do_stream = true;
set beresp.uncacheable = true;
return (deliver);
}
# 정적 리소스의 CSP 헤더 설정
if (bereq.url ~ "\.(js|css|html)$") {
set beresp.http.Content-Security-Policy =
"default-src 'none'; " +
"script-src 'self'; " +
"style-src 'self' 'unsafe-inline'; " +
"img-src 'self' data:; " +
"font-src 'self'; " +
"connect-src https://api.holysheep.ai; " +
"frame-ancestors 'none'";
set beresp.ttl = 1h;
}
# HTML 페이지의 CSP (nonce 포함)
if (bereq.url ~ "\.html$") {
set beresp.http.Content-Security-Policy =
"default-src 'none'; " +
"script-src 'self' 'nonce-' + req.http.X-CSP-Nonce + '''; " +
"style-src 'self' 'unsafe-inline'; " +
"connect-src 'self' https://api.holysheep.ai; " +
"frame-ancestors 'none'";
}
}
sub vcl_deliver {
# CSP 보고서 수집 엔드포인트로-violations 전송
if (resp.http.Content-Security-Policy-Report-Only) {
set resp.http.OWA-CSP-Report-URI = "/csp-report";
}
}
실제 프로덕션 환경에서 Varnish를 활용한 CDN 레벨 CSP 설정은 엣지 서버에서 직접 보안 정책을 적용할 수 있어, 백엔드 부하를 크게 줄여줍니다. HolySheep AI API를 호출하는 클라이언트 페이지의 경우, 정적 리소스는 1시간 캐싱하면서도 최신 CSP 정책을 유지할 수 있습니다.
모니터링과 비용 추적
AI API 보안에서 가장 중요한 부분 중 하나는 API 호출 패턴을 모니터링하고 비용을 추적하는 것입니다. HolySheep AI는 투명한 가격 정책을 제공하므로, 이를 활용하여 예상치 못한 비용 발생을 방지할 수 있습니다.
# Prometheus + Grafana 기반 AI API 모니터링 설정
groups:
- name: ai_api_metrics
rules:
- alert: HighTokenUsage
expr: holysheep_api_tokens_total{type="output"} > 10000000
for: 5m
labels:
severity: warning
annotations:
summary: "AI 토큰 사용량 경고"
description: "현재 {{ $value }} 토큰 소비 중. 비용 최적화 필요."
- alert: HighAPICost
expr: holysheep_api_cost_usd > 100
for: 1h
labels:
severity: critical
annotations:
summary: "AI API 비용 초과 경고"
description: "시간당 ${{ $value }} 발생. 즉시 확인 필요."
- alert: CSPViolationDetected
expr: rate(csp_violations_total[5m]) > 10
for: 2m
labels:
severity: high
annotations:
summary: "CSP 위반 다수 감지"
description: "분당 {{ $value }}건의 CSP 위반 시도가 감지되었습니다."
위 Prometheus 규칙은 AI API 사용량과 CSP 위반을 실시간으로 모니터링합니다. HolySheep AI의 가격표(GPT-4.1 $8/MTok, DeepSeek V3.2 $0.42/MTok)를 고려하면, Claude Sonnet 4.5($15/MTok) 대비 DeepSeek을 활용한 단순 조회 작업은 비용을 약 97% 절감할 수 있습니다.
자주 발생하는 오류와 해결책
1. CSP로 인한 API 연결 차단
# 오류 증상
Refused to connect to 'https://api.holysheep.ai/v1/chat/completions'
because it violates the Content-Security-Policy directive "connect-src"
❌ 잘못된 설정
add_header Content-Security-Policy "default-src 'self'; connect-src 'self'";
✅ 올바른 설정
add_header Content-Security-Policy "default-src 'none'; connect-src 'self' https://api.holysheep.ai";
✅ 복수 도메인 허용 (여러 AI 서비스 사용 시)
add_header Content-Security-Policy "default-src 'none'; connect-src 'self' https://api.holysheep.ai https://api.anthropic.com";
가장 빈번한 오류는 CSP의 connect-src 지시문에 HolySheep AI 엔드포인트를 포함하지 않아 발생하는 연결 차단입니다. 특히 default-src 'self'만 설정하면 외부 API 호출이 모두 차단됩니다. 반드시 https://api.holysheep.ai을 명시적으로 추가해야 합니다.
2. Streaming 응답의 CORS 오류
# 오류 증상
Access to fetch at 'https://api.holysheep.ai/v1/chat/completions' from origin
'https://your-domain.com' has been blocked by CORS policy
✅ 백엔드 프록시 사용 (권장)
프론트엔드는 내부 API 호출
const response = await fetch('/api/ai-proxy', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ prompt: userInput })
});
// 백엔드에서 HolySheep AI 호출
const holySheepResponse = await fetch('https://api.holysheep.ai/v1/chat/completions', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Authorization': Bearer ${process.env.HOLYSHEEP_API_KEY}
},
body: JSON.stringify({ model: 'gpt-4.1', messages: [{ role: 'user', content: prompt }] })
});
Streaming 응답에서 CORS 오류가 발생하는 것은 HolySheep AI 서버가 브라우저의 Origin 헤더를 허용하지 않기 때문입니다. 가장 안전한 해결책은 프론트엔드가 직접 HolySheep AI에 연결하지 않고, 자체 백엔드 프록시를 통해 중계하는 것입니다. 이렇게 하면 API 키도 보호되고 CSP 정책도 완전히 제어할 수 있습니다.
3. AI 응답의 악성 코드 삽입
# 오류 증상
XSS Auditor: Audit Lighthouse CSPViolation blocked script injection
AI 응답 원본 (악성 코드 포함 가능)
const maliciousResponse = "답변: <img src=x onerror=alert('XSS')>";
❌ 위험한 렌더링
element.innerHTML = maliciousResponse; // XSS 취약점!
✅ 안전한 렌더링
element.textContent = maliciousResponse; // 자동 이스케이프
// 또는 DOMPurify 사용
element.innerHTML = DOMPurify.sanitize(maliciousResponse, {
ALLOWED_TAGS: ['b', 'i', 'em', 'strong', 'code', 'pre'],
ALLOWED_ATTR: []
});
AI 모델은 의도치 않게 악성 스크립트를 응답에 포함할 수 있습니다. 특히 사용자의 입력을 재요청하거나 프롬프트 인젝션 공격이 성공할 경우, AI 응답에 스크립트 태그나 이벤트 핸들러가 포함될 수 있습니다. 반드시 textContent 또는 DOMPurify 같은 라이브러리로 응답을 정화한 후 렌더링해야 합니다.
4. CSP nonce 생성 불일치
# 오류 증상
Refused to execute inline script because it violates CSP directive
"script-src 'nonce-abc123'"
❌ nonce 미생성 또는 불일치
<script nonce="different-nonce"> // CSP의 nonce와 불일치
// 스크립트 실행 차단
</script>
✅ 올바른 nonce 생성 및 주입
// 서버사이드 (Node.js Express)
const crypto = require('crypto');
const nonce = crypto.randomBytes(16).toString('base64');
app.use((req, res, next) => {
res.locals.nonce = nonce;
res.setHeader('Content-Security-Policy',
script-src 'self' 'nonce-${nonce}');
next();
});
// EJS 템플릿
<script nonce="<%= nonce %>">
// 이제 정상 실행됨
console.log('CSP nonce 인증 성공');
</script>
인라인 스크립트에 CSP nonce를 사용할 때, 서버에서 생성한 nonce와 HTML에 삽입된 nonce가 반드시 일치해야 합니다. nonce 기반 CSP는 'unsafe-inline' 없이도 인라인 스크립트를 허용하면서도,nonce가 일치하지 않는 스크립트의 실행을 차단하여 보안을 강화합니다.
5. Worker/WebSocket의 CSP 오류
# 오류 증상
Refused to create a worker from 'blob:...' because it violates
CSP directive "worker-src 'self'"
❌ Worker 생성 차단
const worker = new Worker('/static/ai-worker.js');
✅ CSP worker-src 지시문 추가
CSP 헤더에 worker-src 추가
add_header Content-Security-Policy "... worker-src 'self' blob:;";
또는 Web Worker를 인라인로 생성
const workerCode = `
self.onmessage = async (e) => {
const response = await fetch('https://api.holysheep.ai/v1/models');
const data = await response.json();
self.postMessage(data);
}
`;
const blob = new Blob([workerCode], { type: 'application/javascript' });
const worker = new Worker(URL.createObjectURL(blob));
Web Worker나 SharedWorker를 사용하는 AI 서비스에서 CSP가 Worker 생성을 차단하는 경우가 있습니다. worker-src 지시문을 CSP에 명시하거나, Blob URL을 활용하여 인라인 Worker를 생성하는 방법来解决할 수 있습니다. HolySheep AI API의 모델 목록 조회 등 Worker 기반 백그라운드 처리가 필요한 경우 이 설정이 필수적입니다.
프로덕션 배포 체크리스트
- CSP Report-Only 모드 테스트: 프로덕션 배포 전
Content-Security-Policy-Report-Only헤더로 CSP 위반을 모니터링 - API 키 환경변수 관리: HolySheep AI API 키는 반드시 서버사이드에만 저장, 클라이언트에 노출 금지
- Rate Limiting 설정: 분당 요청 수 제한으로 비용 초과 및 DoS 공격 방지
- 입력 검증: 사용자의 모든 입력값 서버사이드에서 검증 후 AI API 전달
- 토큰 사용량 알림: HolySheep AI 대시보드 또는 Prometheus 기반으로 월간 $100 이상 알림 설정
- 정기 보안 감사: 분기별 CSP 정책 검토 및 업데이트
AI 서비스 보안은 일회성 설정이 아닌 지속적인 관리와 최적화가 필요한 영역입니다. HolySheep AI는 투명한 가격体系和 다양한 모델 지원을 통해 개발자가 보안에 집중할 수 있는 환경을 제공합니다. 위에서 설명한 CSP 설정과 백엔드 프록시架构를 따르면, 안전하면서도 비용 효율적인 AI 서비스를 구축할 수 있습니다.
AI API 보안과 성능 최적화에 대해 더 자세한 내용은 HolySheep AI 공식 문서를 참조하세요. HolySheep AI는 전 세계 개발자들이 해외 신용카드 없이도 간편하게 결제할 수 있는 로컬 결제 옵션을 제공하며, DeepSeek V3.2($0.42/MTok)와 같은 비용 효율적인 모델부터 GPT-4.1($8/MTok)까지 다양한 선택지를 제공합니다.
👉 HolySheep AI 가입하고 무료 크레딧 받기