PC WebView

WebView Component	Supported PNTSDK Version	WebView Engine
INTLWebView2	Version V1.23.00 and later	Microsoft Edge WebView2
INTLWebView (Deprecated)	Version V1.29.00 and earlier	Tencent internal tbs component

WebView Configuration

Before using the PC WebView interface, integrate the SDK and configure the WebView module in the INTLConfig.ini file according to the information below.

Field	Description	Note
WEBVIEW_DEFAULT_WIDTH	Percentage of Windows login WebView width relative to screen pixels Unit: %	Required on Windows
WEBVIEW_DEFAULT_HEIGHT	Percentage of Windows login WebView height relative to screen pixels Unit: %	Required on Windows
WEBVIEW_NAVIGATION_BUTTON_DISABLE	Whether to disable the back and system browser buttons, Windows only. Default: 0, not disabled.	Required on Windows
WEBVIEW_UI_COLOR_THEME	Framework style for WebView (dark/light), Windows only. Default: dark.	Required on Windows
WEBVIEW_VIEWPORT_DPI	WebView dots per inch, sets browser width and height, Windows only Default: 96	Required on Windows
WEBVIEW_ALWAYS_ON_TOPMOST_WINDOW	WebView is always on top, Windows only Default: 0, not always on top.	Optional on Windows
WEBVIEW_ACCEPTED_LANGUAGE_LIST	Provides language support for WebView on web pages, Windows only For more info on multilingual configuration, see Language Table Default: en-US, zh-CN, ja-JP, ko-KR	Optional on Windows
WEBVIEW_SHARE_BUTTON_DISABLE	Hide/show the share (open in system browser) button Windows only Default value: 0, show the share (open in system browser) button; 1: hide the share (open in system browser) button 0: show the share (open in system browser) button	Optional on Windows

| Windows Optional | | INTL_WEBVIEW2_ENABLE | Enable Microsoft Edge WebView2 to embed web content in native applications, Windows only
Default value: 1, enables INTLWebView2;
0: Enable INTLWebView
1: Enable INTLWebView2 | Windows Optional For Player Network SDK V1.29.00 and earlier versions, the default value for this configuration is 0|

Using INTLWebView2

Player Network SDK supports WebView2 starting from version V1.23.00.To use related features, select INTLWebView2 when downloading Player Network SDK, download the corresponding plugin, and enable the relevant settings in the INTLConfig.ini file:

[WebView]
INTL_WEBVIEW2_ENABLE=1

note

For Player Network SDK V1.29.00 and earlier, the default value for INTL_WEBVIEW2_ENABLE is 0; for V1.30.00 and later, the default value is 1

Differences between INTLWebView and INTLWebView2

INTLWebView and INTLWebView2 can be switched with the toggle configured in INTLConfig.ini. Both interfaces are consistent on Unity and Unreal Engine.

The main differences are in UserAgent and the JavaScript interface for communication between web pages and games, as shown in the table below:

	INTLWebView	INTLWebView2	Note
UserAgent	INTLBrowser/1.23.999.529 (Windows; 11)	Microsoft-WebView2 INTLBrowser/1.23.999.529 (Windows; 11)	INTLWebView2 includes Microsoft-WebView2 in its identifier.
JavaScript Communication Interface	window.tbs_external.nativeCall	window.chrome.webview.postMessage	The way JavaScript sends messages to the game.

Sample communication between webpage JavaScript and game

• When opening a webpage in WebView on Windows, use the UserAgent to distinguish between INTLWebView and INTLWebView2.
• According to the distinction by UserAgent, call the corresponding interface to send messages to the game interface. INTLWebView uses window.tbs_external.nativeCall (accepts 2 parameters), while INTLWebView2 uses window.chrome.webview.postMessage (accepts 1 parameter).
• The second parameter of window.tbs_external.nativeCall and the first parameter of window.chrome.webview.postMessage are the data sent to the client (referred to below as data), which is in JSON format.
• The data (in JSON format) contains a key-value pair with INTLMethod as the key, representing the required action for the client.
• The first parameter of window.tbs_external.nativeCall matches the value of the INTLMethod key in the data (JSON format).

The following is a webpage JavaScript example:

<script>
function isWindowsPC(){
    var ua = navigator.userAgent;
    return SubStrSearch('Windows;', ua) != -1 && 
    SubStrSearch('INTLBrowser', ua) != -1;
}
    
function INTLCallNative(data){
    if (isWindowsPC()) {
        var agent = navigator.userAgent;
        if (agent.indexOf("Microsoft-WebView2") >= 0
        && agent.indexOf("INTLBrowser/") >= 0){
            // Using INTLWebView2
            window.chrome.webview.postMessage(data);
        } else {
            // Using INTLWebView
            var obj = JSON.parse(data);
            window.tbs_external.nativeCall(obj['INTLMethod'], [data]);
        }
    }
}
var SetFullScreen = '{"INTLMethod":"setFullScreen","isFullScreen":true}';
</script>

<input type="button" value="Set WebView full screen" onclick="INTLCallNative(SetFullScreen)" />

For more examples, see INTLWebViewSample.html.

Web-based acquisition of GuestId

INTLWebView

Webpage sends a request and receives GuestId:

<script>
window.tbs_external.nativeCallEx("getGuestId", ['{"INTLMethod":"getGuestId"}'], function (res) { alert(res); });
</script>

INTLWebView2

• Webpage sends a request:

<script>
window.chrome.webview.postMessage('{"INTLMethod":"getGuestId"}');
</script>

• Webpage receives GuestId:

<script>
var agent = navigator.userAgent;
if (agent.indexOf("Microsoft-WebView2") >= 0
    && agent.indexOf(" INTLBrowser/") >= 0)  {
    window.chrome.webview.addEventListener('message', arg => {
        var obj = JSON.parse(arg.data);
        var method = obj['INTLMethod'];
        if ('getGuestId'.toLowerCase() == method.toLowerCase()){
            var guestID = obj['guestId'];
            alert(guestID);
        }
    });
}
</script>

For more examples, see INTLWebViewSample.html.

INTLWebView2 System Requirements

Supports the following programming environments:

• Win32 C/C++
• .NET Framework 4.6.2 or later
• .NET Core 3.1 or later
• .NET 5 or later
• WinUI 2.0
• WinUI 3.0

WebView2 applications can run on the following versions of Windows:

• Windows 11
• Windows 10
• Windows 10 IoT Enterprise LTSC x32 2019
• Windows 10 IoT Enterprise LTSC x64 2019
• Windows 10 IoT Enterprise 21h1 x64
• Windows Server 2022
• Windows Server 2019
• Windows Server 2016

For more details, see Supported Platforms.

Check If WebView2 Runtime Is Present On The User's PC

Since INTLWebView2 depends on Microsoft WebView2, when releasing a game using INTLWebView2 you must ensure that the user's PC already has the WebView2 runtime installed:

Method 1: Check the registry

If the user's computer has the WebView2 runtime installed, at least one of the following registry locations contains a pv (REG_SZ) key, and the value must be greater than 0.0.0.0.If neither location contains a pv (REG_SZ) key, or if only one location exists but its value is null, an empty string, or 0.0.0.0, then the client does not have the WebView2 runtime installed. You can check the pv (REG_SZ) key to detect if WebView2 is installed, and obtain the version of the WebView2 runtime.

The two registry locations to check on 64-bit Windows:

HKEY_LOCAL_MACHINE\SOFTWARE\WOW6432Node\Microsoft\EdgeUpdate\Clients\{F3017226-FE2A-4295-8BDF-00C3A9A7E4C5}

HKEY_CURRENT_USER\Software\Microsoft\EdgeUpdate\Clients\{F3017226-FE2A-4295-8BDF-00C3A9A7E4C5}

Method 2: Programmatic check

The following interface returns version information for the WebView2 runtime or Microsoft Edge preview builds (Beta, Dev, Canary), which can be used to determine if the user's PC already has the WebView2 runtime environment.For details on GetAvailableCoreWebView2BrowserVersionString, see Get started with WebView2 in Win32 apps

#include<WebView2.h>

bool IsWebViewRuntimeAvailable() {
  LPWSTR version_info;
  GetAvailableCoreWebView2BrowserVersionString(nullptr, &version_info);
  return version_info != nullptr;
}

For details, see Detect if a suitable WebView2 runtime is already installed.

WebView2 Runtime Deployment

note

The following content is quoted from the official Microsoft Edge WebView2 website. To learn more about WebView2 runtime deployment, see Distribute your application and the WebView2 Runtime.

If you choose to use the WebView2 solution, the game installer process needs to help or guide the user to install the WebView2 runtime environment, guaranteeing normal operation in WebView2 mode.Distribute and update the WebView2 runtime in one of the following two ways:

Method 1: Evergreen Runtime distribution mode

In the Evergreen Runtime distribution mode, the WebView2 runtime is not packaged with the application, but installed on client machines using an online bootstrapper or offline installer. The WebView2 runtime will automatically update on the client computer, and the game does not need to manually update the WebView2 runtime. Microsoft officially recommends the Evergreen distribution mode.

Method 2: Fixed version runtime distribution mode

In the Fixed Version runtime distribution mode, a specific version of the WebView2 runtime is downloaded and packaged with the WebView2 application inside the application package. The WebView2 runtime packaged with the application can only be used by the WebView2 application, and cannot be used by any other applications on the client computer.

For more details, Download the WebView2 Runtime.