WebView using custom JavaScript for callbacks in Android

Let's talk about why we need to discuss this issue.

Now a lot of mobile applications, may be directly embedded in a Web page. The advantages of this: one is the function of the update is convenient, easy to maintain, only need to maintain the server's page, do not need to update the client, the other is a universal function, not only Android can be used, iOS can also be used, Symbian can also be used directly.

So why are so many mobile apps not web-like? There are many reasons. One is that the Web mode is relatively weak, if the application of aesthetic requirements are relatively high, you can not use the web; one is that the web is relatively slow, the user experience will be affected, one is the current traffic is relatively valuable, the web traffic is relatively large And there's a few features that can't be implemented using the Web (for this, now many open source projects can implement some of the phone's hardware features, such as photo, get contacts Ah, are can, interested can search for phonegap. But from the existing feedback, the speed is slow, the experience is poor).

For these reasons, many projects now make a part of the functionality Web-based, with some functions written in other controls. This requires some interaction between Web pages and other controls. How to interact is the use of custom JavaScript.

The following virtual one scenario.

Now there is a function to show the current user's friend list, the Friend list page is the Web way, click on a friend's avatar, then go to the friend's details page, and this page, for some reason, did not make the web way.

Suppose the Buddy list page is userlistactivity and contains a webview. The Buddy details page is userdetailactivity and contains many controls and business logic.

We uniquely label the user with an ID. Friends List page, click on each friend's avatar, will call:

onclick= "Javascript:android.user (' 1 ')"

A JS statement like this. Because this article mainly introduces Android, rather than web development content, so specific no longer detailed, familiar with the web development of the students are easy to understand.

What we need to do now is to display the user list page and then, after the user clicks on the avatar, respond to the specific JS request and jump to the friend detail page.

Here's a look at the approximate implementation method.

By default, JavaScript is not available in WebView. You can use the following code:

1. WebView Mywebview = (WebView) Findviewbyid (R.id.webview);
3. WebSettings websettings = Mywebview.getsettings ();
5. Websettings.setjavascriptenabled (true);

Make JavaScript functionality available. This part of the code is placed in the OnCreate () method in Userlistactivity.

Then register the JS interface. Let's look at one way to WebView.

public void Addjavascriptinterface (Object obj, String InterfaceName)

SINCE:API Level 1

The use of this function to bind a object to JavaScript so, the methods can is accessed from JavaScript.

IMPORTANT:

· Using addjavascriptinterface () allows JavaScript to control your application. This can be a very useful feature or a dangerous security issue. When the HTML in the WebView are untrustworthy (for example, part or all of the HTML are provided by some person or process) , then a attacker could inject HTML that would execute your code and possibly any code of the attacker ' s choosing.
Do not use Addjavascriptinterface () unless all of the HTML in this WebView is written by you.

· The Java object, which is bound runs in another thread, and not in the thread, that it's constructed in.

Parameters

Obj	The class instance to bind to JavaScript, NULL instances is ignored.
InterfaceName	The name to used to expose the instance in JavaScript.

We add the following statement to the OnCreate () method of the Userlistactivity class:

Mwebview.addjavascriptinterface (This, "Android");

Add the following method to the Userlistactivity class:

Public void user (String ID) {

Get ID, jump activity.

}

This allows the page to map to the user () method of the Userlistactivity object when the onclick= "Javascript:android.user (' 1 ')" statement is called.

Here the user method has a parameter that corresponds to the user (' 1 ') of the JS statement.

All the code is attached below.

Android part of the code:

2. Package com.arui.framework.android.js;
10. Import android.app.Activity;
14. Import android.content.Intent;
18. Import Android.os.Bundle;
22. Import Android.view.View;
26. Import android.webkit.WebSettings;
30. Import Android.webkit.WebView;
38. Import COM.ARUI.FRAMEWORK.R;
42. Import com.arui.framework.android.js.UserDetailActivity;
50. Public class Userlistactivity extends Activity {
58. private WebView Mwebview;
66. @Override
70. public void OnCreate (Bundle savedinstancestate) {
78. super.oncreate (savedinstancestate);
86. Setcontentview (r.id.userlist);
94. Mwebview = (WebView) Findviewbyid (R.id.mywebview);
98. WebSettings websetting = Mwebview.getsettings ();
102. //Set JS available
106. Websetting.setjavascriptenabled (true);
110. //Add JS Call interface
114. Mwebview.addjavascriptinterface (This, "Android");
118. //loading a specific Web address
122. Mwebview.loadurl ("http://blog.csdn.net/arui319");
126. Mwebview.setvisibility (view.visible);
130. Mwebview.requestfocus ();
134. }
142. public void user (String id) {
146. //Jump activity
150. Intent Intent = new Intent (This, userdetailactivity.   Class);
154. Intent.putextra ("id", id);
158. StartActivity (Intent);
162. }
166. }

Resource file:

2. <? XML version= "1.0" encoding="Utf-8"?>
6. <LinearLayout
10. xmlns:android="http://schemas.android.com/apk/res/android"
14. android:orientation="vertical"
18. android:layout_width="fill_parent"
22. android:layout_height="fill_parent" >
26. <WebView
30. android:id="@+id/mywebview"
34. android:layout_width="fill_parent"
38. android:layout_height="fill_parent"
42. android:visibility="Gone"/>
46. </linearlayout>

Local code for Web pages:

---------------------------------------------------------------------------

GL (arui319)

http://blog.csdn.net/arui319

< This article can be reproduced, but please keep the above author information. Thank you. >

---------------------------------------------------------------------------

WebView using custom JavaScript for callbacks in Android