---
title: Prerequisites
description: "\"Describes prerequisites for using the PingOne Recognize Web SDK.\""
component: recognize
page_id: recognize:web-sdk:web-sdk-prerequisites
canonical_url: https://docs.pingidentity.com/recognize/web-sdk/web-sdk-prerequisites.html
llms_txt: https://docs.pingidentity.com/recognize/llms.txt
docs_for_agents: https://developer.pingidentity.com/build-with-ai/docs-for-agents.md
section_ids:
  run-as-module: Run as module
  webassembly-bundling: WebAssembly bundling
  security-headers: Security headers
---

# Prerequisites

The PingOne Recognize Web SDK requires three conditions, involving module loading, bundling, and the use of security headers.

## Run as module

The Web SDK includes two modules:

* `@keyless/sdk-web`

* `@keyless/sdk-web-components`

The entry point for each module is `index.js`.

Each module must be loaded as a JavaScript module, as shown in the following examples:

* Headless

* Web components

```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</title>
  </head>
  <body>
    <script type="module">
      import { ... } from '@keyless/sdk-web/index.js'
    </script>
  </body>
</html>
```

```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>
```

## WebAssembly bundling

When using a bundler to build your web app, verify that it supports `.wasm` files.

## Security headers

|   |                                                                                                                                   |
| - | --------------------------------------------------------------------------------------------------------------------------------- |
|   | This requirement applies only when using multi-threading. Learn more in [Multi-threading](web-sdk-reference-multi-threaded.html). |

The Web Assembly module requires two security headers to run. If the header values are incorrect, you won't be able to use the PingOne Recognize Web SDK.

| Name                         | Value        |
| ---------------------------- | ------------ |
| Cross-Origin-Embedder-Policy | require-corp |
| Cross-Origin-Opener-Policy   | same-origin  |

Common issues include missing headers or headers with invalid values.

When loading resources from an external domain, use the `crossorigin` attribute. For details, refer to [Cross-Origin-Embedder-Policy: Avoiding COEP Blockage With CORS](https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Cross-Origin-Embedder-Policy#avoiding_coep_blockage_with_cors).
