[C#] 初探 WebAuth 簡單範例 (登入+驗證邦定裝置實作)

2022-11-14

接續上篇文章  初探 WebAuth 簡單範例 (註冊+綁定裝置實作) ,這一篇我們就是要繼續實作登入+驗證裝置的部分



接續之前已經註冊用戶+綁定裝置了,今天這一篇會先登入,確認身分,之後在 javscript 端 呼叫  navigator.credentials.get({ publicKey: makeAssertionOptions })

將裝置資料傳回後進行驗證


登入,主要先確定帳號密碼是不是在資料庫中(範例我只是寫入檔案系統)

Javascript code:


之後透過 ajax 到  webapi 進行驗證後呼叫  navigator.credentials.get({ publicKey: makeAssertionOptions }) ,並且傳回給 server 進行驗證是不是有該

clientResponse.Id

C# code:


目前寫到這到一個段落,其實中間有許多格式的部分我也略過沒有敘述,當然你也可以詳細的鑽下去 或是可以參考這一篇 https://blog.techbridge.cc/2019/08/17/webauthn-intro/

這一篇寫得非常的詳細,感謝各位前輩留下的東西讓我實作上面也比較方便,如果有不懂的細節就直接看我的 code 吧,也可以幫助您快速實作

當然如果您覺得我寫得很不清不楚這邊有最原始的程式碼 https://fido2-net-lib.passwordless.dev/ 應該也可以幫助到您,因為這距離我之前寫好有點時間了

所以很多東西也沒有說得很仔細,不過就先筆記一下,避免之後自己忘記


Demo Source Code: https://github.com/donma/FIDO2SimpleSample

Online Sample: https://dmauth.azurewebsites.net/


參考文獻:

https://webcodingcenter.com/web-apis/Web-Authentication-(WebAuthn)

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/slice

https://fidoalliance.org/specs/fido-v2.0-rd-20170927/fido-client-to-authenticator-protocol-v2.0-rd-20170927.html

https://stackoverflow.com/questions/59799729/webauthn-getting-the-credentialpublickey-length

https://stackoverflow.com/questions/8936984/uint8array-to-string-in-javascript

https://stackoverflow.com/questions/54045911/webauthn-byte-length-of-the-credential-public-key

重點參考:

https://blog.techbridge.cc/2019/08/17/webauthn-intro/

https://www.wenwoha.com/blog_detail-150.html

https://www.readfog.com/a/1648324634492375040

https://github.com/passwordless-lib/fido2-net-lib


範例改寫參考:

https://fido2-net-lib.passwordless.dev/


當麻許的超技八 2014 | Donma Hsu Design.