​
Obtaining the Live View URL

Anchor Browser offers a live view feature that allows you to embed an interactive frame of a website as a web element.

​
Headful (Reommended)

Headful mode provides a single URL to view the full chrome view, including the address bar. This also ensurese the presented tab is always the active tab.

Browsers are headful by default.

Then, use the create-session response to embed the live view URL directly into an iframe:

<iframe src="{{live_view_url}}" sandbox="allow-same-origin allow-scripts" allow="clipboard-read; clipboard-write" style="border: 0px; display: block; width: 100%; height: 100%; position: absolute; top: 0px; left: 0px;"></iframe>

​
Headless

To create a browser in headless mode, set the headless parameter to false when creating a session.

{
  "browser: 
  {
    "headless": true
  }
}

To obtain the browser live session URL, start by creating a session

The live_view_url points to the browser default first page. If your browser proccess involves creating a new page, collect the corresponding URL by using the live view URLs endpoint.

Then, use the create-session response to embed the live view URL directly into an iframe:

<iframe src="https://anchorforge.io/devtools-frontend/inspector.html?wss={{live_view_url}}" sandbox="allow-same-origin allow-scripts" allow="clipboard-read; clipboard-write" style="border: 0px; display: block; width: 100%; height: 100%; position: absolute; top: 0px; left: 0px;"></iframe>

​
Advanced Embedding Configuration

​
Embed in Fullscreen View (Hide Navigation Bar)

To use the fullscreen view, replace the live view URL with the following:

<iframe src="https://anchorforge.io/devtools-frontend/inspector-fullscreen.html?wss={{live_view_url}}" ...></iframe>

​
Disable browser interactivity

To prevent the end user from interacting with the browser, add the style="pointer-events: none;" attribute to the iframe:

<iframe ... style="... pointer-events: none;"></iframe>