# Fixing Crypto.subtle is available only in secure contexts (HTTPS)

{% hint style="success" %}
Starting with oidc-spa 8.6.18, polyfills for Crypto.subtle are automatically loaded when needed.

Nothing to do, evrything will work even if your app is deployed without SSL.
{% endhint %}

`oidc-spa` internally relies on the [`Crypto.subtle`](https://developer.mozilla.org/en-US/docs/Web/API/SubtleCrypto) browser API for cryptographic operations.\
This API is only available when your app is served over **HTTPS** or from **localhost**.

However, in certain **intranet** environments, for example, when using a local DNS entry or static IP, setting up HTTPS might not be feasible.

In those cases, you can work around the issue by installing a polyfill such as [**webcrypto-liner**](https://www.npmjs.com/package/webcrypto-liner).

***

## 1. Install the polyfill

```bash
npm install --save webcrypto-liner-shim
```

***

## 3. Import the shim

{% tabs %}
{% tab title="Framework Agnostic" %}

<pre class="language-typescript" data-title="src/oidc.ts"><code class="lang-typescript">import { createOidc } from "oidc-spa/core";

<strong>if( crypto.subtle === undefined ){
</strong><strong>    await import("webcrypto-liner-shim");
</strong><strong>}
</strong>
const oidc = await createOidc({
    issuerUri: "...",
    clientId: "..."
});
</code></pre>

{% endtab %}

{% tab title="React" %}
{% code title="src/oidc.ts" %}

```typescript
import { oidcSpa } from "oidc-spa/react-spa";

export const {
    bootstrapOidc,
    //...
} = oidcSpa
    .withExpectedDecodedIdTokenShape({ /*...*/ })
    .createUtils();

(async ()=> {

    if( crypto.subtle === undefined ){
        await import("webcrypto-liner-shim");
    }

    bootstrapOidc({
          implementation: "real",
          issuerUri: import.meta.env.VITE_OIDC_ISSUER_URI,
          clientId: import.meta.env.VITE_OIDC_CLIENT_ID
    });

})();

// ...

```

{% endcode %}
{% endtab %}
{% endtabs %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.oidc-spa.dev/docs/v8/resources/fixing-crypto.subtle-is-available-only-in-secure-contexts-https.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
