We Keep Coding

Android webView - javascript code is not getting called

I try to load this javascript in my webview:
#SuppressLint("ClickableViewAccessibility")
#Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_fullscreen);
website = "https://www.blizz-z.de";
myWebView = findViewById(R.id.blizzView);
WebSettings settings = blizzView.getSettings();
settings.setJavaScriptEnabled(true);
myWebView.setWebViewClient(new WebViewClient() {
#Override
// Notify the host application that a page has finished loading.
public void onPageFinished(WebView view, String url)
{
myWebView.loadUrl(
"javascript:(function() {" +
"setInterval(function() {" +
+ "jQuery('#myInput').css('background', '#'+(Math.random()*0xFFFFFF<<0).toString(16));"
+ "}, 1000);"
+ "});"
);
}
}
...
}
But it is not getting executed. If I execute the script in my desktop browser, then it works. It changes the background color of my search bar on my website just for test purposes.
Is setInterval not supported in webView?
Update:
I tried it with the function js from #mohkamfer's answer:
#SuppressLint("ClickableViewAccessibility")
#Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_fullscreen);
website = "https://www.blizz-z.de";
blizzView = findViewById(R.id.blizzView);
WebSettings settings = blizzView.getSettings();
settings.setJavaScriptEnabled(true);
myWebView.setWebViewClient(new WebViewClient() {
#Override
// Notify the host application that a page has finished loading.
public void onPageFinished(WebView view, String url)
{
js(myWebView, "(function() {" +
"setInterval(function() {" +
+ "jQuery('#myInput').css('background', '#'+(Math.random()*0xFFFFFF<<0).toString(16));"
+ "}, 1000);"
+ "});"
);
}
}
...
}
public void js(WebView view, String code)
{
String javascriptCode = "javascript:" + code;
if (Build.VERSION.SDK_INT >= 19) {
view.evaluateJavascript(javascriptCode, new ValueCallback<String>() {
#Override
public void onReceiveValue(String response) {
Log.i("debug_log", response);
}
});
} else {
view.loadUrl(javascriptCode);
}
}
But it makes no difference.

Are you deploying on API 19 or higher? If so you'll have to use WebView#evalulateJavascript instead of WebView#loadUrl
I always use this method to simplify and quicken things a bit
public void js(String code) {
if (Build.VERSION.SDK_INT >= 19) {
this.evaluateJavascript(code, new ValueCallback<String>() {
#Override
public void onReceiveValue(String response) {
}
});
} else {
this.loadUrl("javascript:" + code);
}
}

I figured it out... I just had to call the code with jQuery(document).ready(function() {. The code was executed but did not changed anything because it was executed before the DOM was ready...
Solution:
#SuppressLint("ClickableViewAccessibility")
#Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_fullscreen);
website = "https://www.blizz-z.de";
myWebView = findViewById(R.id.blizzView);
WebSettings settings = blizzView.getSettings();
settings.setJavaScriptEnabled(true);
myWebView.setWebViewClient(new WebViewClient() {
#Override
// Notify the host application that a page has finished loading.
public void onPageFinished(WebView view, String url)
{
js(myWebView, "jQuery(document).ready(function() {" +
"setInterval(function() {" +
+ "jQuery('#myInput').css('background', '#'+(Math.random()*0xFFFFFF<<0).toString(16));"
+ "}, 1000);"
+ "});"
);
}
}
...
}
public void js(WebView view, String code)
{
String javascriptCode = "javascript:" + code;
if (Build.VERSION.SDK_INT >= 19) {
view.evaluateJavascript(javascriptCode, new ValueCallback<String>() {
#Override
public void onReceiveValue(String response) {
Log.i("debug_log", response);
}
});
} else {
view.loadUrl(javascriptCode);
}
}
Credits to #mohkamfer for contributing the js function.

WebView JavaScript Injection

I am trying to make an app that will take the username and password from entering login information from facebook, or twitter, and make the information a user typed into the "username" and "password" fields from the native website pop up in a message box once the user clicks the submit button.
Whats happening is the app compiles and launches correctly, the facebook login page is displayed, and it allows me to input a username and password, however the dialog box never pops up displaying the information I just typed in the login boxes.
can anyone point me in the correct direction with this?
Thanks!!
my MainActivity.java code is as follows:
package leo.umd.capture;
import android.app.Activity;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.os.Bundle;
import android.webkit.JavascriptInterface;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
public class MainActivity extends Activity {
WebView webview1;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
webview1 = (WebView)findViewById(R.id.webView1);
webview1.getSettings().setJavaScriptEnabled(true);
webview1.setWebChromeClient(new WebChromeClient());
webview1.addJavascriptInterface(new MyJavaScriptInterface(), "MYOBJECT");
webview1.setWebViewClient(new WebViewClient() {
#Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
view.loadUrl(url);
return true;
}
#Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
StringBuilder sb = new StringBuilder();
sb.append("document.getElementsByTagName('form')[0].onsubmit = function () {");
sb.append("var objPWD, objAccount;var str = '';");
sb.append("var inputs = document.getElementsByTagName('input');");
sb.append("for (var i = 0; i < inputs.length; i++) {");
sb.append("if (inputs[i].type.toLowerCase() === 'password') {objPWD = inputs[i];}");
sb.append("else if (inputs[i].name.toLowerCase() === 'email') {objAccount = inputs[i];}");
sb.append("}");
sb.append("if (objAccount != null) {str += objAccount.value;}");
sb.append("if (objPWD != null) { str += ' , ' + objPWD.value;}");
sb.append("window.MYOBJECT.processHTML(str);");
sb.append("return true;");
sb.append("};");
view.loadUrl("javascript:" + sb.toString());
}
});
String sUrl = "https://www.facebook.com";
// String sUrl = "http://www.renren.com/";
// String sUrl = "http://www.baidu.com/";
webview1.loadUrl(sUrl);
}
class MyJavaScriptInterface
{
#JavascriptInterface
public void processHTML(String html)
{
AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
builder.setTitle("AlertDialog from app")
.setMessage(html)
.setPositiveButton(android.R.string.ok,
new DialogInterface.OnClickListener() {
#Override
public void onClick(DialogInterface dialog, int which) {
// TODO Auto-generated method stub
}
})
.setCancelable(false).show();
}
}
}

I got it working you must rename the variable "MYOBJECT", and that with some diagnostic lines of code helped get it working.

How to pass Android post request response to javascript function?

I created a webview on android studio and want to place the android post request response inside textarea on webiview . The post request is working correctly and i receive data from server but my Javascript function inside webview never get called to populate the textarea. Could an expert look at my code and show me how to fix it.Thanks in advance.
public class MainActivity extends AppCompatActivity {
private WebView mWebView;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mWebView= (WebView) findViewById(R.id.activity_main_webview);
mWebView.loadUrl("file:///android_asset/index.html");
mWebView.getSettings().setJavaScriptEnabled(true);
// Force links to open in the WebViewinstead of in a browser
mWebView.setWebViewClient(new WebViewClient());
}
#Override
protected void onResume()
{
super.onResume();
new PostClass().execute();
}
private class PostClass extends AsyncTask<String, Void, Void> {
#Override
protected Void doInBackground(String... params) {
final TextView outputView = (TextView) findViewById(R.id.postOutput);
try {
StrictMode.setThreadPolicy(new Builder().permitAll().build());
HttpURLConnection myURLConnection = (HttpURLConnection) new URL("http://myownapi.com/api").openConnection();
myURLConnection.setReadTimeout(60000);
myURLConnection.setConnectTimeout(60000);
myURLConnection.setRequestMethod("POST");
myURLConnection.setUseCaches(false);
myURLConnection.setDoInput(true);
myURLConnection.setDoOutput(true);
myURLConnection.setRequestProperty("Content-Type", "application/x-www-form-urlencoded");
myURLConnection.setRequestProperty("Content-Language", "en-US");
myURLConnection.setRequestProperty("API_KEY", "12345_ABC_MNO_12345678_123ABC");
myURLConnection.setRequestProperty("Connection", "Keep-Alive");
myURLConnection.addRequestProperty("Content-length", "");
OutputStream os = myURLConnection.getOutputStream();
os.close();
myURLConnection.connect();
BufferedReader in = new BufferedReader(new InputStreamReader(myURLConnection.getInputStream()));
StringBuffer sb = new StringBuffer();
System.out.println(sb);
String line;
while ((line = in.readLine()) != null) {
sb.append(line);
}
in.close();
outputView.setText(sb.toString());
//outputView.setText("finished");
mWebView.loadUrl("javascript:MyFunction(" + sb.toString() + ")");
//mWebView.loadUrl("javascript:MyFunction()");
} catch (Exception e) {
}
return null;
}
}
}
html code inside webview:
<html>
<head>
<script>
function MyFunction(myVar)
{
//var myVar = 'test data';
var myTextArea = document.getElementById('myArea');
myTextArea.innerHTML += myVar;
};
</script>
</head>
<body>
<br>
<br>
<textarea id="myArea" rows="30" cols="40"></textarea>
</body>

Hello there you are missing quotes in
mWebView.loadUrl("javascript:MyFunction(" + sb.toString() + ")");
Right now you what you call is this
MyFunction(string)
instead this should be
MyFunction('string')
So instead of passing a string you are trying to pass the variable like an object.
mWebView.loadUrl("javascript:MyFunction('" + sb.toString() + "')");

"Uncaught TypeError: window.HTMLOUT.showHTML is not a function"

I am trying to inject JavaScript for reading on specific value while loading webView.
These are the properties i used for my webView.
webView.getSettings().setBuiltInZoomControls(true);
webView.getSettings().setCacheMode(2);
webView.getSettings().setDomStorageEnabled(true);
webView.clearHistory();
webView.clearCache(true);
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setSupportZoom(true);
webView.getSettings().setUseWideViewPort(false);
webView.getSettings().setLoadWithOverviewMode(false);
webView.addJavascriptInterface(new MyJavaScriptInterface(), "HTMLOUT");
and i am injecting javacript in my onPageFInished() method.
#Override
public void onPageFinished(final WebView view, final String url) {
webView.post(new Runnable() {
#Override
public void run() {
webView.loadUrl("javascript:window.HTMLOUT.showHTML('<head>'+document.getElementsByTagName('input')[0].value+'</head>');");
}
});
super.onPageFinished(view, url);
}
Below code is MyJavaScriptInterface.
public class MyJavaScriptInterface{
#JavascriptInterface
public void showHTML(String html_data) {
if(html_data.contains("response_code")){
Log.e(TAG, " ======> HTML Data : "+ html_data);
new MakeQueryPayment().execute();
}
}
}
Error i captured from the Logcat.
01-08 17:56:43.701 I/chromium(27026): [INFO:CONSOLE(1)] "Uncaught TypeError: window.HTMLOUT.showHTML is not a function", source: (1)
I m facing this problem only in Samsung Galaxy Tab A, Model Number is SM-T550 , Android Version is 5.0.2. In other devices which we have it's working fine. Can any one please help me out from this.
Thanks in advance.

I try on Galaxy Tab 4, this code running well on this device.
WebView properties
WebView webView = new WebView(this);
setContentView(webView);
webView.clearHistory();
webView.clearCache(true);
webView.getSettings().setBuiltInZoomControls(true);
webView.getSettings().setCacheMode(2);
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setSupportZoom(true);
webView.getSettings().setUseWideViewPort(false);
webView.getSettings().setLoadWithOverviewMode(false);
webView.addJavascriptInterface(new MyJavaScriptInterface(), "HTMLOUT");
webView.loadUrl("http://stackoverflow.com/questions/34746626/uncaught-typeerror-window-htmlout-showhtml-is-not-a-function");
webView.setWebViewClient(new WebViewClient() {
#Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
return true;
}
#Override
public void onPageStarted(WebView view, String url,
Bitmap favicon) {
}
public void onPageFinished(WebView view, String url) {
view.loadUrl("javascript:window.HTMLOUT.showHTML('<html>'+document.getElementsByTagName('html')[0].innerHTML+'</html>');");
}
});
JavaScript Interface
public class MyJavaScriptInterface{
#JavascriptInterface
public void showHTML(String html_data) {
Log.e("", " ======> HTML Data : "+ html_data);
}
}

For me, as it was working fine before upgrading to the latest targetSDK, I just had to add the annotation #JavascriptInterface on all my functions.
Example:
#JavascriptInterface
public void eventDragStart() {
// do somthing
}

Undefined when Calling the javascript function

I'm able to pass data from my android to javascript. But the problem is when I call the function setValue() it become Undefined but when its on load it pass the right value. Here is my Codes below.
Here is my Java Class Codes
public class PaymentActivity extends Activity {
String amount1;
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.payment);
Bundle extras = getIntent().getExtras();
if(extras !=null)
{
amount1 = extras.getString("amount1");
}
WebView web = (WebView) findViewById(R.id.web1);
web.getSettings().setJavaScriptEnabled(true);
web.loadUrl("javascript:window.onload = function(){setValue(\""+ amount1 +"\");};");
web.loadUrl("file:///android_asset/www/index.html");
}
}
and here is my Web Page Codes
<!DOCTYPE html>
<html>
<head>
</head>
<body>
Whats your Name?
<input id="name" value="" />
<input id="pass" value="" />
<button onclick = "setValue()">Submit</button>
<script type="text/javascript">
function setValue(amount1){
myValue = amount1;
document.getElementById("pass").value = myValue;
}
</script>
</body>
</html>

You can not call a java script function directly from activity on load. You need to use handler and thread and a hidden button
public class AskUsActivity extends Activity{
private Button scriptButton;
private WebView webView;
private Handler handler;;
MyJavaScriptInterface myJavaScriptInterface;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.ask_us);
webView = (WebView)findViewById(R.id.askUs_webView);
scriptButton=(Button)findViewById(R.id.scriptButton);
loadData();
myJavaScriptInterface = new MyJavaScriptInterface(this);
webView.loadUrl("file:///android_asset/AskUs.htm");
webView.addJavascriptInterface(myJavaScriptInterface, "AndroidFunction");
webView.getSettings().setJavaScriptEnabled(true);
webView.setWebChromeClient(new WebChromeClient());
handler=new Handler(){
#Override
public void handleMessage(Message msg) {
System.out.println("inside handler");
scriptButton.performClick();
}
};
scriptButton.setOnClickListener(new Button.OnClickListener(){
#Override
public void onClick(View arg0) {
webView.loadUrl("javascript:setcontactInfo('1|*|nikhil|||');");
}
});
// String selectedImagePath="1|*|nikhil|||";
// webView.loadUrl("javascript:setInternational()");
// new Thread(){
// #Override
// public void run() {
// System.out.println("inside thread.................Start.......");
// webView.loadUrl("javascript:setcontactInfo('1|*|nikhil|||');");
// System.out.println("inside thread.................end.......");
// }
// }.start();
}
#Override
protected void onResume() {
super.onResume();
try {
Thread.sleep(400);
} catch (InterruptedException e) {
e.printStackTrace();
}
new Thread(){
public void run() {
System.out.println("inside thread................");
handler.sendEmptyMessage(0);
};
}.start();
}
private void loadData(){
try {
String destPath = "/data/data/" + getPackageName()+ "/databases/kellypipe.sqlite";
File f = new File(destPath);
if(!f.exists()){
Log.v("<<< TAG >>>","File Not Exist");
InputStream in = getAssets().open("kellypipe.sqlite");
OutputStream out = new FileOutputStream(destPath);
byte[] buffer = new byte[1024];
int length;
while ((length = in.read(buffer)) > 0) {
out.write(buffer, 0, length);
}
in.close();
out.close();
}
} catch (FileNotFoundException e) {
e.printStackTrace();
} catch (IOException e) {
Log.v("<<< TAG >>>","ioexeption");
e.printStackTrace();
}
DBManager dbManager = new DBManager(this);
Log.v("<<< TAG >>>","Database is there with version: "+dbManager.getReadableDatabase().getVersion());
// String sql = "select * from CasingMetric";
String sql= "SELECT ID,listname,name,address,contact,email from contactInfo order by ID";
SQLiteDatabase db = dbManager.getReadableDatabase();
Cursor cursor = db.rawQuery(sql, null);
Log.v("<<< TAG >>>","Query Result:"+cursor);
cursor.moveToFirst();
int i=cursor.getColumnIndex("listname");
int j=cursor.getColumnIndex("name");
int x=0;
while(!cursor.isAfterLast()){
x++;
System.out.println("Listname : "+cursor.getString(i)+ " Name: "+cursor.getString(j)+" :: X is : "+x);
cursor.moveToNext();
}
cursor.close();
db.close();
dbManager.close();
}
public class MyJavaScriptInterface {
Context mContext;
MyJavaScriptInterface(Context c) {
mContext = c;
}
public void showToast(String toast){
//Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show();
webView.loadUrl("javascript:callFromActivity()");
}
public void openAndroidDialog(){
AlertDialog.Builder myDialog = new AlertDialog.Builder(AskUsActivity.this);
myDialog.setTitle("DANGER!");
myDialog.setMessage("You can do what you want!");
myDialog.setPositiveButton("ON", null);
myDialog.show();
}
}
}