Model-viewer: Is model-viewer not supported in native Android Webview?

Created on 9 Nov 2019  路  2Comments  路  Source: google/model-viewer

Description

Hi 馃憢
Is model viewer supported on WebView components in an Android app?

Trying to play around with <model-viewer> and it looks great on Android devices Chrome browser (with the sample html code). I couldn't find any information to know if it was also supported in the Android native app WebView component via a local html file being loaded via webview.loadData(myHtmlWithCSS, "text/html", null). I managed to launch the html (I tested with test headers like h1, h2, h3) but the <model-viewer> doesn't load with its progress bar.

The Webview component I used also supports WebGL, tested with these sites:
https://get.webgl.org/
https://webglreport.com/

Also enabled Javascript:
webView.settings.javaScriptEnabled = true

Browser Affected

  • [ ] Chrome
  • [ ] Edge
  • [ ] Firefox
  • [ ] Helios
  • [ ] IE
  • [ ] Safari

OS

  • [x] Android (Android 10 (Q), Android 9 (Pie))
  • [ ] iOS
  • [ ] Linux
  • [ ] MacOS
  • [ ] Windows

Versions

  • model-viewer: v0.7.2
  • fullscreen-polyfill: v1.0.2
  • focus-visible: v5.0.2
  • three.js: rXX (did not use)

Most helpful comment

@cdata Thanks for confirming! I found the issue which is related to Webview itself. It is hard to debug but I found out that using the method webview.loadData(myHtmlWithCSS, "text/html", null) is not going to work thanks to this stackoverflow question.

For anyone else having issues loading a local HTML string into the webview instead of loading a URL, try this solution:
Use webview.loadDataWithBaseURL(baseUrl, yourHTML, mimetype, encoding, historyUrl);

All 2 comments

@Cherubyx yes, <model-viewer> should be supported in an Android WebView, and we have empirical evidence that it does work. However, every usage of a WebView is different, so it's possible that there is some detail of your specific use case that doesn't work. Also, it's worth noting that there are likely to be tricky aspects to running it in a WebView such as #743 .

I could probably offer you further advice if you share an example of what you are trying to do via Glitch. If Glitch won't work for you, then the next best thing would be an example of the HTML you are loading into the WebView.

@cdata Thanks for confirming! I found the issue which is related to Webview itself. It is hard to debug but I found out that using the method webview.loadData(myHtmlWithCSS, "text/html", null) is not going to work thanks to this stackoverflow question.

For anyone else having issues loading a local HTML string into the webview instead of loading a URL, try this solution:
Use webview.loadDataWithBaseURL(baseUrl, yourHTML, mimetype, encoding, historyUrl);

Was this page helpful?
0 / 5 - 0 ratings