fix: add section on webauthn constraints (#2072)

ory · Dec 17, 2021 · 23663b5 · 23663b5
1 parent 3cf12ae
commit 23663b5
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 30 deletions.
diff --git a/docs/docs/guides/2fa.mdx b/docs/docs/guides/2fa.mdx
@@ -333,12 +333,6 @@ cryptography instead of a password. Common use cases for WebAuthn are
 - using an Operating System "platform module" (e.g. TouchID, FaceID, Windows
   Hello Face, Android Biometric Authentication, ...)
 
-:::info
-
-WebAuthN is a Browser standard. It does not work on native mobile apps!
-
-:::
-
 Configuring WebAuthn correctly is imperative, because the authentication will
 fail if something is not configured correctly.
 
@@ -365,15 +359,6 @@ WebAuthn prompt:
 
 ![WebAuthn Prompt](../images/webauthn/1.png)
 
-:::info
-
-Please be aware that implementing WebAuthN in your own UI can be challenging,
-depending on which framework to use. Please check our
-[reference implementations](./custom-ui.mdx) to see how we solved it for
-different app types (web, single page app).
-
-:::
-
 ### Writing E2E Tests
 
 You will need a browser to run E2E tests using WebAuthn. Take a look at our
@@ -382,6 +367,24 @@ for [Cypress](https://www.cypress.io). You can find more information about the
 approach for Cypress in
 [cypress#6991](https://github.com/cypress-io/cypress/issues/6991#issuecomment-612888645).
 
+### WebAuthN Constraints
+
+There are some limitations to WebAuthN to be considered in development:
+
+- WebAuthN is a Browser standard. It does not work on native mobile apps.
+
+- WebAuthN is limited to one domain and does not work in a local environment
+  when using CNAME / Ory Proxy.  
+  WebAuthN uses an `https://origin` URL as part of the client<->server
+  challenge/response mechanism. This mechanism allows for only one URL as the
+  origin. Read more in the [WebAuthN guide](https://webauthn.guide/) and on
+  [GitHub](https://github.com/w3c/webauthn/issues/1372).
+
+- Implementing WebAuthN in your own UI can be challenging, depending on which
+  framework to use. Please check our
+  [reference implementations](./custom-ui.mdx) to see how we solved it for
+  different app types (web, single page app).
+
 ## Build Your Own UI
 
 The major benefit of Ory Kratos is that you can bring your own login,

diff --git a/docs/versioned_docs/version-v0.8/guides/2fa.mdx b/docs/versioned_docs/version-v0.8/guides/2fa.mdx
@@ -333,12 +333,6 @@ cryptography instead of a password. Common use cases for WebAuthn are
 - using an Operating System "platform module" (e.g. TouchID, FaceID, Windows
   Hello Face, Android Biometric Authentication, ...)
 
-:::info
-
-WebAuthN is a Browser standard. It does not work on native mobile apps!
-
-:::
-
 Configuring WebAuthn correctly is imperative, because the authentication will
 fail if something is not configured correctly.
 
@@ -365,15 +359,6 @@ WebAuthn prompt:
 
 ![WebAuthn Prompt](../images/webauthn/1.png)
 
-:::info
-
-Please be aware that implementing WebAuthN in your own UI can be challenging,
-depending on which framework to use. Please check our
-[reference implementations](./custom-ui.mdx) to see how we solved it for
-different app types (web, single page app).
-
-:::
-
 ### Writing E2E Tests
 
 You will need a browser to run E2E tests using WebAuthn. Take a look at our
@@ -382,6 +367,18 @@ for [Cypress](https://www.cypress.io). You can find more information about the
 approach for Cypress in
 [cypress#6991](https://github.com/cypress-io/cypress/issues/6991#issuecomment-612888645).
 
+### WebAuthN Constraints
+
+There are some limitations to WebAuthn to be considered in development:
+
+- WebAuthN is a Browser standard. It does not work on native mobile apps.
+
+- WebAuthN is limited to one domain and does not work in a local environment when using CNAME / Ory Proxy.  
+WebAuthN uses an `https://origin` URL as part of the client<->server challenge/response mechanism. This mechanism allows for only one URL as the origin. Read more in the [WebAuthN guide](https://webauthn.guide/) and on [GitHub](https://github.com/w3c/webauthn/issues/1372).
+
+- Implementing WebAuthN in your own UI can be challenging, depending on which framework to use. Please check our [reference implementations](./custom-ui.mdx) to see how we solved it for
+different app types (web, single page app).
+
 ## Build Your Own UI
 
 The major benefit of Ory Kratos is that you can bring your own login,