> For the complete documentation index, see [llms.txt](https://plutolabs.gitbook.io/plutoframework/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://plutolabs.gitbook.io/plutoframework/make-your-application/polkadotextensionwebview.md).

# PolkadotExtensionWebView

Allows you to load any web dApp in a WebView and inject the hot-wallet that is present in the c# code into the javascript app via the <https://github.com/polkadot-js/extension>.

## How it works

Each polkadot web based application uses [Polkadot.js extension](https://github.com/polkadot-js/extension) to connect a browser extension wallet (like Talisman extension, ...). This approach is highly recommended, because anyone with a compatible browser extension wallet can connect to the web based dApp without exposing their seed-phrase.

The way these browser extensions establish a connection is simple: They use javascript injection technique to inject their own "wallet code" that allows access to the seed-phrase, signing logic, etc...

That means PlutoFramework needs to do the same thing. It takes the web dApp javascript code and it injects its own code with the "wallet code" exactly according to the Polkadot.js extension specification.

The difference is that this "wallet code" actually does not contain any wallet, nor a signing code. It injects a javascript code that allows a hybrid code communication between javascript and C#. So, the injected code only acts as a wallet, but the actually wallet code is written in c# as part of the PlutoFramework and it uses [HybridWebView](https://learn.microsoft.com/en-us/dotnet/maui/user-interface/controls/hybridwebview?view=net-maui-10.0) to communicate between c# and javascript languages.

## Usage

```xml
xmlns:webview="clr-namespace:PlutoFramework.Components.WebView;assembly=PlutoFramework"
...
<webview:PolkadotExtensionWebView
    AbsoluteLayout.LayoutBounds="0.5, 0.5, 1, 1"
    AbsoluteLayout.LayoutFlags="All"
    Source="<dapp_url>"/>
```

Or you can also use the ExtensionWebViewPage to display the website in a fullscreen browser page:

```csharp
using PlutoFramework.Components.WebView;
// ...

var dAppUrl = "<dapp_url>";

await Shell.Current.Navigation.PushAsync(new ExtensionWebViewPage(dAppUrl));
```

## Allow origin

<figure><img src="/files/deC1NbVGJQMPZpjCEP2M" alt="" width="312"><figcaption></figcaption></figure>

Before actually using the wallet code, user needs to confirm that they want to connect to the web dApp.

If you as a developer trust certain origins (like your own websites), you can include them in the ResourceDictionary:

```xml
<x:Array x:Key="AllowedOrigins" Type="{x:Type x:String}">
    <x:String>https://polkadot.js.org/apps/</x:String>
    <x:String>your dApp</x:String>
</x:Array>
```

## ExtensionWebViewPage

<figure><img src="/files/d9nN8RO0OzAZ9qA369qg" alt="" width="315"><figcaption><p>Polkassembly example</p></figcaption></figure>

The ExtensionWebViewPage can be used if you want a default browser experience, where users can:

* Navigate back at any time
* See the actual URL of the website
* Search for any other website
* Reload


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://plutolabs.gitbook.io/plutoframework/make-your-application/polkadotextensionwebview.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.
