Android Question Cannot show ESP32CAM video streaming on WebView

max123

Well-Known Member
Licensed User
Longtime User
Hi all,

I wrote an app that acts as 3D Printer, CNC Router and Laser Host controller over USB and Network.

To view remotely machines during the working process, eg while printing, engraving etc.. locally or over internet, I use ESP32CAM that stream multipart MJPEG video, it is programmed with the CameraWebServer.ino sketch, not the same but just modified by me to add more funtionalities and with inline HTML instead of gzip file.
https://github.com/espressif/arduin...braries/ESP32/examples/Camera/CameraWebServer

In my app I've a dedicate page where I added a WebView, a textbox where add the camera URL and START and STOP buttons to start/stop the video streaming.

This work well on my Nexus 7 2013 and regular browsers (Chrome, Firefox, Opera Mini) I can see the exposed ESP32 webserver with all camera controls and a button to start the video stream. I can even switch on/off remotely the flash led from the same page.

Now the problem....

For some reasons it do not work on my Asus ZenFone2 smartphone (and even other smartphones), when I start the stream (load a page) the browser show this message:

"header fields are too long for server to interpret"

On the same device I can see the page (and the video stream) on all browsers but not in the B4A WebView.

Is there a way to fix it ?

I've found on this page one solution to fix that using an intent and pass to it the URL, but this is for AppInventor and I don't know a B4A counterpart
or other best way to fix.
http://kio4.com/arduino/247_Wemos_WebCam.htm

Please, can someone help me ?
Many thanks
 
Last edited:

JohnC

Expert
Licensed User
Longtime User
Two things you can try:

1) Add chromeclient to webview to see if that gets it to work:


2) Did you try this example to display MJPEGs:

 
Upvote 1

max123

Well-Known Member
Licensed User
Longtime User
Many thanks @JohnC I will try your suggestions, but actually it works perfectly on Nexus 7, so very strange
 
Upvote 0

JohnC

Expert
Licensed User
Longtime User
Keep in mind also that the webview control is updatable from the Play Store, so maybe the other device needs to see if there is an update available and install it.
 
Upvote 0

max123

Well-Known Member
Licensed User
Longtime User
The first one do not work, it show the same message on a web page:

header fields are too long for server to interpret

This is a relevant code:
B4X:
'''''''''''''' IP CAMERA STREAM '''''''''''''

Sub btnStartCameraStream_On(Index As Int, Tag As String)

    Dim wve As WebViewExtras
    wve.addWebChromeClient(CameraWebView, "WVE")
  
    btnStartCameraStream.DisableNoMask
    Dim URL As String = txtCameraHost.Text.Trim
    CameraWebView.LoadUrl(URL)
    Log("Loading URL: " &  CameraWebView.Url)
    ToastMessageShow("Loading URL: " & CameraWebView.Url, False)
End Sub

The second alternative I think I cannot use because it render on an ImageView, the CameraServer do not only stream the MJPEG stream, but exposes an HTML page, inside this page there are camera controls and a button to start a video stream, so a WebView is required.

Actually the URL is http://ESP_IP_ADDRESS/ so example http://192.168.178.38/ in station mode (connected to local network) or http://192.168.4.1/ with ESP32 as access point.

Any others suggestions to fix are very welcome.
Many Thanks
 
Last edited:
Upvote 0

max123

Well-Known Member
Licensed User
Longtime User
My Android System WebView is updated to 21 Sept 2021, I have only the option to uninstall.
Maybe it only works on Nexus devices because from Google and not on other devices?
 
Last edited:
Upvote 0

max123

Well-Known Member
Licensed User
Longtime User
BINGO !!!

For anyone have this problem I solvet it by uninstall the Android System WebView from PlayStore.
I do not know if this make limitations to other applications that use it, for sure yes, so pay attention, I not responsible to this, but in my case it worked, if I reinstall againt it stop and I cannot see the exposed webpage.

Maybe the best solution is make it to work without uninstall the service.

Many thanks @JohnC you solved my problem.

Now I can see on Asus ZenFone2 the webpage exposed from ESP32CAM, change resolution and controls, get image still, start the video streaming, the only problem I had is that a page is too big, the WebView zoom already is the smaller, is there a way to reduce the page zoom?

In external browsers I too see big page and controls, but if I swith to Desktop mode then I see the right I want. This can be done maybe with WebViewExtras or maybe I need to edit the html file on ESP32 side ?

Many thanks
 
Last edited:
Upvote 0

max123

Well-Known Member
Licensed User
Longtime User
Please how to manage the B4A WebView to load a page in Desktop mode instead of Mobile mode? Is that possible?
If no, there is a way to scale the page smaller than it's size?
 
Upvote 0

JohnC

Expert
Licensed User
Longtime User
This provides many ways to adjust the size of the content:

 
Upvote 0

max123

Well-Known Member
Licensed User
Longtime User
Now I'm not at PC, so:
B4X:
Dim UserAgent As String = "Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10_5_7; en-us) AppleWebKit/530.17 (KHTML, like Gecko) Version/4.0 Safari/530.17"
WebViewSetting1.setUserAgentString (CameraWebView, UserAgent)

can get the trick ?
 
Last edited:
Upvote 0
Cookies are required to use this site. You must accept them to continue using the site. Learn more…