Maksusivun käyttöönotto
Lisätkää maksupainike kehotteella.
Maksusivun käyttöönotto on ilmainen Vibe-koodaus-oppitunti CoddyKitissä. Tämä on oppitunti 2/4. Voit lukea tästä oppimispolusta kokonaan mitkä tahansa 3 oppituntia ilmaiseksi — sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä käytännön harjoittelun sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Oppitunti kuuluu Vibe-koodaus-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. Vibe-koodaus-kurssilla on yhteensä 4 oppituntia.
Mikä maksuvaihe on
Maksuvaihe on konversion hetki: näyttö, jolla asiakas sitoutuu maksamaan. Tavoitteenanne on saada hänet sen läpi mahdollisimman vähillä vaiheilla ja ilman tietoturvariskiä.
Yksinkertaisin vankka vaihtoehto on palveluntarjoajan isännöimä maksusivu. Palveluntarjoaja näyttää lomakkeen, kerää kortin tiedot ja ohjaa käyttäjän takaisin. Maksujen käyttöliittymää tarvitsee kirjoittaa vain vähän.
Isännöity vai upotettu
Isännöity maksuvaihe lähettää käyttäjän palveluntarjoajan sivulle ja sitten takaisin teille. Upotettu maksuvaihe näyttää palveluntarjoajan suojatut kentät omalla sivullanne heidän JavaScript SDK:nsa avulla.
Isännöity ratkaisu on nopein julkaista ja sen vaatimustenmukaisuuden piiri on pienin. Upotettu ratkaisu antaa enemmän suunnittelun hallintaa, mutta vaatii enemmän koodia. Suosikaa ensimmäisessä integraatiossa isännöityä ratkaisua.
Compare Stripe's hosted Checkout Session against embedded Elements for my React app. I want the lowest PCI scope and fastest path to launch. Recommend one and explain the trade-off in two paragraphs.Palvelin luo istunnon
Älkää koskaan antako selaimen päättää hintaa. Summa, valuutta ja tuote on määritettävä palvelimella, jossa käyttäjä ei voi muuttaa niitä.
Taustajärjestelmänne luo maksuvaiheen istunnon luotetulla hinnalla ja antaa selaimelle vain istunnon tunnisteen tai URL-osoitteen. Asiakas ohjataan eteenpäin, mutta se ei koskaan määritä summaa.
Write a backend endpoint POST /create-checkout-session that looks up the product price from my database (never from the request body), creates a Stripe Checkout Session for it, and returns the session URL. Explain why reading the price from the client is a security hole.Onnistumis- ja peruutus-URL-osoitteet
Isännöity maksuvaihe tarvitsee kaksi paluupolkua: onnistumis-URL-osoitteen suoritetulle maksulle ja peruutus-URL-osoitteen keskeyttämiselle. Palveluntarjoaja lisää mukaan istunnon tunnisteen, jotta voitte hakea tuloksen.
Onnistumissivu on vahvistus, ei valtuutus. Näyttäkää ”kiitos”, mutta avatkaa käyttöoikeus vasta, kun webhook vahvistaa maksun.
Set up the success_url and cancel_url for my Stripe Checkout Session. On the success page, fetch the session by ID to display the order summary, but make it clear in comments that real fulfilment happens in the webhook, not here.Rivikohteet ja tuotteet
Istunto sisältää rivikohteet: mikä tuote, mikä määrä ja mikä hinta. Määritelkää tuotteet ja hinnat palveluntarjoajan hallintapaneelissa tai rajapinnassa, jotta voitte käyttää pysyviä tunnisteita tilapäisten numeroiden sijaan.
Ennalta määritetyt hinnat mahdollistavat luvun vaihtamisen yhdessä paikassa ilman muutoksia maksuvaiheen koodiin. Niiden avulla myös kuponkien ja verosääntöjen lisääminen on sujuvaa.
Help me model my catalog in Stripe: I have three plans (Basic, Pro, Team) each with monthly and yearly prices. Show how to create Products and Prices once, then reference their price IDs when building a Checkout Session.Asiakastietojen kerääminen
Maksuvaiheessa voidaan kerätä sähköpostiosoite, laskutusosoite ja verotunnisteet. Sähköpostiosoite on olennainen — se yhdistää maksun asiakastietueeseen ja mahdollistaa kuittien lähettämisen.
Kysykää vain tarvitsemianne tietoja. Jokainen ylimääräinen kenttä lisää kitkaa. Kerätkää kuitenkin aina riittävästi tietoja, jotta voitte yhdistää maksun omalla puolellanne käyttäjätiliin.
Maksuvaiheen yhdistäminen käyttäjään
Maksu on yhdistettävä järjestelmässänne tiettyyn tiliin. Välittäkää sisäinen käyttäjätunnisteenne istuntoon metatietona tai client_reference_id-arvona.
Kun webhook saapuu, tunniste kertoo täsmälleen, kenelle käyttöoikeus myönnetään. Ilman sitä maksu jää leijumaan ilman omistajaa.
When I create a Checkout Session, attach my internal user_id as client_reference_id and also as metadata. Show how I later read that back from the checkout.session.completed webhook to grant the right account access.Verot ja vaatimustenmukaisuus
Rajojen yli myyminen tarkoittaa arvonlisäveroa, GST:tä ja myyntiveroa. Jotkin palveluntarjoajat (tai merchant of record -alustat) laskevat ja tilittävät verot puolestasi; toiset edellyttävät, että hoidat ne itse.
Päätä asiasta ajoissa. Verotuksen lisääminen jo käytössä olevaan kassaprosessiin jälkikäteen on työlästä. Jos myyt maailmanlaajuisesti ja haluat ulkoistaa asian, merchant of record -malli poistaa tämän vastuun.
I sell digital products to customers in the EU, UK, and US. Explain my options for handling sales tax and VAT: Stripe Tax versus a merchant-of-record like Paddle. Which removes the most compliance work from me?Paluun käsittely uudelleenohjauksen jälkeen
Maksun jälkeen käyttäjä päätyy onnistumis-URL-osoitteeseesi. Vahvista istunto palvelimella sen tunnuksen avulla ennen kuin näytät arkaluonteisia vahvistustietoja.
Älä muuta käyttöoikeuden tilaa tässäkään vaiheessa. Näytä odotusta tai onnistumista ilmaiseva viesti ja anna webhookin toimia portinvartijana, joka todella avaa tuotteen käyttöoikeuden.
Mobiilisovellusten sisäiset ostot
Verkkomaksuprosessi ei koske iOS:ää ja Androidia. Apple ja Google edellyttävät digitaalisten tuotteiden sisäisten ostojärjestelmiensä käyttöä ja ottavat osuuden myynnistä.
RevenueCatin kaltaiset työkalut yhdistävät molemmat sovelluskaupat yhden SDK:n taakse, joten voit hallita tuotteita, käyttöoikeuksia ja kuitteja yhdenmukaisesti eri alustoilla.
My app ships on web, iOS, and Android. Explain why I can't use Stripe Checkout for digital goods inside the mobile apps, and how RevenueCat unifies Apple and Google in-app purchases with a single entitlement check.Testaa maksuprosessi päästä päähän
Aja testitunnuksilla koko prosessi: luo istunto, uudelleenohjaa käyttäjä, maksa testikortilla, palaa takaisin ja varmista, että webhook käynnistyy. Testaa sitten peruutuspolku ja hylätty kortti.
Vaihda tuotantotunnuksiin vasta, kun kaikki haarat toimivat — onnistuminen, peruutus, hylkäys ja webhookin käsittelemä toimitus.
Generate a test plan for my Stripe Checkout flow: list each step from session creation to webhook fulfilment, the test card to use, and the expected result for success, cancellation, and a declined card.Pikatarkistus
Varmista maksuprosessin tärkein turvallisuussääntö.
Yhteenveto
Palveluntarjoajan ylläpitämä maksuprosessi on nopein ja vähäriskisin tapa aloittaa: palveluntarjoaja näyttää lomakkeen, joten sinun tarvitsee toteuttaa lähes olemattomasti maksukäyttöliittymää. Palvelimesi luo istunnon luotetun hinnan perusteella ja liittää siihen käyttäjätunnuksesi, jotta tulos voidaan yhdistää tiliin.
Onnistumis- ja peruutus-URL-osoitteet käsittelevät paluut, mutta toimitus odottaa webhookia. Suunnittele verotus ajoissa, muista mobiilisovellusten sisäiset ostot ja testaa kaikki haarat testitilassa ennen tuotantoon siirtymistä.
Opi JavaScript tekoälytuutorin avulla — ilmaiseksi
Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.
- Kurssit
- 25
- Oppitunnit
- 100
Usein kysytyt kysymykset
Onko oppitunti ”Maksusivun käyttöönotto” ilmainen?
Kyllä — voit lukea täällä verkossa kokonaan ilmaiseksi mitkä tahansa Vibe-koodaus-oppimispolun 3 oppituntia, myös oppitunnin “Maksusivun käyttöönotto”. Sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä interaktiiviset harjoitukset sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Vibe-koodaus-kurssilla on yhteensä 4 oppituntia.
Mitä opin oppitunnilla ”Maksusivun käyttöönotto”?
Lisätkää maksupainike kehotteella. Harjoittelet Vibe-koodaus-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.
Tarvitsenko kokemusta aloittaakseni Vibe-koodaus-opiskelun?
Aiempi kokemus ei ole tarpeen. CoddyKitin Vibe-koodaus-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 2/4.
Kuinka kauan ”Maksusivun käyttöönotto”-oppitunnin suorittaminen kestää?
Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.
Voinko kirjoittaa ja suorittaa koodia tällä Vibe-koodaus-oppitunnilla?
Kyllä. Jokainen Vibe-koodaus-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.
Kaikki tämän kurssin oppitunnit
- Maksamisen perusteet
- Maksusivun käyttöönotto
- Tilausten hallinta
- Maksujen turvallinen vahvistaminen