Skip to main content

Webview

Create and control embedded HTML interfaces in 3D space. WebViews can float freely or be linked to a VRM character so they follow as the character moves.

For building a React UI with Vite and @hmcs/ui, see WebView UI Setup.

import { Webview, webviewSource } from "@hmcs/sdk";

Static Methods

MethodDescription
Webview.open(options)Create a new webview and return a Webview instance
Webview.list()Get all open webviews
Webview.current()Get the current webview when running inside a webview context

Instance Methods

MethodDescription
close()Close the webview
isClosed()Check if the webview has been closed
info()Get information about the webview
patch(options)Update multiple properties at once
setOffset(offset)Set the position offset
setSize(size)Set the 3D world space dimensions
setViewportSize(size)Set the HTML pixel dimensions
navigate(source)Navigate to a new source
reload()Reload the current content
navigateBack()Navigate back in history
navigateForward()Navigate forward in history
linkedVrm()Get the VRM linked to this webview
setLinkedVrm(vrm)Link this webview to a VRM character
unlinkVrm()Remove the VRM link

Helpers

FunctionDescription
webviewSource.local(id)Create a local asset source
webviewSource.url(url)Create a URL source
webviewSource.html(content)Create an inline HTML source

Type Guards

FunctionDescription
isWebviewSourceLocal(source)Check if a WebviewSource is a local source
isWebviewSourceUrl(source)Check if a WebviewSource is a URL source
isWebviewSourceHtml(source)Check if a WebviewSource is an inline HTML source
isWebviewSourceInfoLocal(source)Check if a WebviewSourceInfo is a local source
isWebviewSourceInfoUrl(source)Check if a WebviewSourceInfo is a URL source
isWebviewSourceInfoHtml(source)Check if a WebviewSourceInfo is an inline HTML source

Next Steps

  • Signals -- Cross-process pub/sub messaging between scripts and WebViews