Paano I-integrate ang OpenAI API sa Iyong App
Para i-integrate ang OpenAI API, gumawa ng API key sa isang OpenAI project, itago ito bilang server-side secret na pinangalanang OPENAI_API_KEY, at tawagin ang API mula sa route sa sarili mong server gamit ang opisyal na SDK ng OpenAI, hindi kailanman mula sa browser code. Simula Setyembre 2026, inilalahad ng quickstart ng OpenAI ang Responses API bilang panimulang punto para sa mga bagong project. Maglagay ng spend limit bago mag-launch, limitahan ang haba ng sagot, limitahan kung gaano kadalas makakatawag ang bawat user sa feature, at hawakan ang rate-limit error gamit ang retry.
Sakop ng gabay na ito ang setup, daloy ng request, mga prompt para sa AI builder, at mga pagkakamaling nagbubunyag ng key o nagpapaubos ng pera. Ang mga detalye ng OpenAI ay mula sa opisyal nilang dokumentasyon noong Setyembre 2026. Para sa mga pangkalahatang konsepto (token, context window, presyo), basahin muna ang paano gumamit ng LLM API.
Ano ang puwede mong buuin dito
- Chat assistant sa loob ng app mo (paano gumawa ng AI chatbot app)
- Mga button na "Buurin ito", "isulat ulit ito", o "gumawa ng draft ng sagot"
- Pagkuha ng structured na datos mula sa free text: pag-convert ng email sa order, pag-tag ng support ticket
- Paghahanap at pagsagot ng tanong mula sa sarili mong content
- Image generation, speech, at iba pang media feature, depende sa available na model
Mas maraming ideya sa paano magdagdag ng AI features sa app mo.
Pag-set up ng OpenAI account
- Gumawa ng account at project sa OpenAI platform. Inirerekomenda ng production best practices ng OpenAI ang magkahiwalay na project para sa staging at production, para may sariling key at limit ang bawat isa.
- Gumawa ng project API key. Inirerekomenda ng OpenAI na magtakda ng petsa ng pag-expire at regular na magpalit ng key.
- Mag-set ng spend alert at mahigpit na spend limit sa limits page. Sabi ng guide ng OpenAI, nagbibigay ng abiso ang alerto kapag lumampas ang paggamit sa isang halaga, at ipinapatupad ng hard limit ang buwanang takda.
- Mag-dagdag ng billing. Inilalarawan ng rate-limit docs ng OpenAI ang mga usage tier: awtomatikong tumataas ang limit mo habang mas marami kang nagagastos sa paglipas ng panahon.
Daloy ng request
Browser -> server route mo -> OpenAI API
<- (naka-stream) sagot <-
- Mag-click ang user ng button o magpapadala ng mensahe.
- Tatawag ang browser sa sarili mong route, halimbawa
POST /api/summarise. - Titingnan ng server mo kung naka-log in ang user at pinapayagang gamitin ang feature.
- Bubuuin ng server ang request: mga tagubilin, input ng user, at anumang datos mula sa database na kailangan ng gawain.
- Tatawag ito sa OpenAI gamit ang key mula sa environment. Awtomatikong binabasa ng SDK ng OpenAI ang
OPENAI_API_KEY. - Ipo-stream o ibabalik nito ang sagot, at itatala ang paggamit ng token.
Ang opisyal na SDK package ng OpenAI ay tinatawag na openai, para sa JavaScript/TypeScript (npm) at Python (pip).
Pagpili ng model
Nag-aalok ang OpenAI ng ilang model na may iba't ibang presyo at bilis, at madalas magbago ang listahan. Magsimula sa mas maliit at mas murang model, sukatin ang kalidad gamit ang totoong halimbawa, at umakyat lang kung kailangan. Panatilihin ang pangalan ng model sa config value o secret para mapalitan ito nang hindi ginagalaw ang code. Tingnan ang pricing page ng OpenAI para sa kasalukuyang rate.
Mga opsyon at trade-off
| Desisyon | Simpleng pagpili | Kailan lumampas pa |
|---|---|---|
| Streaming | Ibalik ang buong sagot | Mag-stream para sa chat at mahahabang sagot; agad makikita ng user ang teksto |
| Memorya ng usapan | Ipadala ang kamakailang mensahe sa bawat pagkakataon | I-buod ang mas lumang mensahe kapag humahaba ang chat |
| Format ng output | Plain text | Humingi ng structured JSON kapag kailangan ng code mo basahin ang mga field |
| Sarili mong datos | Isama ang kaugnay na record sa request | Magdagdag ng search sa content mo kapag sobra ang datos (ano ang RAG) |
| Maramihang hindi madalian | Mag-loop sa mga item | Gamitin ang batch option ng OpenAI para sa mas mababang gastos kapag puwedeng maghintay ang resulta |
Mga prompt para sa AI builder mo
Unang feature:
Magdagdag ng button na "Summarise" sa ticket page. Tatawag ito sa server route na POST /api/summarise na titingin kung naka-log in ang user, kukunin ang ticket, at tatawag sa OpenAI Responses API gamit ang opisyal na openai SDK at ang secret na OPENAI_API_KEY. Basahin ang pangalan ng model mula sa secret na OPENAI_MODEL. Mga tagubilin: "Buurin sa 3 bullet point, pagkatapos magmungkahi ng maikling sagot. Huwag mag-imbento ng order number." Limitahan ang haba ng output, i-stream ang sagot sa pahina, at huwag kailanman ipadala ang key sa browser.
Mga guardrail:
Limitahan ang bawat user sa 30 AI request kada oras, itinatala sa database. I-log ang input at output token kada request kasama ang user ID at pangalan ng feature. Kapag nagbalik ang OpenAI ng 429, sundin ang Retry-After header at mag-retry gamit ang exponential backoff at jitter nang hanggang 3 beses; pagkatapos, ipakita ang "Abala ang AI, subukan ulit sa isang minuto." Magpakita ng magiliw na error para sa anumang ibang pagkabigo at panatilihing gumagana ang iba pang bahagi ng pahina.
Paghawak sa mga error at limit
Sinusukat ng OpenAI ang rate limit sa ilang paraan, kasama ang request kada minuto at token kada minuto, at mauubos mo ang alinmang mauna. Kapag lumampas ka sa isa, nagbabalik ang API ng 429 na may Retry-After header. Sabi ng docs ng OpenAI, ituring ang halagang iyon bilang pinakamababang oras ng paghihintay, at magdagdag ng maliit na random na delay para hindi sabay-sabay na mag-retry ang lahat ng client.
Maghanda rin para sa:
- Timeout sa mahahabang pag-generate. Nakakatulong ang streaming, at nakakatulong din ang makatwirang cap sa output.
- Outage ng provider. Dapat bumagsak nang maayos ang AI feature nang hindi sinisira ang pahina.
- Masamang output. I-validate ang structured output bago i-save, at huwag hayaang mag-trigger ng sensitibong aksyon ang output ng model nang walang tseke sa code mo.
Mga karaniwang pagkakamali
- Key sa frontend o sa repository. Publiko ang browser code, at puwedeng abusuhin ang nalantad na key sa loob ng ilang minuto. Tingnan ang paano panatilihing ligtas ang API key.
- Walang spend limit. Puwedeng magpabilis ng malaking bill ang loop o isang abusadong user.
- Walang limitasyon kada user. Pinoprotektahan ng limit ng provider ang pitaka mo, hindi ang iba mong user.
- Pagtitiwala sa prompt para sa seguridad. Puwedeng mag-type ang user ng "ignore previous instructions". Nasa server code dapat ang mga pahintulot.
- Pagpapadala nang higit sa kailangan. Pinadarami ng buong dokumento at mahabang kasaysayan ang gastos. Ipadala lang ang kailangan ng gawain.
- Hard-coded na pangalan ng model. Nina-update at nire-retire ang mga model; gawin itong setting.
- Pagpapadala ng personal na datos nang walang pag-iisip. Basahin ang data-use terms ng OpenAI at ipadala lang ang kailangan ng feature.
Checklist
- Magkahiwalay na OpenAI project (o key) para sa testing at production
- Nakaimbak ang key bilang server-side secret, hindi sa browser code o repo
- Nakatakda ang spend alert at mahigpit na spend limit
- Lahat ng tawag ay dumadaan sa server mo at tinitingnan ang pahintulot ng user
- Naka-cap ang haba ng output; puwedeng i-configure ang pangalan ng model
- May limitasyon kada user sa app mo
- May paghawak sa 429 gamit ang Retry-After, backoff, at jitter
- Magiliw na error state; gumagana ang pahina kahit walang AI
- Nakatala ang paggamit ng token kada feature
- Nasubukan gamit ang mahaba, walang laman, at mapanganib na input
Paggamit ng OpenAI API sa Mythex
Gumagamit ang mga AI feature sa app na binubuo mo sa Mythex ng sarili mong OpenAI key, at sinisingil sa sarili mong OpenAI account, hindi sa build credits ng Mythex. Idagdag ang OPENAI_API_KEY bilang project secret sa pamamagitan ng /secrets, project settings, o secrets card na ipinapakita ng agent kapag kailangan nito ng key, pagkatapos ilarawan ang feature gamit ang prompt na tulad ng nasa itaas. Pagkatapos magpalit ng secret sa published na app, i-publish ulit ito para makuha nito ang mga bagong secret. Nasa docs recipe na Magdagdag ng AI features gamit ang sarili mong API key ang starter prompt, at ipinapaliwanag ng Secrets sa chat ang secrets card. Naghahambing ng provider? Tingnan ang paano i-integrate ang Claude API.
Mga tanong
Aling OpenAI API ang dapat kong gamitin para sa bagong app?
Simula Setyembre 2026, inilalahad ng quickstart ng OpenAI ang Responses API bilang panimulang punto para sa mga bagong project, na may mga halimbawang gumagamit ng client.responses.create() sa mga opisyal nilang SDK. Tingnan ang dokumentasyon ng OpenAI para sa kasalukuyang rekomendasyon bago ka magsimula.
Puwede ba akong tumawag sa OpenAI API mula sa browser?
Hindi gamit ang secret key mo. Kayang basahin ng sinuman ang browser code at gamitin ulit ang key para pataasin ang bill mo. Dapat tumawag ang browser sa sarili mong server route, at tumatawag ang server mo sa OpenAI gamit ang key na nakaimbak bilang environment variable.
Paano ko pipigilan ang sobrang gastos sa OpenAI API?
Inirerekomenda ng production guide ng OpenAI ang spend alert at mahigpit na buwanang spend limit sa limits page. Sa app mo, limitahan ang haba ng sagot, limitahan ang request kada user, at itala ang paggamit ng token para makita kung aling feature ang pinakamahal.
Ano ang ibig sabihin ng 429 error mula sa OpenAI?
Ibig sabihin, naabot mo ang rate limit. Sabi ng rate-limit docs ng OpenAI, may kasamang Retry-After header ang response; maghintay nang hindi bababa sa oras na iyon, magdagdag ng maliit na random na delay, at mag-retry gamit ang exponential backoff.