将导航器凭据 api 与 phone touch id 结合使用

Question

我正在尝试为 webauthn 创建一个爱好项目 api。我有一个创建凭据的页面，它（正确地）提示我们使用安全密钥。我想使用我的 touchid（在三星 s9 上）或我 mac 上的 touchid 来创建凭据（这似乎不起作用）。 我需要做任何额外的事情才能使用触摸 ID 吗？

下面是创建凭据的代码（我已经更改了域名）。

<script type="text/javascript">
  let randomStringFromServer = `sdflksdf934mnsdfsdfimlsndfbop1asd239dsfsdfkllkjsdf`;

  const publicKeyCredentialCreationOptions = {
    challenge: Uint8Array.from(randomStringFromServer, c =>
      c.charCodeAt(0)
    ),
    rp: {
      name: "Mr Tom",
      id: "helloworld.com"
    },
    user: {
      id: Uint8Array.from("UZSL85T9AFC", c => c.charCodeAt(0)),
      name: "hello@world.com",
      displayName: "MrTom"
    },
    pubKeyCredParams: [{ alg: -7, type: "public-key" }],
    authenticatorSelection: {
      authenticatorAttachment: "cross-platform"
    },
    timeout: 60000,
    attestation: "direct"
  };

  const credential = await navigator.credentials.create({
    publicKey: publicKeyCredentialCreationOptions
  });

  console.log(credential);
</script>

Answer 1

控制此行为的重要一点是：

authenticatorSelection: {
  authenticatorAttachment: "cross-platform"
}

这就是告诉 API 您想要使用外部设备作为验证器。如果你使用 platform 而不是 cross-platform 那么浏览器应该尊重它并尝试使用设备的内置功能。如果没有可用的平台验证器，您可能会立即收到错误消息 - 根据我的经验，要么是 NotAllowedError 要么是 NotSupportedError。

将导航器凭据 api 与 phone touch id 结合使用

Using the navigator credentials api with phone touch id

public-key-encryption

webauthn