DocumentationAPI Reference
DocumentationAPI ReferenceOpenAPIStatus
DocumentationAPI ReferenceOpenAPIStatus

Troubleshooting common issues

ReferenceError: self is not defined when using next.js

The Persona JS SDK does not support server rendering. Add the following snippet:

import dynamic from "next/dynamic";

export const PersonaInquiry = dynamic(
  () => import('persona').then((module) => module.Inquiry),
  {ssr: false}
);

Refused to display 'https://withpersona.com/' in a frame because it set 'X-Frame-Options' to 'deny'

What this means

This error message is a result of a security feature that Persona offers when you integrate Persona using Embedded Flow.

Persona lets you specify, via an allowlist, which domains can load the embedded flow. You should specify only the domains where you embed your Persona flow. Potential attackers will then be blocked from embedding and loading your flow on their domain.

If you see this error, it means that the domain the embedded flow in being loaded on is not on the allowlist.

How to fix

If you see this error, go to the Embedded Flow integration page in the Persona Dashboard, and locate "Step 3 Configure allowed domains". Here, you'll see the Domain allowlist.

Ensure that:

  1. The domain from which you are trying to load the Embedded Flow (and where you're seeing the error message) is on the Domain allowlist.
  2. The domain in the Domain allowlist is correctly spelled and properly formatted. Note: a domain name should NOT include the http:// or https:// part of the URL.

If you are testing, please note:

  • localhost is enabled by default for Inquiries created in your Sandbox environment. localhost must be manually added to be usable for Production inquiries.

If you have a more complex setup, please note:

  • If your embedded flow is loaded on a webpage that is itself loaded as an iframe on another parent webpage, you must specify all parent origins by setting the frameAncestors option in the JS SDK. See Parameters for details.

I am encountering issues when using the Embedded Integration with WebView

We do not recommend using the Embedded Integration with WebView. If your implementation must use WebView, we recommend using our WebView Flow directly, which will have lower overhead than placing the Embedded Integration within a WebView.

Using the Embedded Integration together with WebView may lead to performance problems in the Inquiry Flow.

I am running into issues when testing locally

If testing locally, ensure your webpage is served by a local web server instead of being opened as a static file. This is due to the origin for local files (file://) not being a valid origin for window.postMessage(), which the Persona flow uses to communicate with your code.

For example:

python -m http.server
open http://localhost:8000/your_html_file.html

Updated 28 days ago