직접 소유한 Stripe 계정으로 일회성 결제와 구독을 받으세요. Lovable이 Stripe API key를 사용해 채팅에서 checkout을 구축합니다.
내 Stripe 계정 연결하기
직접 소유한 Stripe 계정으로 일회성 결제와 구독을 받으세요. Lovable이 Stripe API key를 사용해 채팅에서 checkout을 구축합니다.
Stripe는 카드와 기타 온라인 결제 수단을 지원하는 결제 플랫폼입니다. Stripe 통합은 직접 소유한 Stripe 계정을 Lovable 프로젝트에 연결합니다. Stripe 대시보드의 API key를 제공하면 Lovable이 채팅에서 checkout flow, 구독, customer portal을 구축합니다. 결제 금액은 Stripe 계정으로 직접 들어갑니다.
대부분의 프로젝트에는 내장 결제를 권장합니다. 내장 결제를 사용하면 Lovable이 결제 provider 계정을 만들고 관리하므로 API key를 직접 다루지 않아도 됩니다. 자동으로 분리된 테스트 및 라이브 환경과 전체 결제 대시보드도 제공됩니다.
| 선택 | 다음을 원하는 경우 |
|---|---|
| 내장 결제(권장) | 최소한의 설정으로 결제를 받으려는 경우. Lovable이 Stripe 또는 Paddle 계정을 프로비저닝하고 key, webhook, 테스트 및 라이브 환경을 관리합니다. 유료 플랜이 필요하며 일부 앱에는 backend가 필요합니다. 요구 사항을 참고하세요. |
| 내 Stripe 계정(이 페이지) | 기존 Stripe 계정을 사용하거나 직접 관리하려는 경우, 자체 Supabase를 사용하는 이전 React + Vite 앱에서 결제를 받으려는 경우, Free 플랜에서 결제를 받으려는 경우. |
프로젝트에서는 둘 중 하나만 사용할 수 있습니다.
시작하기 전에
- Stripe 계정. 없다면 stripe.com에서 만드세요. 사업자 인증, 정산, 세금, 분쟁을 직접 관리하며 Stripe 표준 요금이 적용됩니다.
- Backend. 기본으로 활성화되는 내장 backend(Cloud)와 자체 Supabase 프로젝트를 모두 지원합니다.
- 구독용 로그인. 일회성 결제에는 사용자 계정이 필요하지 않지만, 구독에서는 앱 사용자를 구독과 연결할 수 있도록 인증이 필요합니다.
- 워크스페이스에서 활성화된 Stripe 커넥터. 워크스페이스의 Stripe 커넥터 설정 하나가 내장 결제와 이 통합을 모두 제어합니다. 기본으로 활성화되지만 Enterprise 플랜에서는 기본값이 비활성화입니다. Business와 Enterprise 플랜의 워크스페이스 admin 또는 owner는 Connectors → Admin settings → App + chat connectors에서 활성화할 수 있습니다.
유료 Lovable 플랜은 필요하지 않으며 프로젝트 편집 권한이 있는 사람이 설정할 수 있습니다.
Stripe 계정 연결하기
모든 설정은 채팅에서 진행됩니다. Stripe 계정을 준비하고 다음 단계를 따르세요.
채팅에서 결제 요청하기
판매할 항목을 설명하세요.
Create a one-time checkout for my digital course at $29.Set up two subscription tiers: Basic at $9/month and Premium at $19/month.Lovable은 먼저 내장 결제를 권장합니다. 대신 직접 소유한 Stripe 계정을 사용한다고 알려 주세요.
Stripe API key 제출하기
Lovable이 채팅에 Connect Stripe 양식을 표시합니다. Stripe 대시보드의 Developers → API keys에서 필요한 권한만 가진 restricted key를 만드세요. Stripe restricted API key 필드에 붙여넣고 Submit을 클릭합니다. Lovable이 저장 전에 Stripe에서 key를 검증합니다.
양식은 테스트 또는 라이브 모드의 restricted key(rk_...)와 secret key(sk_...)를 받습니다. 안전하게 시험할 수 있도록 테스트 key로 시작하세요. Publishable key(pk_...)는 사용할 수 없습니다.
Stripe key를 채팅 메시지에 붙여넣지 마세요. Connect Stripe 양식에만 입력하세요. Key는 앱 코드가 아닌 backend secret으로 저장되며 채팅을 통과하지 않습니다.
Lovable이 만든 내용 검토하기
Lovable이 backend 코드를 작성하고, 요청한 제품과 가격을 승인 후 Stripe 계정에 만들고, 앱에 버튼과 페이지를 추가합니다. Preview에서 flow를 테스트하세요.
결제 작동 방식
Lovable은 저장된 key로 Stripe를 호출하는 작은 backend 코드인 edge function으로 결제 flow를 만듭니다. Key는 앱에 노출되지 않습니다.
일회성 결제
일회성 구매에는 checkout function과 구매 버튼을 만듭니다. 구매자가 버튼을 클릭하면 Stripe Checkout이 새 탭에서 열립니다. 결제를 마치면 앱의 결제 성공 페이지로 돌아오고, 취소하면 취소 페이지로 이동합니다. 앱 계정은 필요하지 않습니다. 로그인한 사람이 없으면 Stripe가 checkout에서 이메일을 받습니다.
구독
구독에는 각 플랜의 checkout과 사용자가 로그인하거나 앱을 사용할 때 실행되는 구독 확인 로직을 만듭니다. 앱이 Stripe에 활성 구독 여부를 직접 확인하므로 유료 기능이 자동으로 활성화되거나 잠깁니다.
구독은 이메일 주소로 사용자와 연결됩니다. 사용자가 앱에서 로그인한 이메일과 Stripe customer record의 이메일이 같으면 구독이 인식됩니다.
구독자가 직접 취소하거나 플랜을 바꾸게 하려면 Stripe의 hosted customer portal을 여는 Manage subscription 버튼을 추가해 달라고 요청하세요. 먼저 Stripe 대시보드에서 portal을 한 번 활성화해야 합니다. Stripe customer portal 가이드를 참고하세요. Portal은 Lovable preview panel 안에서 작동하지 않으므로 독립된 브라우저 탭이나 게시된 앱에서 테스트하세요.
제품과 가격
Lovable은 채팅에서 각 항목을 먼저 승인받은 뒤 Stripe 계정에 제품과 가격을 직접 만들 수 있습니다. 계정에 이미 있는 제품과 가격도 재사용할 수 있습니다. 생성된 항목은 Stripe에서 직접 만든 것처럼 대시보드에 표시됩니다.
Webhook
기본 설정은 webhook을 사용하지 않습니다. 앱이 결제와 구독 상태를 Stripe에 직접 확인하므로 대부분의 앱에는 충분하며 설정도 간단합니다.
Webhook은 결제 성공 같은 이벤트가 발생하면 Stripe가 backend로 즉시 보내는 메시지입니다. 주문 처리 등을 위해 필요하다면 Lovable에 설정을 요청하세요. Lovable이 webhook function을 작성하면 Stripe 대시보드에서 설정을 마무리합니다.
Event destination 만들기
Stripe 대시보드의 Developers → Webhooks에서 webhook function URL을 가리키는 event destination을 만듭니다.
이벤트 선택하기
payment_intent.succeeded, customer.subscription.updated처럼 필요한 이벤트를 선택합니다.
Signing secret 저장하기
Signing secret을 복사하고 Lovable이 요청할 때 secret으로 추가합니다.
Webhook endpoint와 signing secret은 Stripe 대시보드에서 직접 관리합니다.
테스트 및 라이브 전환
제공한 key가 모드를 결정합니다. 테스트 key(rk_test_... 또는 sk_test_...)를 사용하면 Stripe 테스트 모드가 적용됩니다. 카드 번호 4242 4242 4242 4242, 미래의 만료일, 임의의 세 자리 CVC를 입력하면 실제 청구 없이 결제가 완료됩니다.
Preview에서 전체 flow를 테스트할 수 있으며 checkout은 새 탭에서 열립니다. 내장 결제와 달리 별도 테스트 환경이 없습니다. 프로젝트는 한 번에 key 하나를 사용하므로 live key를 넣은 상태에서 preview로 결제하면 실제로 청구됩니다.
라이브로 전환하는 방법은 다음과 같습니다.
Live key로 전환하기
Lovable에 Stripe key 업데이트를 요청하고 Update Stripe secret key 양식에 live key를 제출합니다.
Live 제품과 가격으로 전환하기
Stripe live mode에 제품과 가격이 있는지 확인합니다. Test와 live mode의 price ID가 다르므로 앱을 live price ID로 바꿔 달라고 Lovable에 요청하세요.
실제 구매로 확인하기
게시된 앱에서 실제 구매를 실행합니다.
통합 관리
결제 내역 보기
프로젝트의 More 메뉴에서 Payments를 여세요. 내장 결제와 같은 화면입니다. 직접 소유한 Stripe 계정을 사용하는 프로젝트에는 Self-managed Stripe 배지와 거래, 환불, 제품을 포함한 결제 데이터의 읽기 전용 보기가 표시됩니다. 제품 관리, 환불, 설정 변경은 Open in Stripe를 클릭해 Stripe 대시보드에서 처리하세요.
Stripe key 업데이트하기
Stripe에서 key를 회전하거나 테스트에서 라이브로 바꿀 때 Lovable에 Stripe key 업데이트를 요청하세요. Update Stripe secret key 양식은 Connect Stripe와 같은 방식으로 작동합니다. 저장된 key가 취소되는 등 더 이상 작동하지 않으면 Lovable이 Stripe 액션을 일시 중지하고 새 key를 요청합니다.
Key 저장 위치
Key는 STRIPE_SECRET_KEY라는 backend secret으로 저장됩니다. Lovable은 값을 다시 표시하지 않으며 앱 코드나 repository에도 나타나지 않습니다.
- Cloud 프로젝트에서는 Cloud 보기의 Secrets에 Lovable 배지와 함께 나타납니다. Secrets 화면이 아니라 채팅에서 업데이트하세요.
- 자체 Supabase를 사용하는 프로젝트에서는 Supabase 프로젝트의 edge function secret으로 동기화되며 Supabase 대시보드에서 확인할 수 있습니다.
Stripe 연결 해제하기
프로젝트 편집 권한이 있는 사람은 연결할 때와 마찬가지로 연결을 해제할 수 있습니다. 내장 결제는 admin, owner, 결제 설정자만 연결을 해제할 수 있다는 점이 다릅니다.
Payments 보기 열기
프로젝트의 More 메뉴에서 Payments를 엽니다.
연결 해제하기
오른쪽 위의 점 세 개 메뉴를 열고 Disconnect Stripe를 클릭합니다. 확인하려면 DISCONNECT를 입력합니다.
연결을 해제하면 Lovable이 프로젝트에 저장된 API key를 영구 삭제합니다. 결제 기능에 미치는 영향은 backend에 따라 다릅니다.
- Cloud 프로젝트에서는 다시 연결하거나 결제 코드를 제거할 때까지 결제 기능이 중단됩니다.
- 자체 Supabase를 사용하는 프로젝트에서는 Lovable이 Supabase edge function secret의
STRIPE_SECRET_KEY를 제거하지 않습니다. Secret이 남아 있는 동안 배포된 결제 function은 계속 작동하고 고객에게 계속 청구합니다. 결제를 중단하려면 Supabase 대시보드에서STRIPE_SECRET_KEY를 삭제하거나 결제 코드를 제거하세요.
Stripe 계정에는 영향이 없습니다. 제품, customer, 결제 기록은 그대로 남습니다. 다시 연결하려면 Lovable에 Stripe 결제를 요청하고 key를 제출하세요.
연결을 해제해도 고객의 활성 구독을 취소하거나 결제를 환불하지 않습니다. Stripe 대시보드에서 관리하세요.
제한 사항
- 프로젝트는 직접 소유한 Stripe 계정과 내장 결제를 동시에 사용할 수 없습니다. 다른 방식을 활성화하기 전에 기존 연결을 해제하세요.
- 이 통합의 Payments 보기는 읽기 전용입니다. 제품 생성, 환불, webhook 구성은 Stripe 대시보드에서 처리하세요.