Lovable API Key 추가 위치와 안전한 보관 방법

Lovable에서 Lovable API Key는 Secrets에 넣습니다. 프로젝트 도구 모음에서 More → Settings → Secrets를 열거나, 프로젝트 채팅에 뜨는 Add secret 양식을 씁니다. 백엔드 코드가 이곳에서 키를 읽기 때문에 키가 브라우저까지 가지 않습니다. 채팅 메시지에 붙이거나 프론트엔드 코드에 적으면 그대로 노출됩니다.

짧은 답

• 내 키(GPT, Claude, Resend): Secrets 또는 커넥터가 보여 주는 양식.
• Lovable 자체 키: LOVABLE_API_KEY는 자동으로 생성됩니다. 워크스페이스 키(lov_…)는 Business 또는 Enterprise 플랜이 필요합니다.
• GPT·Claude·DeepSeek를 내 키로: 백엔드 함수를 Lovable에 만들게 합니다. 내장 AI 커넥터는 내 키를 쓸 수 없습니다.
• 키가 유출됐다면: 먼저 제공사에서 폐기하고, 그다음 Secrets 값을 바꿉니다.

어떤 Lovable API Key가 필요할까

Lovable API Key라는 말은 서로 다른 네 가지를 가리킵니다.

워크스페이스 키는 Lovable API에만 보내며 Lovable-API-Key 헤더에 넣습니다. 값은 한 번만 표시됩니다(API 키 문서, 2026년 11월 2일 확인). 이 키는 프로젝트를 관리하고 배포하며, AI 모델을 호출하거나 앱을 만들지는 않습니다(Lovable API). 프로젝트의 LOVABLE_API_KEY와는 다른 키입니다(AI 문서).

아래 내용은 첫 줄, 즉 내 키에 대한 설명입니다.

Lovable에서 API 키를 추가하는 곳

1. Lovable가 먼저 요청할 때입니다. 기능에 키가 필요하면 프로젝트 채팅에 Add secret 양식이 열립니다. 값을 양식에 입력합니다. 채팅 메시지로 보내면 기록에 남지만, 양식은 프로젝트 Secrets에 바로 저장합니다(Lovable 커스텀 API 문서, 2026년 11월 2일 확인).
2. 직접 추가할 때입니다. 프로젝트 도구 모음에서 More → Settings → Secrets를 열고 Add secret을 누른 뒤 이름과 값의 쌍을 하나 이상 입력합니다(Secrets 문서).

Lovable의 2026년 8월 26일 변경 로그는 이 경로를 More → Cloud → Secrets로 적고 있습니다. 메뉴가 다르면 그쪽을 확인합니다(변경 로그).

자주 걸리는 규칙입니다:

• 쓰기 전용입니다. 값을 바꾸거나 지울 수 있지만 다시 읽을 수는 없습니다.
• VITE_로 시작하는 이름은 거부됩니다. 빌드할 때 앱에 들어가 브라우저에서 보이는 값이라 .env에 둡니다.
• SUPABASE_와 LOVABLE_로 시작하는 이름은 예약되어 있고 시스템이 채워 줍니다.
• Secrets는 프로젝트 하나에 속합니다. remix 뒤에는 내 키를 다시 넣어야 합니다. Lovable가 만든 키만 자동으로 다시 만들어집니다.

내 Supabase 프로젝트에서는 백엔드 화면에 Manage secrets 버튼이 있고, 누르면 Supabase 대시보드가 열립니다. 키는 Edge Function Secrets에 저장됩니다(Supabase secrets, 2026년 11월 2일 확인). Supabase 프로젝트 하나를 Lovable 프로젝트 두 개가 함께 쓰면 Secrets를 서로 덮어씁니다. LOVABLE_API_KEY도 마찬가지입니다(Supabase 연동).

Resend, Stripe, Google Maps 키는 어디에 넣을까

모든 키가 Secrets로 바로 들어가지는 않습니다. 다음 서비스에는 커넥터 양식이 있습니다(Stripe, Resend, 커스텀 API, 2026년 11월 2일 확인).

Google Maps는 예외입니다. 브라우저 키는 원래 공개되어 VITE_LOVABLE_CONNECTOR_GOOGLE_MAPS_BROWSER_KEY로 프론트엔드에 들어갑니다. 다른 사이트가 다시 쓰지 못하게 막는 것은 웹사이트 제한입니다(Google Maps, 2026년 11월 2일 확인). 서버 키는 비공개로 남습니다. 커넥터 자격 증명은 암호화해 저장하며 Lovable도 다시 읽을 수 없습니다(연동 보안).

내 키로 GPT·Claude·DeepSeek 연결하기

먼저 키가 필요한지 확인합니다. 내장 AI 커넥터에는 키가 필요 없습니다. Lovable는 프로젝트마다 LOVABLE_API_KEY를 만들고 기본으로 GPT-6 Astra를 돌립니다. Claude 채팅 모델은 2026년 5월 13일 이후에 만든 새 TanStack Start 앱에서만 쓸 수 있습니다(AI 문서, AI chat, 2026년 11월 2일 확인).

이 커넥터는 내 키를 쓸 수 없습니다. 항상 Lovable를 거치고 워크스페이스 크레딧을 씁니다. 2026년 11월 2일 기준 Lovable 문서에는 DeepSeek 언급이 없습니다. 내 키를 쓰려면 백엔드 함수가 제공사를 직접 호출하게 만들고 키는 Secrets에 둡니다.

함수를 만드는 버튼은 없습니다. 프로젝트 채팅에 함수를 설명하면 Lovable가 코드를 쓰고 배포합니다(Edge functions). 2026년 5월 13일 이후에 만든 TanStack Start 앱(Enterprise는 6월 22일 이후)은 server function을 받고, 그보다 오래된 React + Vite 앱은 Edge Function을 받습니다. 둘 다 서버에서 도는 코드입니다.

아래 코드는 OmniaKey의 OpenAI 호환 API를 씁니다. 키 하나로 GPT-6.1 Terra, Claude Sonnet 5.5, DeepSeek을 호출합니다.

1. 제공사에서 키를 만듭니다. OmniaKey라면 omniakey.com에서 가입한 뒤 Dashboard → tokens를 엽니다(빠른 시작).

2. 다음 프롬프트를 프로젝트 채팅에 붙입니다:

   text

   Add an AI chat feature that uses my own API key, not the built-in AI connector.
   Create a backend function named "chat". It reads OMNIAKEY_API_KEY from Secrets and calls
   POST https://api.omniakey.com/v1/chat/completions with the model and messages the frontend sends.
   Only allow these models: gpt-6.1-terra, claude-sonnet-5-5, deepseek-flash.
   Require a signed-in user. Never put the key in frontend code.
   Ask me for the key with the Add secret form.
   

3. Add secret 양식에 키를 넣고 이름을 OMNIAKEY_API_KEY로 정합니다.

저희는 Lovable 계정이 없어 이 프롬프트를 Lovable에서 실행하지 않았습니다. Lovable 단계는 공식 문서를 따랐습니다. 함수는 아래와 같은 모습이 되고, 이 코드는 직접 머신에서 돌린 사본입니다.

// supabase/functions/chat/index.ts
// 브라우저는 { model, messages }를 보내고, 이 함수가 서버에서 API 키를 붙입니다.
const corsHeaders = {
  "Access-Control-Allow-Origin": "*",
  "Access-Control-Allow-Headers": "authorization, x-client-info, apikey, content-type",
};

const ALLOWED_MODELS = ["gpt-6.1-terra", "claude-sonnet-5-5", "deepseek-flash"];

function json(body: unknown, status = 200) {
  return new Response(JSON.stringify(body), {
    status,
    headers: { ...corsHeaders, "Content-Type": "application/json" },
  });
}

Deno.serve(async (req) => {
  if (req.method === "OPTIONS") {
    return new Response("ok", { headers: corsHeaders });
  }

  const apiKey = Deno.env.get("OMNIAKEY_API_KEY");
  if (!apiKey) {
    return json({ error: "OMNIAKEY_API_KEY is not set" }, 500);
  }

  const { model, messages } = await req.json();
  if (!ALLOWED_MODELS.includes(model)) {
    return json({ error: `model must be one of: ${ALLOWED_MODELS.join(", ")}` }, 400);
  }

  const upstream = await fetch("https://api.omniakey.com/v1/chat/completions", {
    method: "POST",
    headers: {
      Authorization: `Bearer ${apiKey}`,
      "Content-Type": "application/json",
    },
    body: JSON.stringify({ model, messages, max_tokens: 800 }),
  });

  const data = await upstream.json();
  if (!upstream.ok) {
    return json({ error: data.error?.message ?? "upstream error" }, upstream.status);
  }
  return json({ reply: data.choices[0].message.content, model: data.model, usage: data.usage });
});

테스트용 코드는 스크립트에서 호출하려고 로그인 확인을 뺐습니다. 위 프롬프트는 Lovable에 그 확인을 추가하라고 요청합니다. Lovable의 보안 모범 사례는 인증 판단을 서버에서 하라고 안내합니다(best practices).

브라우저에서는 이렇게 호출합니다(supabase-js):

const { data, error } = await supabase.functions.invoke("chat", {
  body: { model: "deepseek-flash", messages: [{ role: "user", content: "Say hello in five words." }] },
});

다른 제공사를 쓸 때는 URL과 모델 ID를 그 문서의 값으로 바꿉니다. OmniaKey 키는 Cline의 커스텀 API 키와 Factory Droid의 커스텀 모델에도 쓸 수 있습니다.

직접 돌려 본 결과

2026년 11월 2일 Deno 2.9.8로 제 머신에서 이 함수를 돌렸습니다. 호출 방식은 브라우저와 같게 맞췄습니다. Origin 헤더를 넣고 CORS 프리플라이트도 보냈습니다.

모델마다 한 번씩만 호출했으니 각각 표본 하나입니다. deepseek-flash 응답의 모델 이름은 deepseek-v4-1-flash-261017이었습니다.

"non-2xx status code"만 보이는 이유

오류가 나면 supabase.functions.invoke는 Edge Function returned a non-2xx status code 한 줄만 돌려주고 data는 null입니다. 함수의 실제 메시지는 await error.context.json()에 있습니다:

if (error) {
  const details = await error.context.json();
  console.error(details.error);
}

• 401: 키가 틀렸습니다. 저희 환경에서는 Invalid token (request id: …)였습니다.
• 500과 OMNIAKEY_API_KEY is not set: 시크릿이 없거나 이름이 다릅니다.
• 400: 모델이 허용 목록에 없습니다.

키가 노출됐는지 확인하는 방법

프론트엔드 코드에 있는 키는 사용자에게 보이므로 유출된 것으로 봅니다(best practices, 2026년 11월 2일 확인).

• Quick security scan은 배포할 때마다 자동으로 돕니다.
• Deep security scan은 자동으로 돌지 않습니다. 프로젝트의 Security view에서 직접 시작합니다(Security view).
• Leaked secrets & credentials 그룹을 봅니다.
• 두 스캔 모두 무료입니다. 일괄 수정만 무료 10회를 먼저 쓰고 그다음 크레딧을 씁니다(security scans).

직접 확인하려면 Chrome에서 배포한 앱의 개발자 도구를 열고 Mac은 Command+Option+F, Windows와 Linux는 Control+Shift+F를 눌러 불러온 파일에서 키 앞 몇 글자를 검색합니다. VITE_ 값에 개인 키가 들어 있으면 조치가 필요합니다. 그 값은 브라우저용으로 빌드되기 때문입니다(DevTools search). 검색이 깨끗해도 그 페이지가 불러온 파일만 본 것이므로 스캔도 함께 돌립니다.

키를 숨겨도 다른 사람이 함수를 호출하는 일은 막지 못합니다. 로그인 확인이 없는 함수는 누구나 호출할 수 있고, 호출할 때마다 내 키가 쓰입니다. Lovable 문서는 서버에서 로그인을 확인하라고 안내합니다. 저희 허용 목록과 max_tokens: 800은 호출 한 번의 범위를 제한합니다. OmniaKey 문서는 환경마다 키를 따로 만들고 지출 한도를 두라고 권합니다(OmniaKey API 문서).

키가 유출됐을 때 할 일

1. 발급한 서비스에서 폐기하고 새로 만듭니다. Lovable 문서가 Rotate를 제공하는 것은 Lovable 자체 키뿐입니다(Secrets 문서).
2. Secrets, 커넥터 양식, Supabase 중 해당하는 곳에서 값을 바꿉니다. Supabase에서는 다시 배포하지 않아도 함수가 새 시크릿을 바로 읽습니다(Supabase secrets). Lovable의 내장 백엔드 Cloud가 같은 방식인지는 문서에 없으므로 함수를 한 번 호출해 확인합니다.
3. 키를 프론트엔드 코드와 .env에서 빼고 Deep security scan을 다시 돌립니다.
4. 제공사 사용량 페이지에서 내가 보내지 않은 호출이 있는지 봅니다.

Lovable 자체 키는 방식이 다릅니다. LOVABLE_API_KEY에는 Rotate가 있고 editor 이상이 쓸 수 있습니다. 새 키를 발급하고 Edge Function 환경을 갱신합니다. GitHub secret scanning이 알린 워크스페이스 키(lov_…)는 자동으로 폐기됩니다. 다른 곳에 있는 키는 직접 폐기합니다(API 키 문서).

비용 구조

Lovable 청구서와 제공사 청구서는 따로 나옵니다. 내 키를 쓰면 모델 사용료는 제공사가 청구하고, 앱은 함수를 돌리는 데 Cloud만 씁니다(AI 문서, Cloud, 2026년 11월 2일 확인).

내장 AI 커넥터는 워크스페이스 크레딧을 씁니다. Free, Pro, Business에는 매달 4-credit AI 한도가 있고, 다 쓰면 402, 속도 제한을 넘으면 429가 돌아옵니다. Free 플랜은 하루 5 build credits, 한 달 최대 30, 여기에 20 Cloud credits를 더 줍니다(가격 페이지). Lovable 플랜 표에서 Pro는 월 $25에 100 credits입니다(구독 플랜, 2026년 11월 2일 확인).

OmniaKey의 현재 요금은 GPT-6.1 Terra, Claude Sonnet 5.5, DeepSeek 페이지에서 확인합니다.

자주 묻는 질문

Lovable API 키는 어디에서 찾나요?

어떤 키를 말하는지에 따라 다릅니다. LOVABLE_API_KEY는 프로젝트마다 생성되어 그 프로젝트의 Secrets에 있습니다. Rotate는 할 수 있지만 값을 다시 읽지는 못합니다. 워크스페이스 키는 Workspace settings → API keys & OAuth → Workspace access tokens에서 발급하고 한 번만 표시됩니다.

무료 Lovable API Key가 있나요?

가장 가까운 것은 LOVABLE_API_KEY입니다. 내장 AI 커넥터가 프로젝트마다 만들고, Free, Pro, Business 워크스페이스에는 매달 4-credit AI 한도가 있습니다. 워크스페이스 키는 Business 또는 Enterprise 플랜이 필요합니다.

내 OpenAI 키를 Lovable AI에 쓸 수 있나요?

내장 AI 커넥터로는 쓸 수 없습니다. 항상 Lovable를 거치고 워크스페이스 크레딧을 씁니다. 내 키를 쓰려면 제공사를 직접 호출하는 백엔드 함수를 Lovable에 만들게 하고 키는 Secrets에 둡니다.

API 키는 Secrets와 .env 중 어디에 넣나요?

비공개 키를 백엔드 코드가 읽는다면 Secrets입니다. .env는 VITE_로 시작하는 값의 자리이고, 이런 값은 앱에 빌드되어 브라우저에서 보입니다.

Lovable가 GPT·Claude·DeepSeek에 연결되지 않는 이유는 무엇인가요?

먼저 함수가 돌려준 메시지를 읽습니다. 원인이 그 안에 있습니다:

• 500과 OMNIAKEY_API_KEY is not set: 시크릿이 없거나 다른 이름으로 저장되어 있습니다.
• 401: 키가 틀렸거나 폐기되었습니다.
• 400: 모델 ID가 허용 목록에 없습니다.
• 404: 베이스 URL이 틀렸습니다. 저희 주소는 /v1/chat/completions에서 끝납니다. 설정 오류는 대부분 프로토콜 접미사를 잘못 적어서 생깁니다(OmniaKey 오류 문서).

브라우저에는 Edge Function returned a non-2xx status code만 보입니다. 위 코드처럼 error.context를 출력하면 어느 경우인지 알 수 있습니다.

확인한 자료

• Lovable Secrets 문서, 2026년 11월 2일 확인
• Lovable API 키, 2026년 11월 2일 확인
• Lovable API, 2026년 11월 2일 확인
• Lovable MCP 서버, 2026년 11월 2일 확인
• Build with URL, 2026년 11월 2일 확인
• Lovable AI 기능, 2026년 11월 2일 확인
• Lovable AI 채팅, 2026년 11월 2일 확인
• Lovable Edge functions, 2026년 11월 2일 확인
• Lovable Cloud, 2026년 11월 2일 확인
• 커스텀 API와 커넥터, 2026년 11월 2일 확인
• Stripe 연동, 2026년 11월 2일 확인
• Resend 연동, 2026년 11월 2일 확인
• Google Maps 연동, 2026년 11월 2일 확인
• 연동 보안, 2026년 11월 2일 확인
• Supabase 연동, 2026년 11월 2일 확인
• Lovable 보안, 2026년 11월 2일 확인
• Lovable Security view, 2026년 11월 2일 확인
• Lovable 보안 모범 사례, 2026년 11월 2일 확인
• Lovable 구독 플랜, 2026년 11월 2일 확인
• Lovable 변경 로그, 2026년 11월 2일 확인
• Lovable 가격 페이지, 2026년 11월 2일 확인
• Supabase Edge Function secrets, 2026년 11월 2일 확인
• Supabase functions.invoke, 2026년 11월 2일 확인
• Chrome DevTools 검색, 2026년 11월 2일 확인

OmniaKey 자체 문서, 2026년 11월 2일 확인: 빠른 시작, OpenAI 호환 API, 인증, 오류.