Description

Intuiface provides an integrated web browser for navigating the Internet. On Windows, this browser is based on Chromium Version 122, fully supporting HTML5, CSS3, JavaScript, and WebGL. On all other Player platforms, the native device browser is used (e.g. Safari on the iPad).

NOTE

• On all Player-supported platforms but Windows, the Web Browser Asset cannot display websites that reject cross-origin resource sharing (CORS), the embedding of one website domain in another website domain. Exclusively for Android, BrightSign, and iOS, there is an alternative to the Web Browser Asset that enables the display of websites that reject CORS. On Windows, the Web Browser Asset supports CORS.
• On every Player platform except Windows, the URL must use https, not http.

To see the extent of our HTML5 support, add a Web Browser Asset into an Intuiface project and set its URL to http://www.html5test.com.

Preparing the Web Browser Asset for use

Proxy Settings

To customize the proxy settings on Windows, open the Internet Options Control Panel and select the Connections tab. Use the LAN Settings section to update your proxy settings.

Clearing the browser cache

If you need to empty the cache used by the Web Browser Asset, delete all files in the following folders:

• Player %LOCALAPPDATA%\Intuiface\Cache\CEF\
• Composer %LOCALAPPDATA%\Intuiface\Composer\CEF\

Intuiface Version 5.x used an older web rendering engine for the Web Browser Asset. In this case, the location of the cache file is: %TEMP%\Awesomium\Cache.

Properties Triggers & Actions

Properties

Triggers

Actions

Tips and Tricks

Not everything possible in a native Web Browser is possible within Intuiface - see Known Limitations below - but sometimes, there are special methods for making things work.

Some objectives are discussed below. The items in the following list are discussed on this page:

• Open a Google Maps location in full-screen
• Avoid the username/password pop-up dialog box
• Display only relevant portions of the browser using a cropping technique

Manipulate Maps, 3D objects, and 360-degree images or videos

Many Web components enable you to display and interact with 360° panorama (e.g. from krpano) and 3D content. The Web Browser Asset is a solution to embed these kinds of components that are not (yet)  available natively in the Intuiface platform.

3D Model rendering:

The rendering of a 3D model is entirely dependent on the GPU (Graphics card). Having a more powerful graphics card will enable you to manipulate bigger 3D models smoothly. We recommend using a GPU similar to RTX 4070Ti or higher for models with more than 30K facets. Otherwise, reducing the number of facets of your 3D model below 15k will improve performance.

Play Local HTML files on Windows PCs

Although you will typically display cloud-hosted HTML content in the Web Browser Asset, it is also possible—exclusively on Windows PCs—to display local HTML content. For example, you would need to do this if you knew your device would be offline or if the HTML content was only available locally.

The easiest approach to working with local HTML content is to store relative paths to that content in an Excel spreadsheet. This approach is particularly useful if more than one file contains local content.

Through binding, you can associate the Home page property of the Web Browser Asset with the appropriate cell in your Excel file. You can specify which page to display using a filter applied to the Excel spreadsheet.

NOTE:

• To access locally stored files, you must enable the Access local file system property found in the "Security" section of the "Behavior" properties category.
• For security reasons, only specific file extensions in the Interface Asset folder are authorized for experience publishing. See this article for a list of permitted file types.

To see the use of local HTML files in action, download this sample experience.

Opening the Chrome Developer Tools console

As noted above, the heart of the Web Browser Asset is the Chromium Web rendering engine. As with Chrome, Chromium has built-in tools to aid developers in building Web content.

To access the Chrome Developer Tools console, either

• [when using Composer's Play Mode] While holding down the Control and Shift buttons on your keyboard, use your mouse to right-click the Web Browser Asset instance you're interested in.
  [when using Composer's Simulate Player on other platforms Play Mode] Shortcut: Ctrl + Shift+ i
  OR
• [when using Player for Windows or Composer's Play Mode] Open a stand-alone instance of Chrome and browse to the URL http://localhost:8088. Then click the link of the page whose loaded contents you wish to view in the console.

Intuiface Version 5: Choosing between Default and Legacy browser options

In Intuiface Version 5, on Windows PCs only, the Web Browser Asset lets you choose between one of two Web rendering engines. On all other supported Player platforms, there is only one browser option, so the selection of a rendering engine is ignored.

1. Default   It's based on the CefSharp Web rendering engine. This is the style selected by default when adding the Web Browser Asset into your experience. First introduced in Intuiface Version 5.3, this engine is based on a recent version of Chromium, the heart of the Google Chrome browser.
2. Legacy   It is based on the Awesomium Web rendering engine derived from a fairly old version of Chromium.

The only reason to choose Legacy is for backward compatibility with Intuiface experiences built before Intuiface Version 5.3.

To switch between the Default and Legacy options, open either the Quick Properties or All Properties panel, click the icon in the upper left corner of the panel, and select the appropriate option.

Most common issues and how to solve them

The content of your website and the nature of your network impact how you configure Intuiface and/or your device. The following sections highlight these considerations.

Rendering performance settings for Windows devices

Both Composer and Player for Windows enable you to configure performance settings for the Web Browser asset. Read Composer and Player settings for details.

For example, on lower-end devices:

• you should limit the demanded frame rate to 30 FPS vs. 60 FPS. Demanding lower FPS should enhance the rendering performances on lower-end devices.
• rendering through the CPU may be faster than GPU.

The most common Rendering Problems are easily solved by updating your GPU to the latest video drivers.

Touch Related problems

No touch response:

• This could be caused by the touch hardware interface. The following article will help you check the correct functionality of your touch input hardware: How can I determine if my touch display is working correctly on Windows?

Double touch input or inability to scroll:

• Possibly caused by the touch interface settings. If you are using TUIO, ensure your device is not receiving events from both TUIO and HID (Windows native).

Receiving both TUIO and HID simultaneously may cause scroll problems or other touch input behavior, such as double touch events when only using a single tap.

Known limitations

On all platforms

The Intuiface Web Browser asset does not support pop-up windows. 

On Windows PCs

• When multiple instances of Player or Composer are launched simultaneously on the same PC, only the first launched instance will have a persistent cache. All instances launched afterward will use a unique session cache directory located under %LOCALAPPDATA%\Intuiface\Sessions\XXXXX\CEF\

• Using multiple Web Browser Assets in the same scene may cause instability due to high system memory usage. Therefore, it should be avoided when designing experiences.
• The Web Browser asset will always display the English language by default if the language is not specified in the website's URL, regardless of the device's language.
• Authentication on Google-hosted sites and authentication on any other website using Google credentials are not supported.
• The Web Browser Asset will not be rendered correctly when using Remote Desktop Sessions.
• If your Composer or Player on Windows is running on Windows 7, make sure you installed all the latest Windows 7 updates to avoid some web engine errors.
• If the Web Browser asset is somewhere on a multi-screen display other than Screen 1, dropdown lists will not respond to touch events. A mouse would have to be used.
• The "Open URL" action requires the entered URL to be preceded by http:// or https://
• No support for proxies or htaccess authentication
• To permit the use of a responsively designed website, the first <html> or <head> tag of the webpage should not contain any attribute. For example, if your webpage contains tags such as : <html lang=en>, the CSS media queries will be ignored, and responsive capabilities will not work. This snippet of HTML illustrates the correct approach:
  <!DOCTYPE html> <html> <head> <title>My title</title> …
• To adjust the size of a responsive webpage, use the "Webpage width" property of the Web Browser Asset, not the asset's resize handle in Composer's canvas. Only by changing the resolution via the "Webpage width" property will you trigger a responsive adjustment of the webpage layout.
• Some interactive web components, such as Matterport, may not work correctly when using a mouse while interacting using a touch screen will work properly.
• If playing video or audio content, sounds will continue to be heard after closing or hiding the Web Browser asset.
• Zoom level property is shared between multiple Web Browsers in the same scene (even if the zoom values are different).
• The Virtual Keyboard may be displayed for a brief second when loading web pages containing text input or input forms.
• The Virtual Keyboard might not be automatically displayed on pages with Auto-Focused Text Input. In this case, tapping outside and then back to the text input should correctly display the Virtual Keyboard.
• Has been inactive trigger will fire while typing in the web browser's address bar.

On iOS

• URL changes are no longer detected, introducing the following limitations:
  • The navigation bar does not update the starting URL
  • Link is clicked trigger is no longer executed
  • Previous and Next navigations no longer work when using the web browser's controls
• Long Press on any URL displays a "Preview Window", pressing on "Open Link" will open Safari
• No error is returned when navigating to pages with restricted Cross Origins (clicking on such a link causes no reaction).
• Some websites using http protocol are no longer loaded

•  

On Android, ChromeOS, BrightSign, Tizen

• Resources used by the Web Browser asset will only work when referenced using absolute paths. Relative paths to resource files are not supported.
• On all Player-supported platforms but Windows, the Web Browser Asset is unable to display websites that reject cross-origin resource sharing. Nicknamed CORS, cross-origin resource sharing refers to the embedding of one website domain in another website domain. By rejecting CORS, a website is saying it refuses to be embedded inside another web domain.

Exclusively for the iPad and for Android-based devices, there is an alternative to the Web Browser Asset that enables the display of websites that reject CORS. This approach mirrors the current way websites referenced by third-party software like Twitter are displayed on tablets. For more information, see the article about opening websites with CORS restrictions.

NB: This limitation also affects the alternative Player used for Play Mode in Composer, accessed by selecting the menu option Project -> Simulate Player on other platforms (iPad, Android,...).

See also this page for a list of other limitations.

On Samsung SMART Signage Platform.

See this page for any existing limitations.