Tämä opas näyttää, kuinka tunnistaudut Logton kanssa Single Page Application (SPA) -testissäsi.
Tunnistautuminen on kriittinen osa mitä tahansa verkkosovellusta, ja on tärkeää varmistaa, että tunnistautumisvahdit toimivat odotetusti Single Page Application (SPA) -sovelluksissa. Tässä oppaassa opastamme sinut tunnistautumisprosessin läpi Logton avulla Cypress-testeissäsi, mikä mahdollistaa SPA-sovelluksesi tunnistautumisprosessin tehokkaan testaamisen.
Ennen kuin syvennyt aiheeseen, varmista, että sinulla on seuraavat asiat valmiina:
Logto-tili. Jos sinulla ei ole sellaista, voit rekisteröityä Logto Cloudiin ilmaiseksi.
Single Page Application (SPA), joka on integroitu Logton kanssa tunnistautumista varten. Jos sinulla ei ole sellaista, seuraa luo-ja-integroi-ensimmäinen-sovellus -opastamme, luo ja rekisteröi uusi sovellus Logtoon.
Integroi Logto SPA-sovellukseesi meidän valmiiksi rakennetuilla SDK:illamme, esim. React SDK
Voit seurata kirjautumiskokemuksen mukautustamme mukauttaaksesi kirjautumiskokemuksen omaa SPA-sovellustasi varten. Simuloi kirjautumisprosessia Cypress-testeissäsi vastaavasti.
Viimeistele Cypressin asennus ja konfigurointi. Tämä opas olettaa, että sinulla on hyvin asennettu Cypress-ympäristö ja voit jo suorittaa Cypress-testisi.
Käynnistä Logto-palvelusi ja asiakassovelluksesi.
Käytämme esimerkkinä tässä oppaassa React SPA Sample -sovellustamme. Lähdekoodin löydät täältä.Se on yksinkertainen React-sovellus, joka integroituu Logtoon käyttäen Logto React SDK:ta tunnistautumiseen.
http://localhost:3001/sign-inhttp://localhost:3000käyttäjätunnus/salasanaKirjoitetaan mukautettu Cypress-komento tunnistautumiseen Logton kanssa Cypress-testeissäsi. Mukautetun komennon avulla voit helposti tunnistautua Logton kanssa missä tahansa Cypress-testissäsi.
Vierail in asiakassovelluksesi kirjautumissivulla Cypress-testissä ja käynnistä kirjautumisprosessi napsauttamalla kirjautumispainiketta.
Siiry Logton kirjautumissivulle ja täytä käyttäjätunnus ja salasana kirjautuaksesi.
Normaaleissa olosuhteissa yksi Cypress-testi voi ajaa komentoja vain yhdessä alkuperässä, selaimen tavallisten verkkoturvallisuusominaisuuksien määräämä rajoitus. cy.origin() -komento sallii testiesi ohittaa tämän rajoituksen.
Onnistuneen kirjautumisen jälkeen sinun tulee voida palata asiakassovellukseesi.
Kääri koko kirjautumisprosessi mukautettuna Cypress-komentona. cy.signIn tässä esimerkissä.
Missä tahansa Cypress-testissäsi voit käyttää mukautettua Cypress-komentoa tunnistautuaksesi Logton avulla.
Onneksi olkoon! Olet onnistuneesti tunnistautunut Logton kanssa Cypress-testeissäsi. Voit nyt keskittyä testaamaan SPA-sovellustasi murehtimatta tunnistautumisprosessista.