Prerequisites
The Keyless Web SDK has three conditions that must be met in order for it to run, these conditions mainly revolve around module loading, bundling and security headers.
Run as Module
The main Javascript entrypoint of the @keyless/sdk-web or @keyless/sdk-web-components module which is index.js must be loaded as a module.
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Keyless Web SDK</title>
</head>
<body>
<script type="module">
import { ... } from '@keyless/sdk-web/index.js'
</script>
</body>
</html><!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Keyless Web SDK Components</title>
</head>
<body>
<kl-auth-or-enroll></kl-auth-or-enroll>
<script src="@keyless/sdk-web-components/index.js" type="module"></script>
</body>
</html>Web Assembly Bundling
When building web applications it's extremely common to use a bundler, make sure yours is capable of bundling .wasm files.
Security Headers
The Web Assembly module requires two security headers to run, if these headers are unset or have unfit values you won't be able to use the Keyless Web SDK.
Cross-Origin-Embedder-Policy
require-corp / credentialless
Cross-Origin-Opener-Policy
same-origin
In case you are loading resources from an external domain, make sure to use the credentialless value on the Cross-Origin-Embedder-Policy header.
Last updated
Was this helpful?