Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Introduction to WebAuthn Testing API
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
Yoshikazu Nojima
May 29, 2019
Technology
2k
3
Share
Introduction to WebAuthn Testing API
An Introduction to Google Chrome WebAuthn Testing API
Yoshikazu Nojima
May 29, 2019
More Decks by Yoshikazu Nojima
See All by Yoshikazu Nojima
入門DBSC
ynojima
0
330
Passkeys for Java Developers
ynojima
3
1.4k
サーバーサイド開発者のためのパスキー入門
ynojima
4
1.4k
Mavenパッケージの署名検証
ynojima
1
130
FIDO CTAP2 from Authenticator perspective
ynojima
2
1k
WebAuthn & WebAuthn4J Introduction
ynojima
2
3k
WebAuthn for Java developers
ynojima
2
2.1k
WebAuthn from the relying-party view
ynojima
2
6.3k
WebAuthn in a nutshell - NTT Tech Conf #3 (ja)
ynojima
2
2k
Other Decks in Technology
See All in Technology
組織的なAI活用を阻む 最大のハードルは コンテキストデザインだった
ixbox
7
1.9k
DIPS2.0データに基づく森林管理における無人航空機の利用状況
naokimuroki
1
210
ふりかえりがなかった職能横断チームにふりかえりを導入してみて学んだこと 〜チームのふりかえりを「みんなで未来を考える場」にするプロローグ設計〜
masahiro1214shimokawa
0
410
Discordでリモートポケカしてたら、なぜかDOを25分間動かせるようになった話
umireon
0
140
みんなの「データ活用」を支えるストレージ担当から持ち込むAWS活用/コミュニティー設計TIPS 10選~「作れる」より、「続けられる」設計へ~
yoshiki0705
0
180
幾億の壁を超えて/Beyond Countless Walls(JP)
ikuodanaka
0
130
QGISプラグイン CMChangeDetector
naokimuroki
1
260
プロダクトを触って語って理解する、チーム横断バグバッシュのすすめ / 20260411 Naoki Takahashi
shift_evolve
PRO
1
290
プロンプトエンジニアリングを超えて:自由と統制のあいだでつくる Platform × Context Engineering
yuriemori
0
200
暗黙知について一歩踏み込んで考える - 暗黙知の4タイプと暗黙考・暗黙動へ
masayamoriofficial
0
1.7k
【Findy FDE登壇_2026_04_14】— 現場課題を本気で解いてたら、FDEになってた話
miyatakoji
0
1.1k
生成AI時代のエンジニア育成 変わる時代と変わらないコト
starfish719
0
4.3k
Featured
See All Featured
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
141
35k
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
kimpetersen
PRO
0
310
It's Worth the Effort
3n
188
29k
From Legacy to Launchpad: Building Startup-Ready Communities
dugsong
0
190
The Pragmatic Product Professional
lauravandoore
37
7.2k
Getting science done with accelerated Python computing platforms
jacobtomlinson
2
170
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
Imperfection Machines: The Place of Print at Facebook
scottboms
270
14k
What does AI have to do with Human Rights?
axbom
PRO
1
2.1k
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.7k
WENDY [Excerpt]
tessaabrams
9
37k
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
68
38k
Transcript
Copyright © Yoshikazu Nojima 2018 WebAuthnテスト自動化入門 2019-05-29 iddance #1 能島
良和 (@shiroica)
Copyright © Yoshikazu Nojima 2018 自己紹介 • 能島良和 • 通信キャリアでホスティングサービスの開発・運用
• 前職は通信キャリア系SIerで社内向けにSpringのPJ支援業務 • Apache CloudStack Commiter(活動休止中。。) • WebAuthn4Jというライブラリ作ってます • https://github.com/webauthn4j/webauthn4j • JJUG発表資料:Java開発者のためのWebAuthn入門 • https://speakerdeck.com/ynojima/webauthn-for-java-developers • Twitter:@shiroica • GitHub:ynojima 1
Copyright © Yoshikazu Nojima 2018 WebAuthn採用時の悩み 2 どうやって自動テスト書く?
Copyright © Yoshikazu Nojima 2018 E2Eテストで扱う典型的な認証フロー(パスワード認証) 1. 登録画面に遷移する 2. 登録画面でユーザー名と
パスワードを入力する 3. 登録ボタンを押す 4. 認証画面に遷移する 5. 認証画面でユーザー名と パスワードを入力する 6. 認証画面で認証ボタンを押す 3 自動化は容易
Copyright © Yoshikazu Nojima 2018 E2Eテストで扱う典型的な認証フロー(WebAuthn認証) 1. 登録画面に遷移する 2. 登録画面でユーザー名を入力する
3. Authenticatorの追加ボタンを押す 4. Authenticatorデバイス側で承認ジェスチャーを行う 5. 登録ボタンを押す 6. 認証画面に遷移する 7. 認証画面で認証ボタンを押す 8. Authenticatorデバイスで認証ジェスチャーを行う 4
Copyright © Yoshikazu Nojima 2018 E2Eテストで扱う典型的な認証フロー(WebAuthn認証) 1. 登録画面に遷移する 2. 登録画面でユーザー名を入力する
3. Authenticatorの追加ボタンを押す 4. Authenticatorデバイス側で承認ジェスチャーを行う 5. 登録ボタンを押す 6. 認証画面に遷移する 7. 認証画面で認証ボタンを押す 8. Authenticatorデバイスで認証ジェスチャーを行う 5 手動操作が必要
Copyright © Yoshikazu Nojima 2018 6 認証ジェスチャなしで応答を 返す、エミュレータが欲しい
Copyright © Yoshikazu Nojima 2018 Web Authentication Testing API WebAuthnのE2Eテスト実装を支援するためのChromeのAPI
Chrome://flags画面あるいは起動オプションから有効化可能(デフォルトでは無効) 7
Copyright © Yoshikazu Nojima 2018 selenium-javaでのテストコード例(1/2) 8 @RunWith(SpringRunner.class) @SpringBootTest(classes =
SampleWebApplication.class, webEnvironment = SpringBootTest.WebEnvironment.DEFINED_PORT) public class E2ETestBase { protected WebDriver driver; protected WebDriverWait wait; @BeforeClass public static void setupClassTest(){ WebDriverManager.chromedriver().setup(); } @Before public void setupTest() { ChromeOptions chromeOptions = new ChromeOptions(); chromeOptions.addArguments(“--enable-web-authentication-testing-api”); //chromeOptions.setHeadless(true); driver = new ChromeDriver(chromeOptions); wait = new WebDriverWait(driver, 5); driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS); } @After public void teardown() { if (driver != null) driver.quit();} } 起動オプションで指定 Headless起動も可能
Copyright © Yoshikazu Nojima 2018 selenium-javaでのテストコード例(2/2) 9 public class RegistrationAndAuthenticationE2ETest
extends E2ETestBase{ @Test public void test() { // Registration SignupComponent signupComponent = new SignupComponent(driver); signupComponent.navigate(); signupComponent.setFirstname(“John”); signupComponent.setLastname(“Doe”); signupComponent.setUsername(“
[email protected]
”); signupComponent.setPassword(“password”); signupComponent.clickAddAuthenticator(); signupComponent.getResidentKeyRequirementDialog().clickNo(); signupComponent.waitRegisterClickable(); signupComponent.clickRegister(); // Password authentication wait.until(ExpectedConditions.urlToBe(“http://localhost:8080/angular/login”)); PasswordLoginComponent passwordLoginComponent = new PasswordLoginComponent(driver); passwordLoginComponent.setUsername(“
[email protected]
”); passwordLoginComponent.setPassword(“password”); passwordLoginComponent.clickLogin(); // 2nd-factor authentication AuthenticatorLoginComponent authenticatorLoginComponent = new AuthenticatorLoginComponent(driver); // nop wait.until(ExpectedConditions.urlToBe(“http://localhost:8080/angular/profile”)); } テストコード自体は ページオブジェクト パターンに則った Seleniumの普通の テストコード
Copyright © Yoshikazu Nojima 2018 ChromeのAuthenticatorエミュレータが返却する Attestation Certificate • Attestation
Certificateは自己署名証明書 • RPがルート証明書とチェーンしているか検証している場合、検証エラー 10
Copyright © Yoshikazu Nojima 2018 おまけ • WebAuthn4JではAuthenticatorのエミュレータをPure Javaで実装 •
ブラウザ使わずにサーバー単体でのテストを実装可能 11 // 認証デバイスエミュレータの接続されたクライアントエミュレータを準備 private ClientPlatform clientPlatform = EmulatorUtil.createClientPlatform(new AndroidSafetyNetAuthenticator()); @Test void validate_test(){ String rpId = “example.com”; Challenge challenge = new DefaultChallenge(); AuthenticatorSelectionCriteria authenticatorSelectionCriteria = new AuthenticatorSelectionCriteria(AuthenticatorAttachment.CROSS_PLATFORM, true, UserVerificationRequirement.REQUIRED); PublicKeyCredentialParameters publicKeyCredentialParameters = new PublicKeyCredentialParameters(PublicKeyCredentialType.PUBLIC_KEY, COSEAlgorithmIdentifier.ES256); PublicKeyCredentialUserEntity publicKeyCredentialUserEntity = new PublicKeyCredentialUserEntity(); AuthenticationExtensionsClientInputs<RegistrationExtensionClientInput> extensions = new AuthenticationExtensionsClientInputs<>(); PublicKeyCredentialCreationOptions credentialCreationOptions = new PublicKeyCredentialCreationOptions( new PublicKeyCredentialRpEntity(rpId, “example.com”), publicKeyCredentialUserEntity, challenge, Collections.singletonList(publicKeyCredentialParameters), null, Collections.emptyList(), authenticatorSelectionCriteria, AttestationConveyancePreference.DIRECT, extensions ); // エミュレータによるCredentialの生成 PublicKeyCredential<AuthenticatorAttestationResponse, RegistrationExtensionClientOutput> publicKeyCredential = clientPlatform.create(credentialCreationOptions); // 以下省略 }
Copyright © Yoshikazu Nojima 2018 まとめ • WebAuthnは認証デバイスに対するユーザーの承認ジェスチャーが必要 • E2E自動テスト実施する上で承認ジェスチャー要件が障害
• Chromeは起動オプションでAuthenticatorエミュレータに実装を切替、 承認ジェスチャーをスキップ可能 • WebAuthnでも諦めずにE2Eテストを書いていきましょう! 12
Copyright © Yoshikazu Nojima 2018 おまけ1 ChromiumのWebAuthnのE2Eテストコード https://github.com/chromium/chromium/blob/fc74bfe460548ef49e12 d78c476f0ffc5ff2db99/third_party/blink/web_tests/http/tests/credenti almanager/virtual-navigator-credentials.html#L20-L43
13
Copyright © Yoshikazu Nojima 2018 おまけ2 WebAuthn Testing API Design
Doc https://docs.google.com/document/d/1bp2cMgjm2HSpvL9-WsJoIQMsBi1oKGQY6CvWD- 9WmIQ/edit#heading=h.wemjkxju7znw 14