capacitor-plugin-xframe

Capacitor plugin to bypass CORS & same origin policy for iframe.

How it works

This plugin overrides the shouldInterceptRequest behavior of your webview to intercept the outgoing requests and modifies the resulted responses by eliminating the X-Frame-Options and Content-Security-Policy headers for them to work in the embeded iframes.

Supported platforms

• Android

Install

npm install capacitor-plugin-xframe
npx cap sync

Config options

Add these options in either capacitor.config.json or capacitor.config.ts.

userAgent

Customize the outgoing requests' User-Agent header. Useful to modify the resulted responses.

{
  ...
  "plugins": {
    "Xframe": {
      "userAgent": "<your_custom_user_agent>"
    }
  }
}

API

• start()
• stop()
• addListener('onLoad', ...)
• addListener('onError', ...)
• Interfaces
• Type Aliases

start()

start() => Promise<void>

Starts intercepting requests to modify responses and remove iframes restrictions.

---

stop()

stop() => Promise<void>

Stops intercepting requests and restores default behavior of the WebView.

---

addListener('onLoad', ...)

addListener(eventName: 'onLoad', listener: LoadEventListener) => Promise<PluginListenerHandle>

Listens to requests of document type and returns some useful information.

Param	Type
eventName	'onLoad'
listener	LoadEventListener

Returns: Promise<PluginListenerHandle>

---

addListener('onError', ...)

addListener(eventName: 'onError', listener: ErrorEventListener) => Promise<PluginListenerHandle>

Listens to failed requests (of any type)

Param	Type
eventName	'onError'
listener	ErrorEventListener

Returns: Promise<PluginListenerHandle>

---

Interfaces

PluginListenerHandle

Prop	Type
remove	() => Promise<void>

LoadEventData

Prop	Type
url	string
title	string
favicon	string

ErrorEventData

Prop	Type
url	string
statusCode	number
message	string

Type Aliases

LoadEventListener

(eventData: LoadEventData): void

ErrorEventListener

(eventData: ErrorEventData): void