B4A Library WebViewExtras

LordZenzo

Well-Known Member
Licensed User
Longtime User
Hello everyone
I'm creating a simple app
I need to login
I use "WebExtra.PostUrl (" https://www.robedacartoon.it/login "," email=giannini.lorenzo.98@gmail.com&passwd=xxxpassword ".GetBytes (" UTF8 "))"
the email used as userName is entered in the field, the password no! I checked the INPUT field names and they are right
a suggestion?
 

Lello1964

Well-Known Member
Licensed User
Longtime User
Hello,
i'm tryning to open xml file with xls scheme using WebViewExtras lib,
whius is my code :
B4X:
Sub Globals
    Dim WebView1 As WebView
   Dim WebViewExtras1 As WebViewExtras
   Dim WebViewSetting As WebViewSettings
   Dim DBFileDir As String                   : DBFileDir =RP1.GetSafeDirDefaultExternal("") 
End Sub

Sub Activity_Create(FirstTime As Boolean)
   WebView1.Initialize("WebView1")
   
   WebViewExtras1.addWebChromeClient(WebView1, "")
   Activity.AddView(WebView1, 0, 0, 100%x, 100%y)
   
   Dim url="file:///" & File.Combine(DBFileDir, "IT00430310672_0001N.xml")
   Log("Loading " & url)
   WebView1.LoadUrl(url)
   
End Sub
[code/]

both file xls and xlm are ... /Android/data/xmkl.test/files/

i have this error :

Logger connesso a:  Xiaomi Redmi Note 3
--------- beginning of system
--------- beginning of main
** Service (starter) Start **
** Activity (main) Create, isFirst = true **
Loading file:////storage/emulated/0/Android/data/xmkl.test/files/IT00430310672_0001N.xml
Unsafe attempt to load URL file:///storage/emulated/0/Android/data/xmkl.test/files/fatturapa_v1.2.xsl from frame with URL file:///storage/emulated/0/Android/data/xmkl.test/files/IT00430310672_0001N.xml. 'file:' URLs are treated as unique security origins.
 in file:///storage/emulated/0/Android/data/xmkl.test/files/IT00430310672_0001N.xml (Line: 2)
** Activity (main) Resume **

how can i solve ?
 

Devv

Active Member
Licensed User
Longtime User
hello


i am using webview extras 1.42
we used these funtions in our app
AddJavascriptInterface
addWebChromeClient
executeJavascript
Sub WebView_Main_ProgressChanged(NewProgress As Int)

we need to use also flingable webview

we need LongPress (X As Float, Y As Float)

can we use the two libraries together ?
 

Amin.D

New Member
Hi
how to use xpath code in WebViewExtras
for example

JavaScript:
document.evaluate( xpathExpression, contextNode, namespaceResolver, resultType, result );

document.evaluate('count(//p)', document, null, XPathResult.ANY_TYPE, null )

i try
B4X:
wbx.executeJavascript(wb,"test.CallSub('print',true,document.evaluate('//h2', document, null, XPathResult.ANY_TYPE, null ))")
and
output error :

undefined
 
Last edited:

drgottjr

Expert
Licensed User
Longtime User
this is an xpath error. you need to correct it. it's not the fault of webviewextras, which simply facilitates your executing javascript in a webview. (note: webview is not a full browser, so its support of javascript may not be the same as that of chrome. in any case, that, too, is not webviewextras' fault.) the error is clear enough; you need to define documentNode.
 

Amin.D

New Member
the error is clear enough; you need to define documentNode.
Tnx
Yes
I edit code to :

B4X:
wbx.executeJavascript(wb,"test.CallSub('print',true,document.evaluate('//h2', document, null, XPathResult.ANY_TYPE, null ))")

and output log :

undefined

(note: webview is not a full browser, so its support of javascript may not be the same as that of chrome. in any case, that, too, is not webviewextras' fault.)
What do you suggest?
 
Last edited:

JohnC

Expert
Licensed User
Longtime User
Adding the ChromeClient to webview (as explained in tip #1 in my signature below) will help make webview more like a chrome browser.
 

Amin.D

New Member
Tnx johnC

But I Added

My Code :
B4X:
Sub Globals
    'These global variables will be redeclared each time the activity is created.
    Dim wb As WebView
    Dim wbx As WebViewExtras
End Sub

Sub Activity_Create(FirstTime As Boolean)
    'Activity.LoadLayout("Layout")
    wb.Initialize("wb1")
    wbx.addJavascriptInterface(wb,"test")
    wbx.addWebChromeClient(wb,"wbx")
    ProgressDialogShow("  Please Wait  ")
  
'    wb.LoadUrl("http://127.0.0.1")
    wb.LoadUrl("https://www..........org")
'    wb.LoadHtml("'file:///android_asset/index.html")
  
'    If File.Exists(File.DirAssets, "index.html") Then  Log("yes") Else Log("not found")
  
    End Sub


Sub      wb1_PageFinished (Url As String)
    ProgressDialogHide
    wbx.executeJavascript(wb,"test.CallSub('print',true,document.getElementById('ctl00_cphTop_Sampa_Web_View_TimeUI_ShowDate00cphTop_3734_lblGregorianNumeral').innerText)")
'    wbx.executeJavascript(wb,"test.CallSub('print',true,document.evaluate('html/body', document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null ))")
    '###########################################
    '    wbx.executeJavascript(wb,"test.CallSub('print',true,document.getElementById('ctl00_cphTop_Sampa_Web_View_TimeUI_ShowDate00cphTop_3734_lblHijriTitle').innerText)")

    wbx.executeJavascript(wb,"test.CallSub('print',true,document.evaluate('//h2', document, null, XPathResult.SRING_TYPE, null ))")
    wbx.executeJavascript(wb,"test.CallSub('print',true,document.evaluate('.//*', document, null, XPathResult.ANY_TYPE, null ))")
    End Sub

Sub print (txt As String)
    Log(txt)
End Sub
 
Last edited:

max123

Well-Known Member
Licensed User
Longtime User
Hi,

A WebChromeClient handles many things, the WebChromeClient that WebViewExtras adds to your WebView enables:

-- Logging of javascript console messages and errors to the B4A log.

How I can capture this to create a Javascript log in a EditText ?

Actually the log show a strange syntax, in File:/// but without name. Is this because I load a Javascript as string inside a page?
I explain better, I read a file .js from DirAssets with File.ReadString() method to a String variable. Attached the log output.

Many thanks

 

drgottjr

Expert
Licensed User
Longtime User
you are asking about 2 different things:
1) how to capture output from the log and show it in an edittext view. actually, this alone involves 2 different questions.
2) why does the output itself show strange characters and missing (expected) text?


to assign log output to some variable you need to override the
behavior of the webchromeclient's onConsoleMessage() method. if you do that, you
can raise an event in your b4a app and assign the output from the event to some variable.
once you have that, you can keep simply adding that value to any previous text value of the
edittext view. (or you could use a stringbuilder - my recommendation).

if you only use webviewextras' chromeclient to send console messages to the log, then it it's
easy to extend the chromeclient with a javaobject and a few lines of java. if you use the
chromeclient for other things, then you would have to implement them all yourself. you can't have
webviewextras' client and your own at the same time. there is another webview library
(ultimatewebview) available. it may or may not allow you to capture log output as a b4a variable.
in any case, extending a webchromeclient for the purpose of capturing the log and assigning
the output to a variable is not difficult.

as to why the output you show is strange and/or missing something you're expecting, it's difficult to
say without seeing what you're doing. i can tell you that the "?"'s inside a black diamond are
indicative of character set issues. the log is attempting to print a character for which its character
code has no appropriate character. this usually involves issues between utf8 and ansi. without seeing
your code and knowing the url of the website, there isn't much more to say beyond what is often said
in the forum (and in android's documentation): a webview is not meant to be used as a substitute for a browser.
 

max123

Well-Known Member
Licensed User
Longtime User
Many thanks @drgottjr for your detailed explanation, I need to study it better because my english is not so good.
Because you asked me I went to explain better what I do from begin, if it is a too long story for you, please, just past next where I explain what I do now and because I need to redirect JS console to a TextField.

---------------------------------------------------------
Returning on redirect console, as I said I managed with threejs because I want substitute a Canvas on my app with a full 3D view. I do not know OpenGL API, so searched some object oriented, threejs is very good.... so I managed with WebViewExtras, yes even managed initially with good @Ivica Golubovic UltimateWebView that have a lots of great functionalities, but I had the problem that is not possible create istance of JSInterface on a Class. Ivica supposes it work only on Activity, I've used it in a Custom View Class. Ivica told me that check and try to fix it. iI tried with WebViewExtras that not require Me callback and it worked. Next I will use UltimateWebView library if Ivica fix the problem, just I commented for now.

Because I'm very new on threejs, I created a simple B4A app with 3 TABS to test inline:
- on first tab just a long scrollable vertical ScrollView, inside it a long TextField, here I print Javascript code
- by pressing second tab, there is a fullscreen WebView that render what i wrote in Javascript
- in last tab just there is another long scrollable TextField where next I want show a full HTML text and put a COPY, LOAD and SAVE buttons. This way it can manage with files, maybe load full HTML, extract JS and put in first TAB etc...

,- It has not colored syntax, just an EditText.
- It is like a sort of very simple jsFiddle but only for threejs.
- It permits to create 3D scenes live, add lights, put 3D objects, import 3D files (for this need to be tested, need path where load a file), rotate with touch, zoom with pinch, tranlate with 2 fingers, permits to set separate parameters for these eg dampingFactor, panSpeed, rotateSpeed, all floats, what uou write it render. Because imports are directly imported from DurAssets, it is not extensible, I only imported some JS, three.js, OrbitControl.js, Stats.js, more can be added, but by code.

Because I not yet managed to Load and Save files, for now I've created some Javascript templates that draw some scenes with some geometries, even I created a relatively long JS code that acts as small tutorial (introduction, I'm not expert) for threejs, in this code I've added some parst of threejs, geometries, lights, materials constructors with commented examples, to add to the scene just need to be uncommented.

The problem is that execute JS without a console is not a right way, if I just miss a semicolon, if I do some errors on code, by pressing the WebView is just Black, I cannot see where error is, WebView Extras show in the B4A log, but as you discussed need to be managed
I see that there are some consoles on github as Javascript that can be integrated, maybe this is a best option? What do you think on tools like Eruda or similars? I've no experience on this, tried Eruda on web and in one app from PlayStore and looks good.... maybe using code I can iteract and integrate it ?

For colored syntax I still provided to this by searching to port @stevel05 CodeMirror Classes. It after more resolved issues worked on Android as CustomView, it is excellent on my Nexus 7, even on a phone, support 100+ language hilights Thanks to stevel even B4X, it support about 30 themes, lights and dark.

The problem is that this only works in Debug mode. For some strange reasons crash in Release mode, return an exception that a class cannot cast another class type. I suppose what is the problem, I initialize a CustomView Class inside another CustomView class, stevel do this on B4J, B4A maybe don't like it.

Next days I will post the project on the Forum, maybe someone can help to solve this.
 
Last edited:

drgottjr

Expert
Licensed User
Longtime User
my understanding of your problem is that you wish to communicate between a webview and a b4a app.
i have no interest in any of the other things you talked about (sorry, no offense intended). if i understand the
problem correctly, just say yes. if yes, then i or a number of other people can tell you how to do it.

you communicate between a webview and a b4a app is by raising an event with the javascript interface or
executejavascript command. the event returns a string to b4a. you can do what you want with that string.
it can contain 1 value or as many values as you like (eg, "value1~value2~value3~value4~etc").

extending webchromeclient is 1 way. but it isn't the only way. you only have to know or be able to know
the value of some variable in the webview that you want b4a to know. you can then pass that value to b4a.
there are a couple ways to do this. they use webviewextras and are simple in theory.

if this is what you are talking about, say it clearly, and we can move forward.
 

max123

Well-Known Member
Licensed User
Longtime User
Yes I want comunicate with a WebView from BA4 and viceversa....

Sorry, but I not a novice, I already doing this things on 10+ projects with WebViewExtras and even with UltimateWebView, so no problem at all for this
WebViewExtras to JS:
WebViewExtras1.addWebChromeClient(WebView1, "WebViewExtras1")
WebViewExtras1.addJavascriptInterface(WebView1, "B4A")
UltimateWebView to JS:
Private JSInterface As UltimateJavascriptInterface
UltimateWebView1.Initialize(Me, "UltimateWebView1")
UltimateWebView1.SetWebChromeClient(True) ' Sets WebChromeClient and its Events.
UltimateWebView1.AddJavascriptInterface(JSInterface, "B4A")
'Eventually
UltimateWebView1.Settings.JavaScriptEnabled = True
UltimateWebView1.Settings.JavaScriptCanOpenWindowsAutomatically = True
And from JS side:
B4A.CallSub (Param1, Param2, Param3)
What you omitted is that max 3 params are supported, I even resolved this and even tried to pass up 10 parameters with just Param1 using a comma delimiter string. See this thread:
https://www.b4x.com/android/forum/t...bview-javascript-function.139554/#post-883867

My question is not how to do it on B4A, but how do accomodate all on both sides, that I have to communicate B4A-JS I think is clear now, but because I never implemented a Javascript console Inside or Outside a webview I have no Idea what is the best option and how really do it with code.

Yes is this the problem:
How tecnically do it with code, before do this my anoter question you do not responded me and it is crucial:
I asked you if is more convenient use eg. Eruda or similars, this is on a WebView, or just redirect as my first question the console to have a stream and write it in a EditText.

This depends if the log show the exact line number where error occours, but in Javascript that I write, because I import <script> tags as string from DirAssets, all it's code is bundled in one single string with HTML, Scripts, styles etc..... If I do error on line 1 WebviewExtras actually show line 14000+.

So how to do it tecnically....
Suppose that I use WebViewExtras, there is a way to disable the JS log to B4A Log (not really needed if I implement in app) and from JS pass a full console stream to b4A to a EditText or multiline label? But is this the better option? Or best use already existing things like Eruda?
 
Last edited:

drgottjr

Expert
Licensed User
Longtime User
i can only tell you how to communicate between a webview and b4a. i know nothing about eruda or similars. i did
not answer before because i was trying to understand the exact nature of your problem. i now understand that you
already know how to use javascript interface and executejavascript.

the more you explain, the more it looks like you are not interested so much in variables but simply in capturing
errors and showing them in an edittext view. if this is the case, then we are back to webchromeclient. because of the
line number problem (due to the way you load the webview), i believe the most you can hope for is to capture the log
by extending the webchromeclient. once you do that, you can easily add text to the edittext view. it isn't exactly a real
console, but you will see the errors. i already do something similar, but i use a webview as the "console" since i find it
more flexible than an edittext. i override webchromeclient, it sends console messages to b4a, i take the messages and
show them in my "console".

are we getting any closer now?
 

max123

Well-Known Member
Licensed User
Longtime User
And How Override WebChromeClient ?
Please post some code example if you have. I will study it.

I even study this.... but tomorrow, now are 5.00 of night, I study go to bed.
https://jsrepos.com/lib/liriliri-eruda
 

drgottjr

Expert
Licensed User
Longtime User
 

Attachments

  • console.zip
    8.3 KB · Views: 194

max123

Well-Known Member
Licensed User
Longtime User
Cookies are required to use this site. You must accept them to continue using the site. Learn more…