生物識別身份驗證允許您使用指紋或面部識別對軟件系統進行身份驗證，已經存在了一段時間。2003年，IBM Thinkpads有一個指紋讀取器，可以讓你登錄到你的電腦。2013年，蘋果在iPhone 5S上安裝了指紋掃描儀，盡管還有其他手機首先安裝了它（你好摩托羅拉Atrix！）。

但是，直到最近，Web應用程序才可以輕松使用生物識別身份驗證。

新的 Web 瀏覽器 API 使您可以輕松地向 Web 應用程序添加強大的生物識別身份驗證。

什么是生物識別身份驗證

首先，讓我們談談一般的身份驗證。生物識別身份驗證是任何身份驗證方法的總稱，它取決于用戶的物理屬性，例如指紋、面部或語音。

有三種類型的身份驗證：

您知道的東西，例如密碼

您擁有的東西，例如設備

你是什么，比如指紋

與其他選項相比，生物識別身份驗證具有顯著優勢：

很難失去

很難偷

無法共享

你不能忘記它

讓用戶使用其生物識別進行身份驗證具有顯著的安全性和便利性優勢。根據“iPhone和Android上的生物識別身份驗證”：

可用性，感知和對采用的影響，“2015年發表的一篇論文，”......參與者發現Android面部解鎖和iPhone指紋解鎖在許多常見的使用場景中都易于使用。就其本質而言，生物識別方法比基于知識的身份驗證方法（如密碼）更難獲得。

您也不必單獨使用生物識別身份驗證。當與其他身份驗證方法（如密碼或魔術鏈接）結合使用時，生物識別身份驗證可以提供額外的安全性，而不會增加用戶體驗的摩擦。

如何向 Web 應用添加生物識別功能

向 Web 應用程序添加生物識別身份驗證的最簡單方法是使用名為WebAuhn 的標準。每個主要瀏覽器都支持此功能（除了IE，對不起IE用戶！），并將友好的JavaScript API鏈接到各種基于硬件的身份驗證方法，包括桌面和移動操作系統支持的生物識別選項。

大多數Web瀏覽器都支持WebAuthn。

要添加基于 WebAuthn 的強身份驗證（包括生物識別選項），請執行以下高級步驟：

檢查是否支持使用 JavaScript API 測試 WebAuthn 來測試當前瀏覽器。

提示用戶添加生物識別身份驗證方法

將方法與帳戶關聯

下次登錄時，以某種方式識別用戶

在添加方法時設置 cookie

詢問他們的用戶名

當您知道他們是誰時，提示 WebAuthn 登錄

生物識別身份驗證器（手機或操作系統）將發出身份驗證質詢

用戶通過提供指紋或任何需要的生物識別證明來回答它

您的 JavaScript 接收并解釋來自瀏覽器的消息

如果消息指示身份驗證成功，請登錄用戶

實際代碼非常簡單。

若要確認瀏覽器是否支持 WebAuthn，請運行以下代碼：

if (window.PublicKeyCredential) {
  // do your webauthn stuff
} else {
  // wah-wah, back to passwords for you
}

然后，要添加生物識別身份驗證方法，請調用此 JavaScript 方法：

navigator.credentials.create(options);

要提示生物識別登錄，請使用以下 JavaScript：

navigator.credentials.get(options);

對象至關重要，包括有關所請求憑據類型的信息、防止重放攻擊的隨機數以及有關請求網站的信息。規范中涵蓋了完整的詳細信息，但我們也將在下面詳細介紹該對象。optionsoptions

我們有標準

值得了解的是，允許Web應用程序利用用戶手機的TouchID系統之類的東西進行登錄的標準。您應該了解三個主要標準：

WebAuthn，如前所述

CTAP2

菲多2

WebAuthn 也稱為 Web 身份驗證 API。這是上面提到的標準，作為Web開發人員，您將與之交互的主要標準。此 API 允許您與瀏覽器（如 Chrome 或 Safari）通信，以請求生物識別和其他身份驗證方式。

第二個是CTAP2，它規定了瀏覽器如何與所謂的身份驗證器交互。身份驗證器是使用加密確定性對用戶進行身份驗證的硬件。在生物識別方案中，這可能是 iOS 設備或 Windows Hello。一般來說，作為Web開發人員，您不會關心此標準，因為瀏覽器將您與它隔離開來，但值得知道它是混合的。

如果您對WebAuthn和CTAP2如何交互感到困惑，這里有一個圖表。在此圖中，用戶是笑臉，橙色框是TouchID或Android指紋傳感器等身份驗證器，白色地球是瀏覽器，藍色框是網站。

WebAuthn 協議涉及瀏覽器到網站的通信，CTAP2 協議解決瀏覽器和身份驗證器之間的通信。

最后，最后但并非最不重要的一點是，FIDO2 是傘形標準。FIDO2包括CTAP2和WebAuthn。（CTAP1 是 CTAP 的第一個版本，支持向后兼容。

什么是身份驗證器？

身份驗證器是實際執行生物識別或其他形式的身份驗證的器。雖然本文重點介紹生物識別身份驗證，但身份驗證器提供了其他方法來對用戶進行身份驗證。每個身份驗證器的核心是一種生成和存儲公鑰/私鑰對的方法。公鑰與 Web 應用程序共享，私鑰由身份驗證器安全保存。

身份驗證器可以在硬件或軟件中實現，但建議僅將軟件身份驗證器（例如Chrome DevTools 中提供的身份驗證器）用于測試，而不建議用于生產用途。

身份驗證器主要分為兩類，跨平臺和平臺。跨平臺身份驗證器可以在多個設備上使用。平臺身份驗證器綁定到特定設備，例如電話。大多數以消費者為中心的生物識別身份驗證器都集成到iOS，Android或Windows等操作系統中。這意味著它們綁定到給定設備，因此是平臺身份驗證器。

身份驗證器的另一個重要方面是它們是測試用戶狀態還是用戶驗證。用戶狀態僅表示某人可能通過單擊按鈕與身份驗證器進行了交互（此交互稱為“授權手勢”）。如果在多重身份驗證過程中使用身份驗證器，則此類狀態測試非常有用。

另一方面，用戶驗證可以保證進行身份驗證的用戶實際上是我們認為的用戶。這可以通過提供他們知道的東西來完成，或者在生物識別情況下，使用用戶的屬性，例如他們的臉的尺寸。在大多數情況下，您會對用戶驗證感興趣，這是常見的生物識別身份驗證器提供的功能。

選擇，選擇

由于 WebAuthn API 的抽象，您無法確定用戶是否通過生物識別進行身份驗證。你可以采取某些措施來鼓勵它，但你不能強迫它。

但是，與流行操作系統綁定的生物識別身份驗證是WebAuthn兼容硬件的一種非常普遍的形式，因此，如果您鼓勵用戶設置WebAuthn登錄，他們很可能會使用生物識別技術。您也可以通過網站上的消息傳遞來鼓勵這樣做。

即使他們不使用生物識別技術，如果您使用 WebAuthn，您也可以放心，他們將使用安全的硬件解決方案來滿足他們的身份驗證需求。

如果 WebAuthn 身份驗證成功，您將不知道使用了什么方法。您可以控制的內容：

如果您希望使用跨平臺或平臺身份驗證器。

請求用戶狀態或用戶驗證。

接下來，讓我們更深入地了解使用支持 WebAuthn 的生物識別方法登錄的用戶的流程。

什么是“儀式”？

如果你讀過關于WebAuhn的文章，你可能會聽到“儀式”這個詞。在WebAuthn的上下文中，儀式是軟件，硬件和物理實體（如人類或設備）之間的規定交互。您可以將儀式視為擴展到物理世界的網絡協議。

WebAuthn 中定義了兩種類型的儀式，生物識別身份驗證都需要這兩種儀式才能與您的 Web 應用程序配合使用。

注冊

第一個儀式是注冊，身份驗證器在您的網站上注冊。同樣，您的網站已向身份驗證器注冊。注冊的最終結果是一個證書，用于以后的儀式。

要注冊身份驗證器，請使用以下代碼：

navigator.credentials.create(options);

如上所述，讓我們更詳細地了解這一點。對象如下所示：options

options =  {
  publicKey: {
	rp: { id: "cosmosclownstore.com",
      	name: "Cosmo’s Clown Store" },
	user: { id: "1234",
        	name: "krusty@example.com",
        	displayName: "Krusty The Clown" },
	challenge: "...",
	pubKeyCredParams: [ { type: "public-key", alg: -7 }],
            authenticatorSelection: {}
	//...
  }
}

讓我們更詳細地看一下這個對象。options

首先，該字段包含有關 Web 應用程序的數據。WebAuthn 包括內置的安全約束，例如：rp

要求所有 API 調用都從 HTTPS 提供的頁面進行。

強制注冊時網站的標識符與當前主機名匹配。

注冊時，如果您希望能夠跨多個子域接受新憑據，則作為 Web 應用開發人員可以指定更廣泛的域。

例如，如果我使用 anof cosmosclownstore.com 注冊，但后來從托管在 app.cosmosclownstore.com 的 Web 應用程序請求生物識別登錄，則將允許。rp.id

但是，如果我使用 anof app.cosmosclownstore.com 注冊，然后嘗試從托管在 store.cosmosclownstore.com 的應用程序啟動生物識別身份驗證會話，則不會。rp.id

其次，您有字段，其中包含有關此用戶的信息。這會將在身份驗證器上創建的憑據綁定到網站上的帳戶。您可能會注意到，這意味著用戶已經在網站上擁有帳戶，并且新的WebAuthn憑據只是另一種身份驗證方式，而不是主要身份驗證方式。這通常是正確的，盡管有些身份驗證器支持稱為“可發現憑據”的東西，這些憑據可以繞過此限制。user

第三，是遠場，這是防止重播攻擊的隨機數。這是一個獨特的高熵字符串，作為 Web 應用程序開發人員必須提供。此質詢將在響應中返回，您必須驗證它們是否相同。challenge

第四，有字段，它表明你有興趣支持什么樣的公鑰算法。數組中對象的值在此IANA 文檔中定義，但 -7（表示帶有 SHA-256 的 ECDSA）保證受支持，這是規范所要求的。pubKeyCredParams

最后，還有 thefield，它可以讓您指示此儀式的身份驗證器的某些屬性。這包括上述跨平臺/平臺類別。authenticatorSelection

構建對象并調用后，身份驗證器將提示用戶為您的網站添加憑據。他們將從對象中看到有關您的網站的信息，以及有關他們在對象中的帳戶的信息。如果他們選擇注冊，您將收到回復。下面是一個示例響應：optionsnavigator.credentials.create(options);rpuser

{
  response: {
    clientDataJSON: { 
      type: “webauthn.create”,
      challenge: ... // should match initial challenge
      origin: ... //
    },
    attestationObject: {
      authData: {
        attestedCredentialData: {
          credentialId: ..., 
          credentialPublicKey: ...,
        }
      }, // other stuff about attestation 
    }
  }
}

The interesting parts are the object, which has a couple of fields you should validate, including the , , and . Make sure these are as expected.clientDataJSONtypechallengeorigin

成功注冊的確認發生在對象中，其中包括和。這些值必須與用戶帳戶相關聯;它們將在下一個儀式（身份驗證）中使用，這將在下面詳細討論。attestationObject.authData.attestedCredentialDatacredentialIdcredentialPublicKey

就像用戶名/密碼憑據一樣，多個用戶可以在給定的網站上使用生物識別身份驗證進行注冊。下面，Cosmo's Clown Store的網站保存著來自多個用戶身份驗證器的公鑰：

每個身份驗證器都有一個私鑰和一個相應的公鑰，位于已注冊的站點上。

但是，至關重要的是，每個不同的網站在同一身份驗證器上獲得不同的注冊和憑據（也稱為“密鑰”）。下面，多個網站持有一個公鑰，與單個用戶的身份驗證器上的許多私鑰之一匹配：

身份驗證器可以保存多個私鑰，每個私鑰對應于不同的網站。

認證

一旦您的用戶注冊了生物識別身份驗證方法，他們現在就可以使用面部或指紋登錄。要提示生物識別登錄，請使用以下 JavaScript：

navigator.credentials.get(options);

同樣，對象是關鍵的。下面是一個示例對象：optionsoptions

credentialId = // value pulled from data stored at registration 

options = {
  publicKey: {
	rpId: "cosmosclownstore.com",
	challenge: "...",
	userVerification: "preferred",
	allowCredentials: [{ type: "public-key", id: credentialId }]
	//...
  }
}

在這里，這是之前注冊的網站標識符。質詢又是一個隨機字符串。指定我們是要驗證用戶還是只測試用戶狀態。rpIduserVerification

該字段包括此登錄名允許的憑據列表。的值由服務器在注冊過程中存儲。因此，在發出請求之前，必須有其他方法來標識用戶，以便可以從服務器端數據存儲區檢索正確的憑據 ID。allowCredentialscredentialIdnavigator.credentials.get(options);

選項包括：

在他們注冊時設置 cookie

詢問他們的用戶名

構建對象并發出請求后，將返回響應。這可能看起來像這樣：optionsget

{
  authenticatorData: {
	rpIdHash : ..., // hash of the requesting party Id
	flags : ..., // bit array including authentication results
	// other info
  },
  clientDataJSON: {
	type: "webauthn.get",
	challenge: ... // should match initial challenge
  }
}

與注冊儀式類似，驗證對象中的值（例如the和the），以確保它們是您所期望的。challengetypeclientDataJSON

此外，檢查 the以確保該值與請求中呈現的 SHA256 哈希匹配。此值是瀏覽器看到的哈希值。如果它與 Web 應用程序顯示的不同，則可能會受到中間人攻擊。authenticatorData.rpIdHashrpIdrpId

最后，該字段是一個位字段，其中包含身份驗證的結果。如果用戶在場，則設置位 0，如果用戶已驗證，則設置位 2。authenticatorData.flags

儀式之外

在沒有大量集成工作的情況下將生物識別身份驗證集成到您的 Web 應用程序中非常酷，特別是因為現在幾乎每個擁有智能手機的人口袋里都有這樣的身份驗證器。

但是，要構建完整的生物識別登錄系統，還有其他工作要做。需要注意的其他事項：

除非您執行超出規范的某些操作（由中央服務器管理的“密鑰”），否則每個憑據都綁定到特定的身份驗證器。這意味著，雖然生物識別身份驗證作為一種替代身份驗證方法很好，但它不應該是唯一的方法，除非您有一個強大的帳戶恢復過程。否則，丟失的手機將意味著帳戶被遺棄。

雖然注冊和登錄用戶的 JavaScript 代碼非常簡單，但需要做一些工作來確定用戶是否具有有效的生物識別身份驗證器，在注冊后安全地存儲憑據，并提示用戶使用其生物識別憑據登錄。這個腳手架是必需的，但我還沒有看到可以幫助它的庫;準備好編寫自己的邏輯。

如上所述，您可以將 WebAuthn 用作 MFA 過程的第二部分。它具有非常抗網絡釣魚的能力，因為您必須擁有身份驗證器才能完成身份驗證儀式。