Suomi
  • cypress
  • logto
  • tunnistautuminen

Logton tunnistautuminen Cypressissä

Tämä opas näyttää, kuinka tunnistaudut Logton kanssa Single Page Application (SPA) -testissäsi.

Simeng
Simeng
Developer

Johdanto

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.

Esivaatimukset

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.

    luo_sovellus

  • 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.

    kirjautumiskokemus

  • 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.

  • Logton kirjautumisosoite: http://localhost:3001/sign-in
  • React SPA-sovelluksen domain: http://localhost:3000
  • Logton kirjautumiskokemusasetukset: käyttäjätunnus/salasana

Kirjoita mukautettu Cypress-komento tunnistautumiseen Logton kanssa

Kirjoitetaan mukautettu Cypress-komento tunnistautumiseen Logton kanssa Cypress-testeissäsi. Mukautetun komennon avulla voit helposti tunnistautua Logton kanssa missä tahansa Cypress-testissäsi.

Vaihe 1: Käynnistä kirjautumisprosessi

Vierail in asiakassovelluksesi kirjautumissivulla Cypress-testissä ja käynnistä kirjautumisprosessi napsauttamalla kirjautumispainiketta.

koti

Vaihe 2: Täytä kirjautumislomake ja lähetä

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.

  1. Varmista, että nykyinen URL-osoite on Logton kirjautumissivu. kirjautuminen
  2. Tunnista käyttäjätunnuksen ja salasanan syöttökentät ja kirjoita käyttäjätunnus ja salasana. lähetä
  3. Klikkaa kirjautumispainiketta kirjautuaksesi.

Vaihe 3: Onnistunut tunnistautuminen ja paluu asiakassovellukseen

Onnistuneen kirjautumisen jälkeen sinun tulee voida palata asiakassovellukseesi.

kutsu

Vaihe 4: Kääri koko kirjautumisprosessi mukautettuna Cypress-komentona

Kääri koko kirjautumisprosessi mukautettuna Cypress-komentona. cy.signIn tässä esimerkissä.

Käytä mukautettua Cypress-komentoa sovelluksesi tunnistautumiseen

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.

Kokeile Logto Cloudia