I want to know if there is way to call javascript from java on android?
In my program, I interact java and javascript together. I am using java to receive response(json data) from TCP server and save them into a file. In webview I am using javascript jQuery getJSON() function to retrieve that file and using jQuery plot chart library to draw chart. Now, there is no relationship between java and javascript. Every time when I update data and file, I still need to click a button in webview to trigger the draw function. I want the programmes to be smart and handy. Is that a way to call or execute javascript from java. I know one way:
Button update = (Button)findViewById(R.id.update);
update.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
wv.loadUrl("javascript:document.write('hello')");
}
});
But the problem is I already do a index page by loadurl().
final WebView wv = (WebView) findViewById(R.id.webkankan);
wv.getSettings().setJavaScriptEnabled(true);
wv.loadUrl("file:///android_asset/index.html");
When I trigger this click event, all contents were gone only a string "hello" there. Another thing is why I need to change webview's type to final to avoid eclipse error. Does this is the problem to trigger my main problem? If so, how can I fix it?
Thanks for you patience.
Cheers!
For instance you have a javascript method in the index.html called loadData() which reads the file you saved in the java, then what you can do is wv.loadUrl("javascript:loadData()");. This actually call the javascript method and you can then read the file in that method. Hope this solves your problem.
or in simple terms. jus do this webView.loadUrl("javascript:jsmethodname()"); to execute javascript from java.
You can try to communicate java with javascript registering a java object to the webview that is executing the javascript.
The method addJavascriptInterface from Webview will allow you to make available a Java object to the Javascript scope, something like this:
WebView mWebView = new WebView(mContext);
//... webview initialization, js enabling etc.
MyProxyObject obj = new MyProxyObject(); //This object can interchange just basic types, but Strings are basic types
mWebView.addJavascriptInterface(obj,"myproxyobj");
With that code what you will have in the Javascript context you will have an object 'myproxyobj' that is actually a Java object.
Remember, you can interchange just basic types.
For more info check the following url:
http://developer.android.com/guide/webapps/webview.html
Specially check the section: Binding JavaScript code to Android code
Cheers,
Francisco
Related
I'm using crosswalk now. I need to call a Java method when a user clicks a button in the HTML, which may look like:
Start
I'm not sure if Crosswalk extension is what I wanted, which seems to be so heavy-weighted just for calling a Java function.
Is there a simpler way to do this? Or should I use Cordova with Crosswalk in this case?
Here is about how to call java function with js in the crosswalk XWalkView. How to use XWalkView refer this answer.
References:
crosswalk-calling-java-methods-with-javascript
XWalkView manual
Below is the process to call java from js, and notices.
add this to activity you XWalkView in
webSettings.setJavaScriptEnabled(true);
mXWalkView.addJavascriptInterface(new JsInterface(), "NativeInterface");
and this, you also make it a class
public class JsInterface {
public JsInterface() {
}
#JavascriptInterface
public void act() {
//do something
}
}
and in the html page
<button onclick="NativeInterface.act()">Call Java Here</button>
when you import JavascriptInterface, take care, make sure you imported the exact one.
import org.xwalk.core.JavascriptInterface;
Not this one, this is for webview
import android.webkit.JavascriptInterface;
If you import this one, this will cause no action when you operation on the page and below error in your android studio.
12-02 13:24:49.921 12376-12376/com.xxxxxx.app E/chromium:
[ERROR:xwalk_autofill_client.cc(121)] Not implemented reached in
virtual void xwalk::XWalkAutofillClient::OnFirstUserGestureObserved()
Usually when you import the JavascriptInterface, the first one is what we want just like below pic shows.
But sometime when you change from webview to XWalkView, you may forget to change the JavascriptInterface.
If you are only using XWalkView as an embedded view, the addJavascriptInterface is sufficient to inject Java object into XWalkView(JavaScript), which is just like the addJavascriptInterface in android.webkit.WebView:
https://crosswalk-project.org/apis/embeddingapidocs_v2/reference/org/xwalk/core/XWalkView.html
http://developer.android.com/guide/webapps/webview.html#BindingJavaScript
I have developed a PhoneGap application for Android.
The application is composed by the webapp (HTML/jQuery) and a background service (Java code) that's started by the webapp.
This webapp writes to window.localStorage like
<script>
window.localStorage.setItem("name","MyName");
</script>
Is it possible to read this name that is in the localStorage from my Java code?
This is possible. To execute JavaScript and get response you can do as follows:
Define JavaScript callback interface in your code:
class MyJavaScriptInterface {
public void someCallback(String jsResult) {
// this will be passed the local storage name variable
}
}
Attach this callback to your WebView:
MyJavaScriptInterface javaInterface = new MyJavaScriptInterface();
webView.addJavascriptInterface(javaInterface, "HTMLOUT");
Run your JavaScript calling window.HTMLOUT.someCallback from the script:
webView.loadUrl("javascript:( function () { var name = window.localStorage['name']; window.HTMLOUT.someCallback(name); } ) ()");
Note - window.localStorage['name'] is the same as window.localStorage.getItem('name')
This post here on stackoverflow helped me
You might need to use super.webView.addJavascriptInterface or super.addJavascriptInterface to add the interface. You might need to use super.webView.loadUrl or super.loadUrl to invoke this. It all depends on where you are going to be calling these from.
Use cordova-plugin-nativestorage plugin to read localstorage in android java file.
it's for IOS,Android Plateform
this plugin use nativeStorage
Cordova Syntax:
NativeStorage.setItem("reference", obj, setSuccess, setError);
function setSuccess(obj){
}
function setError(obj){
}
Anroid JAVA:
SharedPreferences sharedPreferences = getSharedPreferences("MainActivity", MODE_PRIVATE);
System.out.println("********--------- shared pref values... " + sharedPreferences.getString("myid", "no value"));
I understand how to call Javascript from my WebView, that isn't the issue.
if(javascriptCall!=null){
String hardCodedexample = "1959602";
webView.loadUrl("http://myappexample+ username);
webView.loadUrl("javascript:" + "window.application.relocateTo({location:'patients/details',params:{EMPIID:"+ hardCodedEMPIID +"}})");
}
javascriptCall is a String which is passed to my webview activity. hardCodedEMPIID is just an example for our testing. My problem is that when I allow the app the run normally on the device my javascript method doesn't seem to work. It loads the myappexample and I can't tell what happened with my javascript call.
When I debug the app and single step through the code it properly calls the method. I'm confused on how this is possible? the different between single step and normal execution.
You should wait for onPageFinished(WebView view, String url) event called by WebViewClient (http://developer.android.com/reference/android/webkit/WebViewClient.html#onPageFinished(android.webkit.WebView, java.lang.String) ) . JavaScript file with your function might not be loaded right away after calling loadUrl.
I have been working with a Java applet which is an applet that helps to write using only a mouse. For my case, I am trying to incorporate this into my webiste project as follows:
When the user clicks on any input element (textbox/textarea) on the page, this JAVA applet loads on the webpage itself. In the screenshot of the JAVA applet seen below, the user points to an alphabet to and the corresponding text gets written in the text box of the applet.
Now what I am trying to do is to get this text from the TextBox of the applet to the input element on the webpage. I know that this needs an interaction between the Java and JavaScript, but not being a pro, I really do not have the catch. Here's the Java applet and the code I have written.
Java applet and jQuery code (298kB): http://bit.ly/jItN9m
Please could somebdoy help for extending this code.
Thanks a lot!
Update
I searched somewhere and found this -> To get the text inside of Java text box, a getter method in the Applet to retrieve the text:
public class MyApplet extends JApplet {
// ...
public String getTextBoxText() { return myTextBox.getText(); }
}
In the JQuery code, the following lines are to be added I think:
var textBoxText = $("#applet-id")[0].getTextBoxText();
//Now do something with the text
For the code of the applet, I saw a GNOME git page here. The getText call already exists -- look at the bottom of this file: http://git.gnome.org/browse/dasher/tree/java/dasher/applet/JDasherApplet.java
I'd need to call 'getCurrentEditBoxText' but when should this method 'getCurrentEditBoxText' be called?
In my case, I would probably have to do it when the user clicks in a new input control etc.
You can have full communication between your Applet and any javascript method on the page. Kyle has a good post demonstrating how the Javascript can call the applet and request the text value. However, I presume you want the HTML Textfield to update with each mouse click, meaning the applet needs to communicate with the page. I would modify your javascript to something like this:
var activeTextArea = null;
$('textarea, input').click(function() {
$(this).dasher();
activeTextArea = this;
});
function updateText(text) {
// Careful: I think textarea and input have different
// methods for setting the value. Check the
// jQuery documentation
$(activeTextArea).val(text);
}
Assuming you have the source for the applet, you can have it communicate with the above javascript function. Add this import:
import netscape.javascript.JSObject;
And then, in whatever onClick handler you have for the mouse clicks, add:
// After the Applet Text has been updated
JSObject win = null;
try {
win = (JSObject) JSObject.getWindow(Applet.this);
win.call("updateText", new Object[] { textBox.getText() });
} catch (Exception ex) {
// oops
}
That will update the text each time that chunk of code is called. If you do NOT have access to the applet source, things get trickier. You'd need to set some manner of javascript timeout that constantly reads the value from the applet, but this assumes the applet has such a method that returns the value of the textbox.
See Also: http://java.sun.com/products/plugin/1.3/docs/jsobject.html
Update Modifying the applet is your best shot since that is where any event would be triggered. For example, if you want the HTML TextField to change on every click, the click happens in the applet which would need to be modified to trigger the update, as described above. Without modifying the applet, I see two options. Option #1 uses a timer:
var timer;
var activeTextArea;
$('textarea, input').click(function() {
$(this).dasher();
activeTextArea = this;
updateText();
}
function updateText() {
// Same warnings about textarea vs. input
$(activeTextArea).val($('#appletId')[0].getCurrentEditBoxText());
timer = setTimeout("updateText()", 50);
}
function stopUpdating() {
clearTimeout(timer);
}
This is similar to the code above except clicking on a text area triggers the looping function updateText() which will set the value of the HTML text field to the value of the Applet text field every 50ms. This will potentially introduce a minor delay between click and update, but it'll be small. You can increase the timer frequency, but that will add a performance drain. I don't see where you've 'hidden' the applet, but that same function should call stopUpdating so that we are no longer trying to contact a hidden applet.
Option #2 (not coded)
I would be to try and capture the click in the Applet as it bubbles through the HTML Dom. Then, you could skip the timer and put a click() behavior on the Applet container to do the same update. I'm not sure if such events bubble, though, so not sure if this would work. Even if it did, I'm not sure how compatible it would be across browsers.
Option #3
Third option is to not update the HTML text field on every click. This would simply be a combination of Kyle's and my posts above to set the value of the text field whenever you 'finish' with the applet.
Here's a possible solution. To get the text inside of your Java text box, write a getter method in the Applet to retrieve the text:
public class MyApplet extends JApplet {
// ...
public String getTextBoxText() { return myTextBox.getText(); }
}
In your JQuery code, add the following lines:
var textBoxText = $("#applet-id")[0].getTextBoxText();
//Now do something with the text
I found most of what I posted above here. Hope this helps.
This page explains how to manipulate DOM from a Java applet. To find the input element, simply call the document.getElementById(id) function with id of an id attribute of the text input box.
I try to reuse an existing WebView by clearing any private data the previous user left behind:
CookieManager.getInstance().removeAllCookie();
webview.clearHistory();
webview.clearFormData();
webview.clearCache(true);
clearHistory seems only to clear the back/forward list, accessible via API, but not the internal list used for coloring links inside the web content.
I even tried the following, suggested by another stackoverflow answer:
deleteDatabase("webview.db");
deleteDatabase("webviewCache.db");
I still have no luck: CSS :visited selectors still work after reloading the page.
An alternative would be to use the API level 11 private browsing feature (new constructor argument), but then I cannot benefit from visited links at all; and can no longer target older versions.
Maybe someone has a solution for this issue? Thanks for your help.
Summary of the answers I got so far:
I tried these two answers, but the first seems to clear HTML5 data storage and the latter seems to be specific to the built-in browser:
WebStorage.getInstance().deleteAllData();
Browser.clearHistory(getContentResolver());
WebChromeClient.getVisitedHistory(ValueCallback<String[]> callback) is only called after the first time I create a new WebView in a recently installed application.
I tried to remove the WebView from view hierachy and create a new one, but unfortunately the visited history seems to be stored for the whole application.
Override WebChromeClient and WebViewClient... Damn that was hidden.
I actually had to dig up a bit to find this out.
WebView webView = (WebView)findViewById(R.id.myWebView);
WebChromeClient myWebChromeClient = new WebChromeClient(){
#Override
public void getVisitedHistory(ValueCallback<String[]> callback) {
// called during webview initialization, original implementation does strictly nothing
// and defaults to the native method WebViewCore.nativeProvideVisitedHistory()
String[] myUserHistory = getVisitedUrlsFromMyOwnDatabase(userId);
callback.onReceiveValue(myUserHistory);
}
};
WebViewClient myWebViewClient = new WebViewClient(){
#Override
public void doUpdateVisitedHistory(WebView view, String url,
boolean isReload) {
// called whenever there is a new link being visited
insertIfNotExistVisitedUrlIntoMyOwnDatabaseForUser(userId);
super(view, url, isReload);
}
}
webView.setWebViewClient(myWebViewClient);
webView.setChromeClient(myWebChromeClient);
webView.getSettings().etc(whatever)...
I think I'm "almost there". Here's the part I managed: what it does so far is remove css history altogether, so we're halfway there. I can't get the browser to recognize the url format I'm providing in "myUserHistory", so in effect the only feature this code does is reset css history altogether, but it's only called once when the WebView is instanciated (or created, didn't check), so for a true multiuser experience you'd need to recreate the webview at each login.
My problem now is that I can't manage to load the urlHistory properly. My Honeycomb Xoom webview seems to ignore my data.
Ah well, I hope it works for you. For me just calling callback.onReceiveValue(new String[]{}); in getVisitedHistory() will be good enough.
EDIT:
I just put twenty more minutes into it because I'm curious. This method is what delegates to the WebChromeClient (mCallbackProxy = WebChromeClient).
protected void populateVisitedLinks() {
ValueCallback callback = new ValueCallback<String[]>() {
public void onReceiveValue(String[] value) {
sendMessage(EventHub.POPULATE_VISITED_LINKS, (Object)value);
}
};
mCallbackProxy.getVisitedHistory(callback);
}
It's protected in WebViewCore, which is a private attribute of WebView with no accessor. The sendMessage delegates to EventHub which is private, and WebViewCore is filled with private native methods, and one of these seems to be the one actually calling the populateVisitedLinks() method during the initialization.
Unless someone at Google adds a public method to WebView to trigger the repopulation, I'm afraid it's practically impossible to achieve your goal. Sorry :(
As a side note, all these native visited history handling really makes me wonder: why do hardware manufacturers care so much about which urls we visited? ;) <<< sarcasm
As an alternate solution, you could try adding your own CSS with the same base colors the default CSS has and switch the CSS by another one (with same color for both "types" of links) when you want to reset the visited links.
A:link{color: "#990000"; text-decoration: none;}
A:visited{color: "#990000"; text-decoration: none;}
A:hover{color: "#ff0000"; text-decoration: none;}
If you can obtain a Browser instance (maybe you can set a WebChromeClient to WebView) you can use its clearHistory() method.
Does WebStorage.clearAllData() have the desired effect? Unfortunately, the documentation on this class is very sparse compared to WebView and doesn't say whether it applies to WebViews.
The exact time you're calling clearHistory() may also have an effect. Clearing it and then navigating to a new page may still keep the first page in history, and you have to call the method after the new page has loaded.
Personally, if privacy is a real issue, I would create a new set of objects from scratch for this new session if possible.