How can I calling JavaScript in WebView from Android? - javascript

I am beginner in Android development and want to create Android app with JavaScript.
I can run my page in WebView.
I can run JavaScript in WebView.
I can call Android Toast message (or Dailog alert ) from JavaScript to Android.
But I can NOT run JavaScript function from Android !
Can you help me to fix my code
[ Download an android studio project ]
http://r7eq.weebly.com
Code of MainActivity.java
package com.example.adnroid_script;
import android.app.Activity;
import android.os.Bundle;
import android.webkit.WebView;
import android.webkit.JavascriptInterface;
import android.widget.Toast;
public class MainActivity extends Activity {
public static WebView myWebView = null;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
myWebView=(WebView) findViewById(R.id.webview);
myWebView.getSettings().setJavaScriptEnabled(true);
myWebView.addJavascriptInterface(new jsInterface(), "FromJS");
myWebView.loadUrl("file:///android_asset/index.html");
}
public class jsInterface{
#JavascriptInterface
public void ToAndroid(String jsMessage){
Toast toast = Toast.makeText(getApplicationContext(),"I sent javascript code to myWebView", Toast.LENGTH_LONG);
toast.show();
WebView myWebView = (WebView) findViewById(R.id.webview);
// ### The bug is here ### //
myWebView.loadUrl("javascript:document.write('<div>Android say : It is working now !</div>');");
}
}
}

Related

Using OpenTouchMap on Android Environment

I am using the free map service: 'http://www.opentouchmap.org/' to view various buildings in an establishment using a WebView object.
My question is, is there a GET-parameter or script I can use to create a border so that the user cannot E.g."Go to China and back"?
Here is my code so far:
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.webkit.WebView;
import android.webkit.WebViewClient;
public class MapActivity extends AppCompatActivity
{
#Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_map);
WebView webview = new WebView(this);
setContentView(webview);
webview.setWebViewClient(new WebViewClient());
//No need to worry about security
webview.getSettings().setJavaScriptEnabled(true);
webview.loadUrl("http://www.opentouchmap.org/? lat=latitude&lon=longitude&zoom=15");
//TODO: what to do here??
webview.evaluateJavascript("",null);
}
}

Android Webview with HTML 5 geolocation

I am using a webview to load a web application. Within the page I load I use the HTML 5 geolocation API to detect the users location. This works in all browsers and currently have it working from an iOS application. For some reason I can't get it to work from within an Android webview. When I run the code below I am seeing this message in the stack trace:
[INFO:CONSOLE(24)] "Uncaught ReferenceError: PageMethods is not defined", source: [THE URL FOR THE SCRIPT] (24)
Again this functions just fine in a browser.
package bar.krowd.krowdapp;
import android.graphics.Color;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.webkit.GeolocationPermissions;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
public class MainActivity extends AppCompatActivity {
private WebView KrowdView;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
getSupportActionBar().hide();
KrowdView = (WebView) findViewById((R.id.activity_main_webview));
WebSettings ws = KrowdView.getSettings();
ws.setJavaScriptEnabled(true);
ws.setGeolocationEnabled(true);
KrowdView.setWebViewClient(new WebViewClient());
KrowdView.setWebChromeClient(new GeoWebChromeClient());
KrowdView.setBackgroundColor(Color.BLACK);
KrowdView.loadUrl([I AM PUTTING THE URL HERE]);
}
#Override
public void onBackPressed() {
// Pop the browser back stack or exit the activity
if (KrowdView.canGoBack()) {
KrowdView.goBack();
}
else {
super.onBackPressed();
}
}
public class GeoWebChromeClient extends WebChromeClient {
#Override
public void onGeolocationPermissionsShowPrompt(String origin,
GeolocationPermissions.Callback callback) {
// Always grant permission since the app itself requires location
// permission and the user has therefore already granted it
callback.invoke(origin, true, false);
}
}
}
I have the following listed in my AndroidManifest.xml:
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
It seems a bug, i solved it downgrading targetSdkVersion from 23 to 21 in app build.gradle
Add this:
webView.getSettings().setAppCacheEnabled(true);
webView.getSettings().setDatabaseEnabled(true);
webView.getSettings().setDomStorageEnabled(true);

Android Javascript Interface empty object in webview

I am trying to set up a simple Android app that displays a webview and has some extra functionality available via the Javascript Interface.
I am testing on a HTC One S running Kitkat (via Cyanogenmod). When I inspect the webview the object inserted (Android) is empty "Object {}". I cannot use the functions in the interface via the loaded page.
I had built a more complicated activity but could not get the interface working, so I've created this new app for testing which contains the only the code from the webview guides. Still not inserting the methods into the exposed object.
MyActivity
import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.webkit.WebSettings;
import android.webkit.WebView;
public class MyActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_my);
WebView myWebView = (WebView) findViewById(R.id.webview);
myWebView.addJavascriptInterface(new WebAppInterface(this), "Android");
WebSettings webSettings = myWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
myWebView.loadUrl("http://47e148ba.ngrok.com");
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.my, menu);
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}
WebAppInterface
import android.content.Context;
import android.webkit.JavascriptInterface;
import android.widget.Toast;
/**
* Created by graeme on 28/08/2014.
*/
public class WebAppInterface {
Context mContext;
/** Instantiate the interface and set the context */
WebAppInterface(Context c) {
mContext = c;
}
/** Show a toast from the web page */
#JavascriptInterface
public void showToast(String toast) {
Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show();
}
}
Layout
<?xml version="1.0" encoding="utf-8"?>
<WebView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/webview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
build.gradle
apply plugin: 'com.android.application'
android {
compileSdkVersion 19
buildToolsVersion "20.0.0"
defaultConfig {
applicationId "com.mydomain.jswebview"
minSdkVersion 17
targetSdkVersion 19
versionCode 1
versionName "1.0"
}
buildTypes {
release {
runProguard false
proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
}
}
}
dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
}
You can see I'm using the decorator required for the methods, which most questions seem to have as the solution. I'm developing in Android Studio if any of the presets in there might be interfering?
Edit:
In The JS file, or via the console if I'm inspecting the webview via chrome if I call Android or window.Android i get an empty objected returned "Object {}". Or if I try to use the methods defined in the interface above I'll receive a method undefined error.
I was having the same problem. Turned out to be a Proguard problem. Try adding the following to your Proguard rules:
-keepclassmembers class ** {
#android.webkit.JavascriptInterface <methods>;
}
I don't know how are you trying to call to your Java methods from inside of your WebView. I think that the correct way is:
javascript:window.Android.showToast('Hi!');
you could also test your JS interface from your Java code using:
myWebView.loadUrl("javascript:window.Android.showToast('Hi!');");
I hope this help you!

android webview bind javascript to android code

Hi i'm setting up my first webview app in android and i try to make my javascript code calls the android code according to this tutorial :
http://android.programmerguru.com/binding-javascript-and-android-code-example/
What i'm trying exactly to do is to play a sound on an onclick event like in my website but it's pretty slow and i read many post on it and i understood why i should use another way to do that.
As i found the tutorial i put in the previous link, i tried to make it work in this way but nothing happened. I create "raw" folder and put in it "click.mp3" file.
I'm probably forgetting something but i don't find it...
MyActivity.java files:
package com.example.mywebviewapp;
import android.media.MediaPlayer;
import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.webkit.WebSettings;
import android.webkit.WebView;
public class MyActivity extends Activity {
private WebView mWebView;
MediaPlayer mysound;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_my);
mWebView = (WebView) findViewById(R.id.activity_main_webview);
// Enable Javascript
WebSettings webSettings = mWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
//Inject WebAppInterface methods into Web page by having Interface name 'Android'
mWebView.addJavascriptInterface(new WebAppInterface(this), "Android");
mWebView.loadUrl("http://mywebsite.com");
}
public class WebAppInterface{
public void soundAndroClick(){
mysound = MediaPlayer.create(MyActivity.this, R.raw.click);
mysound.start();
}
}
}
and i call the method soundAndroClick() in my main.js file like that:
function soundAndroid(){
Android.soundAndroClick();
}

need help for android webview

I am using this simple code http://www.w3schools.com/js/tryit.asp?filename=tryjs_alert
This shows me alert box, but when I try it with webview in android, it doen't show me an alert box
webview.getSettings().setJavaScriptEnabled(true);
webview.loadUrl("file:///android_asset/test.html");
What am I doing wrong or what is missing here
Thanks
Did you look Android:How to add support the javascript alert box in WebViewClient?
I finally got the solution for the question asked above by me :
package android.com.Webview;
import android.app.Activity;
import android.os.Bundle;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
public class WebviewActivity extends Activity {
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
WebView webview = (WebView) findViewById(R.id.webview);
webview.getSettings().setJavaScriptEnabled(true);
WebSettings webSettings = webview.getSettings();
webSettings.setJavaScriptEnabled(true);
webSettings.setBuiltInZoomControls(true);
webview.requestFocusFromTouch();
webview.setWebViewClient(new WebViewClient());
webview.setWebChromeClient(new WebChromeClient());
webview.loadUrl("file:///android_asset/test.html");
}
}

Categories

Resources