如何将 webauthn 与 iOS 一起使用并做出反应？

Question

if (navigator.credentials && window.PublicKeyCredential) {
      const available = await window.PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable();
      if (available) {
        const newCredentialInfo = await navigator.credentials.create(options);
        var response = newCredentialInfo.response;

        var clientExtensionsResults = newCredentialInfo.getClientExtensionResults();
        alert(JSON.stringify(response))
        alert(JSON.stringify(clientExtensionsResults));
      }
      else {
        alert("Unsupported");
      }
    }

只允许我使用私钥（usb 或 smthg。但是如果我将此 options.publicKey 与 JavaScript 和 html 一起使用，一切正常。它让我可以使用 FaveID授权，但响应为空。

我的选择是


{"rp":{"id":"https://im-faceid.netlify.app","name":"netlify.app"},"user":{"id":{"0":97,"1":87,"2":120,"3":53,"4":89,"5":87,"6":49,"7":118,"8":99,"9":109,"10":82,"11":104,"12":99,"13":50,"14":57,"15":50},"name":"test","displayName":"Test User"},"challenge":{"0":79,"1":72,"2":78,"3":122,"4":101,"5":71,"6":86,"7":111},"pubKeyCredParams":[{"type":"public-key","alg":-7}],"authenticatorSelection":{"authenticatorAttachment":"platform","requireResidentKey":false,"userVerification":"required"},"attestation":"none","timeout":15000}

Answer 1

我看到您在 <App /> 组件的 componentDidMount() 中调用 navigator.credentials.create()。 macOS 和 iOS Safari 都要求 WebAuthn API 调用 想要使用 Touch ID 必须作为“用户手势”的结果：

The amount of unsolicited prompts has been surprisingly low. The situation is different with the release of Face ID and Touch ID for the web. So, Face ID and Touch ID for the web require user gestures to function. (User gestures are not required for security keys for backward compatibility.)

有关更多指导，请参阅 Apple 对 WebAuthn 支持的介绍：https://webkit.org/blog/11312/meet-face-id-and-touch-id-for-the-web/

如果您更新 React 代码以将调用 navigator.credentials.create() 的逻辑移动到按钮点击处理程序中，您将能够使用 Face ID。它需要您单击一个按钮来触发 WebAuthn，而不仅仅是加载页面，但这就是在 Apple OS.

上使用 WebAuthn 的现实

如何将 webauthn 与 iOS 一起使用并做出反应？

How to use webauthn with iOS and react?

javascript

ios

reactjs

webauthn

face-id