Bu kılavuz, Tek Sayfa Uygulaması (SPA) testlerinizde Logto ile nasıl kimlik doğrulama yapacağınızı gösterecek.
Kimlik doğrulama, herhangi bir web uygulamasının önemli bir parçasıdır ve Tek Sayfa Uygulamalarında (SPA) kimlik doğrulama korumalarının beklendiği gibi çalıştığından emin olmak esastır. Bu kılavuzda, Cypress testlerinizde Logto ile kimlik doğrulama sürecini adım adım anlatacağız, böylece SPA'nın kimlik doğrulama akışını etkili bir şekilde test edebilirsiniz.
Başlamadan önce, aşağıdakilere sahip olduğunuzdan emin olun:
Bir Logto hesabı. Henüz yoksa, ücretsiz Logto cloud kaydı yapabilirsiniz.
Logto ile kimlik doğrulama için entegre edilmiş bir Tek Sayfa Uygulaması (SPA). Henüz yoksa, ilk uygulamayı oluşturma ve entegre etme kılavuzumuzu takip ederek, Logto'da yeni bir uygulama oluşturup kaydedin.
SPA uygulamanız ile Logto'yu kutudan çıkmadan kullanabileceğiniz SDK'mız ile entegre edin. Örn. React SDK
Kendi SPA uygulamanız için oturum açma deneyimini özelleştirmek üzere oturum açma deneyimi kılavuzumuzu takip edebilirsiniz. Cypress testlerinizde oturum açma akışını simüle edin.
Cypress kurulumunu ve yapılandırmayı tamamlayın. Bu kılavuz, iyi yapılandırılmış bir Cypress ortamına sahip olduğunuzu ve Cypress testlerinizi zaten çalıştırabildiğinizi varsayar.
Logto hizmetinizi ve istemci uygulamanızı çalıştırın.
Bu kılavuzda örnek olarak React SPA Örnek uygulamamızı kullanacağız. Kaynak kodunu burada bulabilirsiniz. Logto React SDK kullanılarak kimlik doğrulama için Logto ile entegre edilmiş basit bir React uygulaması.
http://localhost:3001/sign-inhttp://localhost:3000kullanıcı adı/şifreCypress testlerinizde Logto ile kimlik doğrulamak için özel bir Cypress komutu yazalım. Özel komutu kullanarak, Cypress testlerinizin herhangi birinde Logto ile kolayca kimlik doğrulama yapabilirsiniz.
Cypress testinizde istemci uygulamanızın oturum açma sayfasını ziyaret edin ve oturum açma butonuna tıklayarak oturum açma akışını başlatın.
Logto oturum açma sayfasına gidin ve oturum açmak için kullanıcı adını ve şifreyi girin.
Normal kullanımlarda, bir tek Cypress testi, tarayıcının standart web güvenlik özellikleri nedeniyle yalnızca tek bir origin'de komut çalıştırabilir. cy.origin() komutu testlerinizi bu sınırlamayı aşmanızı sağlar.
Başarılı bir oturum açmanın ardından, istemci uygulamanıza geri yönlendirilmelisiniz.
Tüm oturum açma akışını özel bir Cypress komutu olarak toparlayın. Bu örnekte cy.signIn.
Cypress testlerinizin herhangi birinde, Logto ile kimlik doğrulamak için özel Cypress komutunu kullanabilirsiniz.
Tebrikler! Cypress testlerinizde Logto ile başarıyla kimlik doğrulaması yaptınız. Artık SPA uygulamanızı test etmeye odaklanabilir ve kimlik doğrulama akışıyla ilgilenmezsiniz.